@instructure/ui-themes 11.7.4-snapshot-127 → 11.7.4-snapshot-128

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 (64) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/es/themes/newThemeTokens/dark/components/badge.js +4 -3
  3. package/es/themes/newThemeTokens/dark/components/baseButton.js +11 -4
  4. package/es/themes/newThemeTokens/dark/components/truncateText.js +1 -2
  5. package/es/themes/newThemeTokens/legacyCanvas/components/badge.js +5 -4
  6. package/es/themes/newThemeTokens/legacyCanvas/components/truncateText.js +1 -2
  7. package/es/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.js +5 -4
  8. package/es/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.js +1 -2
  9. package/es/themes/newThemeTokens/light/components/badge.js +4 -3
  10. package/es/themes/newThemeTokens/light/components/baseButton.js +11 -4
  11. package/es/themes/newThemeTokens/light/components/truncateText.js +1 -2
  12. package/es/themes/newThemeTokens/light/semantics.js +1 -1
  13. package/lib/themes/newThemeTokens/dark/components/badge.js +4 -3
  14. package/lib/themes/newThemeTokens/dark/components/baseButton.js +11 -4
  15. package/lib/themes/newThemeTokens/dark/components/truncateText.js +1 -2
  16. package/lib/themes/newThemeTokens/legacyCanvas/components/badge.js +5 -4
  17. package/lib/themes/newThemeTokens/legacyCanvas/components/truncateText.js +1 -2
  18. package/lib/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.js +5 -4
  19. package/lib/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.js +1 -2
  20. package/lib/themes/newThemeTokens/light/components/badge.js +4 -3
  21. package/lib/themes/newThemeTokens/light/components/baseButton.js +11 -4
  22. package/lib/themes/newThemeTokens/light/components/truncateText.js +1 -2
  23. package/lib/themes/newThemeTokens/light/semantics.js +1 -1
  24. package/package.json +3 -3
  25. package/src/themes/newThemeTokens/componentTypes/badge.ts +1 -0
  26. package/src/themes/newThemeTokens/componentTypes/truncateText.ts +1 -1
  27. package/src/themes/newThemeTokens/dark/components/badge.ts +3 -2
  28. package/src/themes/newThemeTokens/dark/components/baseButton.ts +7 -4
  29. package/src/themes/newThemeTokens/dark/components/truncateText.ts +1 -4
  30. package/src/themes/newThemeTokens/legacyCanvas/components/badge.ts +4 -3
  31. package/src/themes/newThemeTokens/legacyCanvas/components/truncateText.ts +1 -4
  32. package/src/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.ts +4 -3
  33. package/src/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.ts +1 -4
  34. package/src/themes/newThemeTokens/light/components/badge.ts +3 -2
  35. package/src/themes/newThemeTokens/light/components/baseButton.ts +7 -4
  36. package/src/themes/newThemeTokens/light/components/truncateText.ts +1 -4
  37. package/src/themes/newThemeTokens/light/semantics.ts +2 -2
  38. package/tsconfig.build.tsbuildinfo +1 -1
  39. package/types/themes/newThemeTokens/componentTypes/badge.d.ts +1 -0
  40. package/types/themes/newThemeTokens/componentTypes/badge.d.ts.map +1 -1
  41. package/types/themes/newThemeTokens/componentTypes/truncateText.d.ts +0 -1
  42. package/types/themes/newThemeTokens/componentTypes/truncateText.d.ts.map +1 -1
  43. package/types/themes/newThemeTokens/dark/components/badge.d.ts +1 -0
  44. package/types/themes/newThemeTokens/dark/components/badge.d.ts.map +1 -1
  45. package/types/themes/newThemeTokens/dark/components/baseButton.d.ts +8 -1
  46. package/types/themes/newThemeTokens/dark/components/baseButton.d.ts.map +1 -1
  47. package/types/themes/newThemeTokens/dark/components/truncateText.d.ts +0 -1
  48. package/types/themes/newThemeTokens/dark/components/truncateText.d.ts.map +1 -1
  49. package/types/themes/newThemeTokens/legacyCanvas/components/badge.d.ts +2 -1
  50. package/types/themes/newThemeTokens/legacyCanvas/components/badge.d.ts.map +1 -1
  51. package/types/themes/newThemeTokens/legacyCanvas/components/truncateText.d.ts +0 -1
  52. package/types/themes/newThemeTokens/legacyCanvas/components/truncateText.d.ts.map +1 -1
  53. package/types/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.d.ts +2 -1
  54. package/types/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.d.ts.map +1 -1
  55. package/types/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.d.ts +0 -1
  56. package/types/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.d.ts.map +1 -1
  57. package/types/themes/newThemeTokens/light/components/badge.d.ts +1 -0
  58. package/types/themes/newThemeTokens/light/components/badge.d.ts.map +1 -1
  59. package/types/themes/newThemeTokens/light/components/baseButton.d.ts +8 -1
  60. package/types/themes/newThemeTokens/light/components/baseButton.d.ts.map +1 -1
  61. package/types/themes/newThemeTokens/light/components/truncateText.d.ts +0 -1
  62. package/types/themes/newThemeTokens/light/components/truncateText.d.ts.map +1 -1
  63. package/types/themes/newThemeTokens/light/semantics.d.ts +1 -1
  64. package/types/themes/newThemeTokens/light/semantics.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -3,7 +3,7 @@
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
- ## [11.7.4-snapshot-127](https://github.com/instructure/instructure-ui/compare/v11.7.3...v11.7.4-snapshot-127) (2026-07-22)
6
+ ## [11.7.4-snapshot-128](https://github.com/instructure/instructure-ui/compare/v11.7.3...v11.7.4-snapshot-128) (2026-07-22)
7
7
 
8
8
  **Note:** Version bump only for package @instructure/ui-themes
9
9
 
package/es/themes/newThemeTokens/dark/components/badge.js CHANGED
@@ -30,14 +30,15 @@ const badge = semantic => ({
30
30
  colorDanger: semantic.color.background.error,
31
31
  colorSuccess: semantic.color.background.success,
32
32
  colorPrimary: semantic.color.institutional.brandPrimary,
33
- fontSize: semantic.fontSize.textSm,
33
+ fontSize: semantic.fontSize.textXs,
34
34
  fontWeight: semantic.fontWeight.body.strong,
35
35
  sizeNotification: "0.75rem",
36
- size: "1.25rem",
36
+ size: "1rem",
37
37
  padding: semantic.spacing.spaceXs,
38
38
  notificationOffset: "0.125rem",
39
39
  notificationZIndex: 1,
40
40
  pulseBorderThickness: "0.125rem",
41
- countOffset: "0.5rem"
41
+ countOffset: "0.5rem",
42
+ primaryTextColor: semantic.color.text.inverse
42
43
  });
43
44
  export default badge;
package/es/themes/newThemeTokens/dark/components/baseButton.js CHANGED
@@ -50,7 +50,7 @@ const baseButton = semantic => ({
50
50
  value: semantic.color.institutional.brandButtonPrimaryBgd,
51
51
  modify: {
52
52
  type: "alpha",
53
- value: 0.1,
53
+ value: 0.2,
54
54
  space: "hsl"
55
55
  }
56
56
  },
@@ -58,7 +58,7 @@ const baseButton = semantic => ({
58
58
  value: semantic.color.institutional.brandButtonPrimaryBgd,
59
59
  modify: {
60
60
  type: "alpha",
61
- value: 0.2,
61
+ value: 0.4,
62
62
  space: "hsl"
63
63
  }
64
64
  },
@@ -67,7 +67,7 @@ const baseButton = semantic => ({
67
67
  value: semantic.color.institutional.brandButtonPrimaryBgd,
68
68
  modify: {
69
69
  type: "alpha",
70
- value: 0.05,
70
+ value: 0.1,
71
71
  space: "hsl"
72
72
  }
73
73
  },
@@ -134,7 +134,14 @@ const baseButton = semantic => ({
134
134
  secondaryDisabledBackgroundColor: semantic.color.background.interactive.action.secondary.disabled,
135
135
  secondaryDisabledBorderColor: semantic.color.stroke.interactive.action.secondary.disabled,
136
136
  secondaryDisabledTextColor: semantic.color.text.interactive.action.secondary.disabled,
137
- secondaryGhostBorderColor: semantic.color.institutional.brandButtonSecondaryText,
137
+ secondaryGhostBorderColor: {
138
+ value: semantic.color.institutional.brandButtonSecondaryText,
139
+ modify: {
140
+ type: "alpha",
141
+ value: 0.2,
142
+ space: "hsl"
143
+ }
144
+ },
138
145
  secondaryGhostColor: semantic.color.institutional.brandButtonSecondaryText,
139
146
  secondaryGhostHoverBackground: semantic.color.institutional.brandButtonSecondaryBgd,
140
147
  secondaryHoverBackground: {
package/es/themes/newThemeTokens/dark/components/truncateText.js CHANGED
@@ -23,7 +23,6 @@
23
23
  */
24
24
 
25
25
  const truncateText = semantic => ({
26
- fontFamily: semantic.fontFamily.base,
27
- lineHeight: semantic.lineHeight.paragraph.base
26
+ fontFamily: semantic.fontFamily.base
28
27
  });
29
28
  export default truncateText;
package/es/themes/newThemeTokens/legacyCanvas/components/badge.js CHANGED
@@ -30,14 +30,15 @@ const badge = semantic => ({
30
30
  colorDanger: semantic.color.background.error,
31
31
  colorSuccess: semantic.color.background.success,
32
32
  colorPrimary: semantic.color.institutional.brandPrimary,
33
- fontSize: semantic.fontSize.textSm,
33
+ fontSize: semantic.fontSize.textXs,
34
34
  fontWeight: semantic.fontWeight.body.strong,
35
35
  sizeNotification: "0.75rem",
36
- size: "1.25rem",
36
+ size: "1rem",
37
37
  padding: semantic.spacing.spaceXs,
38
- notificationZIndex: 1,
39
38
  notificationOffset: "0.125rem",
39
+ notificationZIndex: 1,
40
40
  pulseBorderThickness: "0.125rem",
41
- countOffset: "0.5rem"
41
+ countOffset: "0.5rem",
42
+ primaryTextColor: semantic.color.text.inverse
42
43
  });
43
44
  export default badge;
package/es/themes/newThemeTokens/legacyCanvas/components/truncateText.js CHANGED
@@ -23,7 +23,6 @@
23
23
  */
24
24
 
25
25
  const truncateText = semantic => ({
26
- fontFamily: semantic.fontFamily.base,
27
- lineHeight: semantic.lineHeight.paragraph.base
26
+ fontFamily: semantic.fontFamily.base
28
27
  });
29
28
  export default truncateText;
package/es/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.js CHANGED
@@ -30,14 +30,15 @@ const badge = semantic => ({
30
30
  colorDanger: semantic.color.background.error,
31
31
  colorSuccess: semantic.color.background.success,
32
32
  colorPrimary: semantic.color.institutional.brandPrimary,
33
- fontSize: semantic.fontSize.textSm,
33
+ fontSize: semantic.fontSize.textXs,
34
34
  fontWeight: semantic.fontWeight.body.strong,
35
35
  sizeNotification: "0.75rem",
36
- size: "1.25rem",
36
+ size: "1rem",
37
37
  padding: semantic.spacing.spaceXs,
38
- notificationZIndex: 1,
39
38
  notificationOffset: "0.125rem",
39
+ notificationZIndex: 1,
40
40
  pulseBorderThickness: "0.125rem",
41
- countOffset: "0.5rem"
41
+ countOffset: "0.5rem",
42
+ primaryTextColor: semantic.color.text.inverse
42
43
  });
43
44
  export default badge;
package/es/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.js CHANGED
@@ -23,7 +23,6 @@
23
23
  */
24
24
 
25
25
  const truncateText = semantic => ({
26
- fontFamily: semantic.fontFamily.base,
27
- lineHeight: semantic.lineHeight.paragraph.base
26
+ fontFamily: semantic.fontFamily.base
28
27
  });
29
28
  export default truncateText;
package/es/themes/newThemeTokens/light/components/badge.js CHANGED
@@ -30,14 +30,15 @@ const badge = semantic => ({
30
30
  colorDanger: semantic.color.background.error,
31
31
  colorSuccess: semantic.color.background.success,
32
32
  colorPrimary: semantic.color.institutional.brandPrimary,
33
- fontSize: semantic.fontSize.textSm,
33
+ fontSize: semantic.fontSize.textXs,
34
34
  fontWeight: semantic.fontWeight.body.strong,
35
35
  sizeNotification: "0.75rem",
36
- size: "1.25rem",
36
+ size: "1rem",
37
37
  padding: semantic.spacing.spaceXs,
38
38
  notificationOffset: "0.125rem",
39
39
  notificationZIndex: 1,
40
40
  pulseBorderThickness: "0.125rem",
41
- countOffset: "0.5rem"
41
+ countOffset: "0.5rem",
42
+ primaryTextColor: semantic.color.text.inverse
42
43
  });
43
44
  export default badge;
package/es/themes/newThemeTokens/light/components/baseButton.js CHANGED
@@ -50,7 +50,7 @@ const baseButton = semantic => ({
50
50
  value: semantic.color.institutional.brandButtonPrimaryBgd,
51
51
  modify: {
52
52
  type: "alpha",
53
- value: 0.1,
53
+ value: 0.2,
54
54
  space: "hsl"
55
55
  }
56
56
  },
@@ -58,7 +58,7 @@ const baseButton = semantic => ({
58
58
  value: semantic.color.institutional.brandButtonPrimaryBgd,
59
59
  modify: {
60
60
  type: "alpha",
61
- value: 0.2,
61
+ value: 0.4,
62
62
  space: "hsl"
63
63
  }
64
64
  },
@@ -67,7 +67,7 @@ const baseButton = semantic => ({
67
67
  value: semantic.color.institutional.brandButtonPrimaryBgd,
68
68
  modify: {
69
69
  type: "alpha",
70
- value: 0.05,
70
+ value: 0.1,
71
71
  space: "hsl"
72
72
  }
73
73
  },
@@ -134,7 +134,14 @@ const baseButton = semantic => ({
134
134
  secondaryDisabledBackgroundColor: semantic.color.background.interactive.action.secondary.disabled,
135
135
  secondaryDisabledBorderColor: semantic.color.stroke.interactive.action.secondary.disabled,
136
136
  secondaryDisabledTextColor: semantic.color.text.interactive.action.secondary.disabled,
137
- secondaryGhostBorderColor: semantic.color.institutional.brandButtonSecondaryText,
137
+ secondaryGhostBorderColor: {
138
+ value: semantic.color.institutional.brandButtonSecondaryText,
139
+ modify: {
140
+ type: "alpha",
141
+ value: 0.2,
142
+ space: "hsl"
143
+ }
144
+ },
138
145
  secondaryGhostColor: semantic.color.institutional.brandButtonSecondaryText,
139
146
  secondaryGhostHoverBackground: semantic.color.institutional.brandButtonSecondaryBgd,
140
147
  secondaryHoverBackground: {
package/es/themes/newThemeTokens/light/components/truncateText.js CHANGED
@@ -23,7 +23,6 @@
23
23
  */
24
24
 
25
25
  const truncateText = semantic => ({
26
- fontFamily: semantic.fontFamily.base,
27
- lineHeight: semantic.lineHeight.paragraph.base
26
+ fontFamily: semantic.fontFamily.base
28
27
  });
29
28
  export default truncateText;
package/es/themes/newThemeTokens/light/semantics.js CHANGED
@@ -719,7 +719,7 @@ const semantics = primitives => ({
719
719
  },
720
720
  "brandButtonSecondaryText": primitives.color.navy.navy170,
721
721
  "brandGlobalNavBgd": primitives.color.white,
722
- "globalNavLinkHover": primitives.color.grey.grey170,
722
+ "globalNavLinkHover": primitives.color.navy.navy10,
723
723
  "brandGlobalNavMenuItemTextColor": primitives.color.grey.grey170,
724
724
  "brandGlobalNavMenuItemTextColorActive": primitives.color.white
725
725
  }
package/lib/themes/newThemeTokens/dark/components/badge.js CHANGED
@@ -36,14 +36,15 @@ const badge = semantic => ({
36
36
  colorDanger: semantic.color.background.error,
37
37
  colorSuccess: semantic.color.background.success,
38
38
  colorPrimary: semantic.color.institutional.brandPrimary,
39
- fontSize: semantic.fontSize.textSm,
39
+ fontSize: semantic.fontSize.textXs,
40
40
  fontWeight: semantic.fontWeight.body.strong,
41
41
  sizeNotification: "0.75rem",
42
- size: "1.25rem",
42
+ size: "1rem",
43
43
  padding: semantic.spacing.spaceXs,
44
44
  notificationOffset: "0.125rem",
45
45
  notificationZIndex: 1,
46
46
  pulseBorderThickness: "0.125rem",
47
- countOffset: "0.5rem"
47
+ countOffset: "0.5rem",
48
+ primaryTextColor: semantic.color.text.inverse
48
49
  });
49
50
  var _default = exports.default = badge;
package/lib/themes/newThemeTokens/dark/components/baseButton.js CHANGED
@@ -56,7 +56,7 @@ const baseButton = semantic => ({
56
56
  value: semantic.color.institutional.brandButtonPrimaryBgd,
57
57
  modify: {
58
58
  type: "alpha",
59
- value: 0.1,
59
+ value: 0.2,
60
60
  space: "hsl"
61
61
  }
62
62
  },
@@ -64,7 +64,7 @@ const baseButton = semantic => ({
64
64
  value: semantic.color.institutional.brandButtonPrimaryBgd,
65
65
  modify: {
66
66
  type: "alpha",
67
- value: 0.2,
67
+ value: 0.4,
68
68
  space: "hsl"
69
69
  }
70
70
  },
@@ -73,7 +73,7 @@ const baseButton = semantic => ({
73
73
  value: semantic.color.institutional.brandButtonPrimaryBgd,
74
74
  modify: {
75
75
  type: "alpha",
76
- value: 0.05,
76
+ value: 0.1,
77
77
  space: "hsl"
78
78
  }
79
79
  },
@@ -140,7 +140,14 @@ const baseButton = semantic => ({
140
140
  secondaryDisabledBackgroundColor: semantic.color.background.interactive.action.secondary.disabled,
141
141
  secondaryDisabledBorderColor: semantic.color.stroke.interactive.action.secondary.disabled,
142
142
  secondaryDisabledTextColor: semantic.color.text.interactive.action.secondary.disabled,
143
- secondaryGhostBorderColor: semantic.color.institutional.brandButtonSecondaryText,
143
+ secondaryGhostBorderColor: {
144
+ value: semantic.color.institutional.brandButtonSecondaryText,
145
+ modify: {
146
+ type: "alpha",
147
+ value: 0.2,
148
+ space: "hsl"
149
+ }
150
+ },
144
151
  secondaryGhostColor: semantic.color.institutional.brandButtonSecondaryText,
145
152
  secondaryGhostHoverBackground: semantic.color.institutional.brandButtonSecondaryBgd,
146
153
  secondaryHoverBackground: {
package/lib/themes/newThemeTokens/dark/components/truncateText.js CHANGED
@@ -29,7 +29,6 @@ exports.default = void 0;
29
29
  */
30
30
 
31
31
  const truncateText = semantic => ({
32
- fontFamily: semantic.fontFamily.base,
33
- lineHeight: semantic.lineHeight.paragraph.base
32
+ fontFamily: semantic.fontFamily.base
34
33
  });
35
34
  var _default = exports.default = truncateText;
package/lib/themes/newThemeTokens/legacyCanvas/components/badge.js CHANGED
@@ -36,14 +36,15 @@ const badge = semantic => ({
36
36
  colorDanger: semantic.color.background.error,
37
37
  colorSuccess: semantic.color.background.success,
38
38
  colorPrimary: semantic.color.institutional.brandPrimary,
39
- fontSize: semantic.fontSize.textSm,
39
+ fontSize: semantic.fontSize.textXs,
40
40
  fontWeight: semantic.fontWeight.body.strong,
41
41
  sizeNotification: "0.75rem",
42
- size: "1.25rem",
42
+ size: "1rem",
43
43
  padding: semantic.spacing.spaceXs,
44
- notificationZIndex: 1,
45
44
  notificationOffset: "0.125rem",
45
+ notificationZIndex: 1,
46
46
  pulseBorderThickness: "0.125rem",
47
- countOffset: "0.5rem"
47
+ countOffset: "0.5rem",
48
+ primaryTextColor: semantic.color.text.inverse
48
49
  });
49
50
  var _default = exports.default = badge;
package/lib/themes/newThemeTokens/legacyCanvas/components/truncateText.js CHANGED
@@ -29,7 +29,6 @@ exports.default = void 0;
29
29
  */
30
30
 
31
31
  const truncateText = semantic => ({
32
- fontFamily: semantic.fontFamily.base,
33
- lineHeight: semantic.lineHeight.paragraph.base
32
+ fontFamily: semantic.fontFamily.base
34
33
  });
35
34
  var _default = exports.default = truncateText;
package/lib/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.js CHANGED
@@ -36,14 +36,15 @@ const badge = semantic => ({
36
36
  colorDanger: semantic.color.background.error,
37
37
  colorSuccess: semantic.color.background.success,
38
38
  colorPrimary: semantic.color.institutional.brandPrimary,
39
- fontSize: semantic.fontSize.textSm,
39
+ fontSize: semantic.fontSize.textXs,
40
40
  fontWeight: semantic.fontWeight.body.strong,
41
41
  sizeNotification: "0.75rem",
42
- size: "1.25rem",
42
+ size: "1rem",
43
43
  padding: semantic.spacing.spaceXs,
44
- notificationZIndex: 1,
45
44
  notificationOffset: "0.125rem",
45
+ notificationZIndex: 1,
46
46
  pulseBorderThickness: "0.125rem",
47
- countOffset: "0.5rem"
47
+ countOffset: "0.5rem",
48
+ primaryTextColor: semantic.color.text.inverse
48
49
  });
49
50
  var _default = exports.default = badge;
package/lib/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.js CHANGED
@@ -29,7 +29,6 @@ exports.default = void 0;
29
29
  */
30
30
 
31
31
  const truncateText = semantic => ({
32
- fontFamily: semantic.fontFamily.base,
33
- lineHeight: semantic.lineHeight.paragraph.base
32
+ fontFamily: semantic.fontFamily.base
34
33
  });
35
34
  var _default = exports.default = truncateText;
package/lib/themes/newThemeTokens/light/components/badge.js CHANGED
@@ -36,14 +36,15 @@ const badge = semantic => ({
36
36
  colorDanger: semantic.color.background.error,
37
37
  colorSuccess: semantic.color.background.success,
38
38
  colorPrimary: semantic.color.institutional.brandPrimary,
39
- fontSize: semantic.fontSize.textSm,
39
+ fontSize: semantic.fontSize.textXs,
40
40
  fontWeight: semantic.fontWeight.body.strong,
41
41
  sizeNotification: "0.75rem",
42
- size: "1.25rem",
42
+ size: "1rem",
43
43
  padding: semantic.spacing.spaceXs,
44
44
  notificationOffset: "0.125rem",
45
45
  notificationZIndex: 1,
46
46
  pulseBorderThickness: "0.125rem",
47
- countOffset: "0.5rem"
47
+ countOffset: "0.5rem",
48
+ primaryTextColor: semantic.color.text.inverse
48
49
  });
49
50
  var _default = exports.default = badge;
package/lib/themes/newThemeTokens/light/components/baseButton.js CHANGED
@@ -56,7 +56,7 @@ const baseButton = semantic => ({
56
56
  value: semantic.color.institutional.brandButtonPrimaryBgd,
57
57
  modify: {
58
58
  type: "alpha",
59
- value: 0.1,
59
+ value: 0.2,
60
60
  space: "hsl"
61
61
  }
62
62
  },
@@ -64,7 +64,7 @@ const baseButton = semantic => ({
64
64
  value: semantic.color.institutional.brandButtonPrimaryBgd,
65
65
  modify: {
66
66
  type: "alpha",
67
- value: 0.2,
67
+ value: 0.4,
68
68
  space: "hsl"
69
69
  }
70
70
  },
@@ -73,7 +73,7 @@ const baseButton = semantic => ({
73
73
  value: semantic.color.institutional.brandButtonPrimaryBgd,
74
74
  modify: {
75
75
  type: "alpha",
76
- value: 0.05,
76
+ value: 0.1,
77
77
  space: "hsl"
78
78
  }
79
79
  },
@@ -140,7 +140,14 @@ const baseButton = semantic => ({
140
140
  secondaryDisabledBackgroundColor: semantic.color.background.interactive.action.secondary.disabled,
141
141
  secondaryDisabledBorderColor: semantic.color.stroke.interactive.action.secondary.disabled,
142
142
  secondaryDisabledTextColor: semantic.color.text.interactive.action.secondary.disabled,
143
- secondaryGhostBorderColor: semantic.color.institutional.brandButtonSecondaryText,
143
+ secondaryGhostBorderColor: {
144
+ value: semantic.color.institutional.brandButtonSecondaryText,
145
+ modify: {
146
+ type: "alpha",
147
+ value: 0.2,
148
+ space: "hsl"
149
+ }
150
+ },
144
151
  secondaryGhostColor: semantic.color.institutional.brandButtonSecondaryText,
145
152
  secondaryGhostHoverBackground: semantic.color.institutional.brandButtonSecondaryBgd,
146
153
  secondaryHoverBackground: {
package/lib/themes/newThemeTokens/light/components/truncateText.js CHANGED
@@ -29,7 +29,6 @@ exports.default = void 0;
29
29
  */
30
30
 
31
31
  const truncateText = semantic => ({
32
- fontFamily: semantic.fontFamily.base,
33
- lineHeight: semantic.lineHeight.paragraph.base
32
+ fontFamily: semantic.fontFamily.base
34
33
  });
35
34
  var _default = exports.default = truncateText;
package/lib/themes/newThemeTokens/light/semantics.js CHANGED
@@ -725,7 +725,7 @@ const semantics = primitives => ({
725
725
  },
726
726
  "brandButtonSecondaryText": primitives.color.navy.navy170,
727
727
  "brandGlobalNavBgd": primitives.color.white,
728
- "globalNavLinkHover": primitives.color.grey.grey170,
728
+ "globalNavLinkHover": primitives.color.navy.navy10,
729
729
  "brandGlobalNavMenuItemTextColor": primitives.color.grey.grey170,
730
730
  "brandGlobalNavMenuItemTextColorActive": primitives.color.white
731
731
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-themes",
3
- "version": "11.7.4-snapshot-127",
3
+ "version": "11.7.4-snapshot-128",
4
4
  "description": "A library of instructure themes",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -17,12 +17,12 @@
17
17
  "@testing-library/jest-dom": "^6.9.1",
18
18
  "@testing-library/react": "16.3.2",
19
19
  "vitest": "^4.1.9",
20
- "@instructure/ui-babel-preset": "11.7.4-snapshot-127"
20
+ "@instructure/ui-babel-preset": "11.7.4-snapshot-128"
21
21
  },
22
22
  "dependencies": {
23
23
  "@babel/runtime": "^7.29.7",
24
24
  "@tokens-studio/types": "^0.5.2",
25
- "@instructure/shared-types": "11.7.4-snapshot-127"
25
+ "@instructure/shared-types": "11.7.4-snapshot-128"
26
26
  },
27
27
  "publishConfig": {
28
28
  "access": "public"
package/src/themes/newThemeTokens/componentTypes/badge.ts CHANGED
@@ -39,6 +39,7 @@ export type Badge = {
39
39
  notificationZIndex: number
40
40
  pulseBorderThickness: string | number
41
41
  countOffset: string | number
42
+ primaryTextColor: string
42
43
  }
43
44
 
44
45
  export default Badge
package/src/themes/newThemeTokens/componentTypes/truncateText.ts CHANGED
@@ -22,6 +22,6 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
 
25
- export type TruncateText = { fontFamily: string; lineHeight: string | number }
25
+ export type TruncateText = { fontFamily: string }
26
26
 
27
27
  export default TruncateText
package/src/themes/newThemeTokens/dark/components/badge.ts CHANGED
@@ -32,14 +32,15 @@ const badge = (semantic: Semantics) => ({
32
32
  colorDanger: semantic.color.background.error,
33
33
  colorSuccess: semantic.color.background.success,
34
34
  colorPrimary: semantic.color.institutional.brandPrimary,
35
- fontSize: semantic.fontSize.textSm,
35
+ fontSize: semantic.fontSize.textXs,
36
36
  fontWeight: semantic.fontWeight.body.strong,
37
37
  sizeNotification: "0.75rem",
38
- size: "1.25rem",
38
+ size: "1rem",
39
39
  padding: semantic.spacing.spaceXs,
40
40
  notificationOffset: "0.125rem",
41
41
  notificationZIndex: 1,
42
42
  pulseBorderThickness: "0.125rem",
43
43
  countOffset: "0.5rem",
44
+ primaryTextColor: semantic.color.text.inverse,
44
45
  })
45
46
  export default badge
package/src/themes/newThemeTokens/dark/components/baseButton.ts CHANGED
@@ -42,16 +42,16 @@ const baseButton = (semantic: Semantics) => ({
42
42
  primaryDisabledTextColor: semantic.color.text.interactive.action.primary.disabled,
43
43
  primaryGhostActiveBackground: {
44
44
  value: semantic.color.institutional.brandButtonPrimaryBgd,
45
- modify: { type: "alpha", value: 0.1, space: "hsl" },
45
+ modify: { type: "alpha", value: 0.2, space: "hsl" },
46
46
  },
47
47
  primaryGhostBorderColor: {
48
48
  value: semantic.color.institutional.brandButtonPrimaryBgd,
49
- modify: { type: "alpha", value: 0.2, space: "hsl" },
49
+ modify: { type: "alpha", value: 0.4, space: "hsl" },
50
50
  },
51
51
  primaryGhostColor: semantic.color.institutional.brandButtonPrimaryBgd,
52
52
  primaryGhostHoverBackground: {
53
53
  value: semantic.color.institutional.brandButtonPrimaryBgd,
54
- modify: { type: "alpha", value: 0.05, space: "hsl" },
54
+ modify: { type: "alpha", value: 0.1, space: "hsl" },
55
55
  },
56
56
  primaryHoverBackground: {
57
57
  value: semantic.color.institutional.brandButtonPrimaryBgd,
@@ -96,7 +96,10 @@ const baseButton = (semantic: Semantics) => ({
96
96
  secondaryDisabledBackgroundColor: semantic.color.background.interactive.action.secondary.disabled,
97
97
  secondaryDisabledBorderColor: semantic.color.stroke.interactive.action.secondary.disabled,
98
98
  secondaryDisabledTextColor: semantic.color.text.interactive.action.secondary.disabled,
99
- secondaryGhostBorderColor: semantic.color.institutional.brandButtonSecondaryText,
99
+ secondaryGhostBorderColor: {
100
+ value: semantic.color.institutional.brandButtonSecondaryText,
101
+ modify: { type: "alpha", value: 0.2, space: "hsl" },
102
+ },
100
103
  secondaryGhostColor: semantic.color.institutional.brandButtonSecondaryText,
101
104
  secondaryGhostHoverBackground: semantic.color.institutional.brandButtonSecondaryBgd,
102
105
  secondaryHoverBackground: {
package/src/themes/newThemeTokens/dark/components/truncateText.ts CHANGED
@@ -24,8 +24,5 @@
24
24
 
25
25
  import type { Semantics } from "../semantics"
26
26
 
27
- const truncateText = (semantic: Semantics) => ({
28
- fontFamily: semantic.fontFamily.base,
29
- lineHeight: semantic.lineHeight.paragraph.base,
30
- })
27
+ const truncateText = (semantic: Semantics) => ({ fontFamily: semantic.fontFamily.base })
31
28
  export default truncateText
package/src/themes/newThemeTokens/legacyCanvas/components/badge.ts CHANGED
@@ -32,14 +32,15 @@ const badge = (semantic: Semantics) => ({
32
32
  colorDanger: semantic.color.background.error,
33
33
  colorSuccess: semantic.color.background.success,
34
34
  colorPrimary: semantic.color.institutional.brandPrimary,
35
- fontSize: semantic.fontSize.textSm,
35
+ fontSize: semantic.fontSize.textXs,
36
36
  fontWeight: semantic.fontWeight.body.strong,
37
37
  sizeNotification: "0.75rem",
38
- size: "1.25rem",
38
+ size: "1rem",
39
39
  padding: semantic.spacing.spaceXs,
40
- notificationZIndex: 1,
41
40
  notificationOffset: "0.125rem",
41
+ notificationZIndex: 1,
42
42
  pulseBorderThickness: "0.125rem",
43
43
  countOffset: "0.5rem",
44
+ primaryTextColor: semantic.color.text.inverse,
44
45
  })
45
46
  export default badge
package/src/themes/newThemeTokens/legacyCanvas/components/truncateText.ts CHANGED
@@ -24,8 +24,5 @@
24
24
 
25
25
  import type { Semantics } from "../semantics"
26
26
 
27
- const truncateText = (semantic: Semantics) => ({
28
- fontFamily: semantic.fontFamily.base,
29
- lineHeight: semantic.lineHeight.paragraph.base,
30
- })
27
+ const truncateText = (semantic: Semantics) => ({ fontFamily: semantic.fontFamily.base })
31
28
  export default truncateText
package/src/themes/newThemeTokens/legacyCanvasHighContrast/components/badge.ts CHANGED
@@ -32,14 +32,15 @@ const badge = (semantic: Semantics) => ({
32
32
  colorDanger: semantic.color.background.error,
33
33
  colorSuccess: semantic.color.background.success,
34
34
  colorPrimary: semantic.color.institutional.brandPrimary,
35
- fontSize: semantic.fontSize.textSm,
35
+ fontSize: semantic.fontSize.textXs,
36
36
  fontWeight: semantic.fontWeight.body.strong,
37
37
  sizeNotification: "0.75rem",
38
- size: "1.25rem",
38
+ size: "1rem",
39
39
  padding: semantic.spacing.spaceXs,
40
- notificationZIndex: 1,
41
40
  notificationOffset: "0.125rem",
41
+ notificationZIndex: 1,
42
42
  pulseBorderThickness: "0.125rem",
43
43
  countOffset: "0.5rem",
44
+ primaryTextColor: semantic.color.text.inverse,
44
45
  })
45
46
  export default badge
package/src/themes/newThemeTokens/legacyCanvasHighContrast/components/truncateText.ts CHANGED
@@ -24,8 +24,5 @@
24
24
 
25
25
  import type { Semantics } from "../semantics"
26
26
 
27
- const truncateText = (semantic: Semantics) => ({
28
- fontFamily: semantic.fontFamily.base,
29
- lineHeight: semantic.lineHeight.paragraph.base,
30
- })
27
+ const truncateText = (semantic: Semantics) => ({ fontFamily: semantic.fontFamily.base })
31
28
  export default truncateText
package/src/themes/newThemeTokens/light/components/badge.ts CHANGED
@@ -32,14 +32,15 @@ const badge = (semantic: Semantics) => ({
32
32
  colorDanger: semantic.color.background.error,
33
33
  colorSuccess: semantic.color.background.success,
34
34
  colorPrimary: semantic.color.institutional.brandPrimary,
35
- fontSize: semantic.fontSize.textSm,
35
+ fontSize: semantic.fontSize.textXs,
36
36
  fontWeight: semantic.fontWeight.body.strong,
37
37
  sizeNotification: "0.75rem",
38
- size: "1.25rem",
38
+ size: "1rem",
39
39
  padding: semantic.spacing.spaceXs,
40
40
  notificationOffset: "0.125rem",
41
41
  notificationZIndex: 1,
42
42
  pulseBorderThickness: "0.125rem",
43
43
  countOffset: "0.5rem",
44
+ primaryTextColor: semantic.color.text.inverse,
44
45
  })
45
46
  export default badge