@instructure/ui-billboard 9.5.2-snapshot-0 → 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.
Files changed (6) hide show
  1. package/CHANGELOG.md +10 -2
  2. package/es/Billboard/theme.js +10 -9
  3. package/lib/Billboard/theme.js +10 -9
  4. package/package.json +13 -13
  5. package/src/Billboard/theme.ts +9 -9
  6. package/tsconfig.build.tsbuildinfo +1 -1
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-0](https://github.com/instructure/instructure-ui/compare/v9.5.1...v9.5.2-snapshot-0) (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-billboard
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/Billboard/theme.js CHANGED
@@ -30,6 +30,7 @@
30
30
  * @return {Object} The final theme object with the overrides and component variables
31
31
  */
32
32
  const generateComponentTheme = theme => {
33
+ var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7, _colors$contrasts8, _colors$contrasts9;
33
34
  const borders = theme.borders,
34
35
  colors = theme.colors,
35
36
  spacing = theme.spacing,
@@ -47,22 +48,22 @@ const generateComponentTheme = theme => {
47
48
  paddingSmall: spacing === null || spacing === void 0 ? void 0 : spacing.small,
48
49
  paddingMedium: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
49
50
  paddingLarge: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
50
- iconColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
51
+ iconColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.grey4570,
51
52
  mediumMargin: spacing === null || spacing === void 0 ? void 0 : spacing.small,
52
53
  largeMargin: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
53
- iconHoverColor: colors === null || colors === void 0 ? void 0 : colors.textLink,
54
- backgroundColor: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
55
- iconHoverColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLightest,
54
+ iconHoverColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.blue4570,
55
+ backgroundColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.white1010,
56
+ iconHoverColorInverse: colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.white1010,
56
57
  buttonBorderWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
57
58
  buttonBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusLarge,
58
- messageColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
59
- messageColorClickable: colors === null || colors === void 0 ? void 0 : colors.textLink,
60
- messageColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLight,
59
+ messageColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.blue4570,
60
+ messageColorClickable: colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.blue4570,
61
+ messageColorInverse: colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.grey1111,
61
62
  messageFontSizeSmall: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
62
63
  messageFontSizeMedium: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
63
64
  messageFontSizeLarge: typography === null || typography === void 0 ? void 0 : typography.fontSizeLarge,
64
- clickableActiveBg: colors === null || colors === void 0 ? void 0 : colors.backgroundBrand,
65
- clickableActiveText: colors === null || colors === void 0 ? void 0 : colors.textLightest,
65
+ clickableActiveBg: colors === null || colors === void 0 ? void 0 : (_colors$contrasts8 = colors.contrasts) === null || _colors$contrasts8 === void 0 ? void 0 : _colors$contrasts8.blue4570,
66
+ clickableActiveText: colors === null || colors === void 0 ? void 0 : (_colors$contrasts9 = colors.contrasts) === null || _colors$contrasts9 === void 0 ? void 0 : _colors$contrasts9.white1010,
66
67
  buttonBorderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
67
68
  buttonHoverBorderStyle: 'dashed'
68
69
  };
package/lib/Billboard/theme.js CHANGED
@@ -36,6 +36,7 @@ exports.default = void 0;
36
36
  * @return {Object} The final theme object with the overrides and component variables
37
37
  */
38
38
  const generateComponentTheme = theme => {
39
+ var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7, _colors$contrasts8, _colors$contrasts9;
39
40
  const borders = theme.borders,
40
41
  colors = theme.colors,
41
42
  spacing = theme.spacing,
@@ -53,22 +54,22 @@ const generateComponentTheme = theme => {
53
54
  paddingSmall: spacing === null || spacing === void 0 ? void 0 : spacing.small,
54
55
  paddingMedium: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
55
56
  paddingLarge: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
56
- iconColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
57
+ iconColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.grey4570,
57
58
  mediumMargin: spacing === null || spacing === void 0 ? void 0 : spacing.small,
58
59
  largeMargin: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
59
- iconHoverColor: colors === null || colors === void 0 ? void 0 : colors.textLink,
60
- backgroundColor: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
61
- iconHoverColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLightest,
60
+ iconHoverColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.blue4570,
61
+ backgroundColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.white1010,
62
+ iconHoverColorInverse: colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.white1010,
62
63
  buttonBorderWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
63
64
  buttonBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusLarge,
64
- messageColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
65
- messageColorClickable: colors === null || colors === void 0 ? void 0 : colors.textLink,
66
- messageColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLight,
65
+ messageColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.blue4570,
66
+ messageColorClickable: colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.blue4570,
67
+ messageColorInverse: colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.grey1111,
67
68
  messageFontSizeSmall: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
68
69
  messageFontSizeMedium: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
69
70
  messageFontSizeLarge: typography === null || typography === void 0 ? void 0 : typography.fontSizeLarge,
70
- clickableActiveBg: colors === null || colors === void 0 ? void 0 : colors.backgroundBrand,
71
- clickableActiveText: colors === null || colors === void 0 ? void 0 : colors.textLightest,
71
+ clickableActiveBg: colors === null || colors === void 0 ? void 0 : (_colors$contrasts8 = colors.contrasts) === null || _colors$contrasts8 === void 0 ? void 0 : _colors$contrasts8.blue4570,
72
+ clickableActiveText: colors === null || colors === void 0 ? void 0 : (_colors$contrasts9 = colors.contrasts) === null || _colors$contrasts9 === void 0 ? void 0 : _colors$contrasts9.white1010,
72
73
  buttonBorderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
73
74
  buttonHoverBorderStyle: 'dashed'
74
75
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-billboard",
3
- "version": "9.5.2-snapshot-0",
3
+ "version": "9.5.2-snapshot-7",
4
4
  "description": "A UI component to display empty states, 404 pages, redirects, etc.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,12 +23,12 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-axe-check": "9.5.2-snapshot-0",
27
- "@instructure/ui-babel-preset": "9.5.2-snapshot-0",
28
- "@instructure/ui-color-utils": "9.5.2-snapshot-0",
29
- "@instructure/ui-icons": "9.5.2-snapshot-0",
30
- "@instructure/ui-test-utils": "9.5.2-snapshot-0",
31
- "@instructure/ui-themes": "9.5.2-snapshot-0",
26
+ "@instructure/ui-axe-check": "9.5.2-snapshot-7",
27
+ "@instructure/ui-babel-preset": "9.5.2-snapshot-7",
28
+ "@instructure/ui-color-utils": "9.5.2-snapshot-7",
29
+ "@instructure/ui-icons": "9.5.2-snapshot-7",
30
+ "@instructure/ui-test-utils": "9.5.2-snapshot-7",
31
+ "@instructure/ui-themes": "9.5.2-snapshot-7",
32
32
  "@testing-library/jest-dom": "^6.4.6",
33
33
  "@testing-library/react": "^15.0.7",
34
34
  "@testing-library/user-event": "^14.5.2",
@@ -36,12 +36,12 @@
36
36
  },
37
37
  "dependencies": {
38
38
  "@babel/runtime": "^7.24.5",
39
- "@instructure/emotion": "9.5.2-snapshot-0",
40
- "@instructure/shared-types": "9.5.2-snapshot-0",
41
- "@instructure/ui-heading": "9.5.2-snapshot-0",
42
- "@instructure/ui-img": "9.5.2-snapshot-0",
43
- "@instructure/ui-react-utils": "9.5.2-snapshot-0",
44
- "@instructure/ui-view": "9.5.2-snapshot-0",
39
+ "@instructure/emotion": "9.5.2-snapshot-7",
40
+ "@instructure/shared-types": "9.5.2-snapshot-7",
41
+ "@instructure/ui-heading": "9.5.2-snapshot-7",
42
+ "@instructure/ui-img": "9.5.2-snapshot-7",
43
+ "@instructure/ui-react-utils": "9.5.2-snapshot-7",
44
+ "@instructure/ui-view": "9.5.2-snapshot-7",
45
45
  "prop-types": "^15.8.1"
46
46
  },
47
47
  "peerDependencies": {
package/src/Billboard/theme.ts CHANGED
@@ -48,22 +48,22 @@ const generateComponentTheme = (theme: Theme): BillboardTheme => {
48
48
  paddingSmall: spacing?.small,
49
49
  paddingMedium: spacing?.medium,
50
50
  paddingLarge: spacing?.medium,
51
- iconColor: colors?.textDark,
51
+ iconColor: colors?.contrasts?.grey4570,
52
52
  mediumMargin: spacing?.small,
53
53
  largeMargin: spacing?.medium,
54
- iconHoverColor: colors?.textLink,
55
- backgroundColor: colors?.backgroundLightest,
56
- iconHoverColorInverse: colors?.textLightest,
54
+ iconHoverColor: colors?.contrasts?.blue4570,
55
+ backgroundColor: colors?.contrasts?.white1010,
56
+ iconHoverColorInverse: colors?.contrasts?.white1010,
57
57
  buttonBorderWidth: borders?.widthMedium,
58
58
  buttonBorderRadius: borders?.radiusLarge,
59
- messageColor: colors?.textDark,
60
- messageColorClickable: colors?.textLink,
61
- messageColorInverse: colors?.textLight,
59
+ messageColor: colors?.contrasts?.blue4570,
60
+ messageColorClickable: colors?.contrasts?.blue4570,
61
+ messageColorInverse: colors?.contrasts?.grey1111,
62
62
  messageFontSizeSmall: typography?.fontSizeSmall,
63
63
  messageFontSizeMedium: typography?.fontSizeMedium,
64
64
  messageFontSizeLarge: typography?.fontSizeLarge,
65
- clickableActiveBg: colors?.backgroundBrand,
66
- clickableActiveText: colors?.textLightest,
65
+ clickableActiveBg: colors?.contrasts?.blue4570,
66
+ clickableActiveText: colors?.contrasts?.white1010,
67
67
  buttonBorderStyle: borders?.style,
68
68
  buttonHoverBorderStyle: 'dashed'
69
69
  }