@instructure/ui-calendar - npm Package Compare versions

Comparing version 9.5.2-snapshot-1 to 9.5.2-snapshot-7

CHANGELOG.md

@@ -6,10 +6,18 @@ # Change Log
 
-## [9.5.2-snapshot-1](https://github.com/instructure/instructure-ui/compare/v9.5.1...v9.5.2-snapshot-1) (2024-07-31)
+## [9.5.2-snapshot-7](https://github.com/instructure/instructure-ui/compare/v9.5.1...v9.5.2-snapshot-7) (2024-07-31)
 
-**Note:** Version bump only for package @instructure/ui-calendar
 
+### Features
 
+* **many:** rewrite color system ([1e5809e](https://github.com/instructure/instructure-ui/commit/1e5809e28dee8c2a71703a429609b8d2f95d76e6))
 
 
+### BREAKING CHANGES
 
+* **many:** Breaks color overrides in certain cases
+
+
+
+
+
 ## [9.5.1](https://github.com/instructure/instructure-ui/compare/v9.5.0...v9.5.1) (2024-07-30)
@@ -16,0 +24,0 @@

es/Calendar/__new-tests__/Calendar.test.js

@@ -84,3 +84,3 @@ var _Calendar, _Calendar2, _Calendar3, _Calendar4;
         var _window$getComputedSt;
-        expect((_window$getComputedSt = window.getComputedStyle(selectedDay)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.background).toBe('rgb(11, 135, 75)');
+        expect((_window$getComputedSt = window.getComputedStyle(selectedDay)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.background).toBe('rgb(3, 137, 61)');
       }
@@ -87,0 +87,0 @@ });

es/Calendar/Day/theme.js

@@ -31,2 +31,3 @@ /*
 const generateComponentTheme = theme => {
+  var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7;
   const borders = theme.borders,
@@ -45,4 +46,4 @@ colors = theme.colors,
   const componentVariables = {
-    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
-    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
+    color: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.grey125125,
+    background: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.white1010,
     fontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
@@ -52,8 +53,8 @@ padding: spacing === null || spacing === void 0 ? void 0 : spacing.xxSmall,
     minWidth: forms === null || forms === void 0 ? void 0 : forms.inputHeightSmall,
-    outsideMonthColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
-    selectedBackground: colors === null || colors === void 0 ? void 0 : colors.backgroundSuccess,
-    selectedColor: colors === null || colors === void 0 ? void 0 : colors.textLightest,
+    outsideMonthColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.grey4570,
+    selectedBackground: colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.green4570,
+    selectedColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.white1010,
     selectedBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusMedium,
-    todayBackground: colors === null || colors === void 0 ? void 0 : colors.backgroundBrand,
-    todayColor: colors === null || colors === void 0 ? void 0 : colors.textLightest,
+    todayBackground: colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.blue4570,
+    todayColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.white1010,
     todayBorderRadius: forms === null || forms === void 0 ? void 0 : forms.inputHeightSmall
@@ -60,0 +61,0 @@ };

es/Calendar/theme.js

@@ -31,2 +31,3 @@ /*
 const generateComponentTheme = theme => {
+  var _colors$contrasts, _colors$contrasts2;
   const colors = theme.colors,
@@ -45,4 +46,4 @@ typography = theme.typography,
     fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
-    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
-    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
+    color: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.grey125125,
+    background: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.white1010,
     navMargin: spacing === null || spacing === void 0 ? void 0 : spacing.small,
@@ -49,0 +50,0 @@ navWithYearMargin: spacing === null || spacing === void 0 ? void 0 : spacing.xSmall,

lib/Calendar/__new-tests__/Calendar.test.js

@@ -87,3 +87,3 @@ "use strict";
         var _window$getComputedSt;
-        expect((_window$getComputedSt = window.getComputedStyle(selectedDay)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.background).toBe('rgb(11, 135, 75)');
+        expect((_window$getComputedSt = window.getComputedStyle(selectedDay)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.background).toBe('rgb(3, 137, 61)');
       }
@@ -90,0 +90,0 @@ });

lib/Calendar/Day/theme.js

@@ -37,2 +37,3 @@ "use strict";
 const generateComponentTheme = theme => {
+  var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7;
   const borders = theme.borders,
@@ -51,4 +52,4 @@ colors = theme.colors,
   const componentVariables = {
-    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
-    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
+    color: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.grey125125,
+    background: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.white1010,
     fontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
@@ -58,8 +59,8 @@ padding: spacing === null || spacing === void 0 ? void 0 : spacing.xxSmall,
     minWidth: forms === null || forms === void 0 ? void 0 : forms.inputHeightSmall,
-    outsideMonthColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
-    selectedBackground: colors === null || colors === void 0 ? void 0 : colors.backgroundSuccess,
-    selectedColor: colors === null || colors === void 0 ? void 0 : colors.textLightest,
+    outsideMonthColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.grey4570,
+    selectedBackground: colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.green4570,
+    selectedColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.white1010,
     selectedBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusMedium,
-    todayBackground: colors === null || colors === void 0 ? void 0 : colors.backgroundBrand,
-    todayColor: colors === null || colors === void 0 ? void 0 : colors.textLightest,
+    todayBackground: colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.blue4570,
+    todayColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.white1010,
     todayBorderRadius: forms === null || forms === void 0 ? void 0 : forms.inputHeightSmall
@@ -66,0 +67,0 @@ };

lib/Calendar/theme.js

@@ -37,2 +37,3 @@ "use strict";
 const generateComponentTheme = theme => {
+  var _colors$contrasts, _colors$contrasts2;
   const colors = theme.colors,
@@ -51,4 +52,4 @@ typography = theme.typography,
     fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
-    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
-    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
+    color: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.grey125125,
+    background: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.white1010,
     navMargin: spacing === null || spacing === void 0 ? void 0 : spacing.small,
@@ -55,0 +56,0 @@ navWithYearMargin: spacing === null || spacing === void 0 ? void 0 : spacing.xSmall,

package.json

 {
   "name": "@instructure/ui-calendar",
-  "version": "9.5.2-snapshot-1",
+  "version": "9.5.2-snapshot-7",
   "description": "A calendar component.",
@@ -26,7 +26,7 @@ "author": "Instructure, Inc. Engineering and Product Design",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "9.5.2-snapshot-1",
-    "@instructure/ui-color-utils": "9.5.2-snapshot-1",
-    "@instructure/ui-test-locator": "9.5.2-snapshot-1",
-    "@instructure/ui-test-utils": "9.5.2-snapshot-1",
-    "@instructure/ui-themes": "9.5.2-snapshot-1",
+    "@instructure/ui-babel-preset": "9.5.2-snapshot-7",
+    "@instructure/ui-color-utils": "9.5.2-snapshot-7",
+    "@instructure/ui-test-locator": "9.5.2-snapshot-7",
+    "@instructure/ui-test-utils": "9.5.2-snapshot-7",
+    "@instructure/ui-themes": "9.5.2-snapshot-7",
     "@testing-library/jest-dom": "^6.4.6",
@@ -38,16 +38,16 @@ "@testing-library/react": "^15.0.7",
     "@babel/runtime": "^7.24.5",
-    "@instructure/console": "9.5.2-snapshot-1",
-    "@instructure/emotion": "9.5.2-snapshot-1",
-    "@instructure/shared-types": "9.5.2-snapshot-1",
-    "@instructure/ui-a11y-content": "9.5.2-snapshot-1",
-    "@instructure/ui-buttons": "9.5.2-snapshot-1",
-    "@instructure/ui-i18n": "9.5.2-snapshot-1",
-    "@instructure/ui-icons": "9.5.2-snapshot-1",
-    "@instructure/ui-prop-types": "9.5.2-snapshot-1",
-    "@instructure/ui-react-utils": "9.5.2-snapshot-1",
-    "@instructure/ui-simple-select": "9.5.2-snapshot-1",
-    "@instructure/ui-testable": "9.5.2-snapshot-1",
-    "@instructure/ui-utils": "9.5.2-snapshot-1",
-    "@instructure/ui-view": "9.5.2-snapshot-1",
-    "@instructure/uid": "9.5.2-snapshot-1",
+    "@instructure/console": "9.5.2-snapshot-7",
+    "@instructure/emotion": "9.5.2-snapshot-7",
+    "@instructure/shared-types": "9.5.2-snapshot-7",
+    "@instructure/ui-a11y-content": "9.5.2-snapshot-7",
+    "@instructure/ui-buttons": "9.5.2-snapshot-7",
+    "@instructure/ui-i18n": "9.5.2-snapshot-7",
+    "@instructure/ui-icons": "9.5.2-snapshot-7",
+    "@instructure/ui-prop-types": "9.5.2-snapshot-7",
+    "@instructure/ui-react-utils": "9.5.2-snapshot-7",
+    "@instructure/ui-simple-select": "9.5.2-snapshot-7",
+    "@instructure/ui-testable": "9.5.2-snapshot-7",
+    "@instructure/ui-utils": "9.5.2-snapshot-7",
+    "@instructure/ui-view": "9.5.2-snapshot-7",
+    "@instructure/uid": "9.5.2-snapshot-7",
     "prop-types": "^15.8.1"
@@ -54,0 +54,0 @@ },

src/Calendar/Day/theme.ts

@@ -44,4 +44,4 @@ /*
   const componentVariables: CalendarDayTheme = {
-    color: colors?.textDarkest,
-    background: colors?.backgroundLightest,
+    color: colors?.contrasts?.grey125125,
+    background: colors?.contrasts?.white1010,
     fontSize: typography?.fontSizeMedium,
@@ -52,10 +52,10 @@ padding: spacing?.xxSmall,
 
-    outsideMonthColor: colors?.textDark,
+    outsideMonthColor: colors?.contrasts?.grey4570,
 
-    selectedBackground: colors?.backgroundSuccess,
-    selectedColor: colors?.textLightest,
+    selectedBackground: colors?.contrasts?.green4570,
+    selectedColor: colors?.contrasts?.white1010,
     selectedBorderRadius: borders?.radiusMedium,
 
-    todayBackground: colors?.backgroundBrand,
-    todayColor: colors?.textLightest,
+    todayBackground: colors?.contrasts?.blue4570,
+    todayColor: colors?.contrasts?.white1010,
     todayBorderRadius: forms?.inputHeightSmall
@@ -62,0 +62,0 @@ }

src/Calendar/theme.ts

@@ -47,4 +47,4 @@ /*
 
-    color: colors?.textDarkest,
-    background: colors?.backgroundLightest,
+    color: colors?.contrasts?.grey125125,
+    background: colors?.contrasts?.white1010,
 
@@ -51,0 +51,0 @@ navMargin: spacing?.small,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

719661

increased by0.3%

Lines of code

6478

increased by0.06%

Dependency changes

• + Added@instructure/canvas-high-contrast-theme@9.5.2-snapshot-7(transitive)

• + Added@instructure/canvas-theme@9.5.2-snapshot-7(transitive)

• + Added@instructure/console@9.5.2-snapshot-7(transitive)

• + Added@instructure/debounce@9.5.2-snapshot-7(transitive)

• + Added@instructure/emotion@9.5.2-snapshot-7(transitive)

• + Added@instructure/shared-types@9.5.2-snapshot-7(transitive)

• + Added@instructure/theme-registry@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-a11y-content@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-a11y-utils@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-buttons@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-color-utils@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-decorator@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-dialog@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-dom-utils@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-form-field@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-grid@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-i18n@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-icons@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-options@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-popover@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-portal@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-position@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-prop-types@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-react-utils@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-select@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-selectable@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-simple-select@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-svg-images@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-tag@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-testable@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-text-input@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-theme-tokens@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-themes@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-tooltip@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-utils@9.5.2-snapshot-7(transitive)

• + Added@instructure/ui-view@9.5.2-snapshot-7(transitive)

• + Added@instructure/uid@9.5.2-snapshot-7(transitive)

• - Removed@instructure/canvas-high-contrast-theme@9.5.2-snapshot-1(transitive)

• - Removed@instructure/canvas-theme@9.5.2-snapshot-1(transitive)

• - Removed@instructure/console@9.5.2-snapshot-1(transitive)

• - Removed@instructure/debounce@9.5.2-snapshot-1(transitive)

• - Removed@instructure/emotion@9.5.2-snapshot-1(transitive)

• - Removed@instructure/instructure-theme@9.5.2-snapshot-1(transitive)

• - Removed@instructure/shared-types@9.5.2-snapshot-1(transitive)

• - Removed@instructure/theme-registry@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-a11y-content@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-a11y-utils@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-buttons@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-color-utils@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-decorator@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-dialog@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-dom-utils@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-form-field@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-grid@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-i18n@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-icons@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-options@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-popover@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-portal@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-position@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-prop-types@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-react-utils@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-select@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-selectable@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-simple-select@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-svg-images@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-tag@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-testable@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-text-input@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-theme-tokens@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-themes@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-tooltip@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-utils@9.5.2-snapshot-1(transitive)

• - Removed@instructure/ui-view@9.5.2-snapshot-1(transitive)

• - Removed@instructure/uid@9.5.2-snapshot-1(transitive)

• Updated@instructure/console@9.5.2-snapshot-7

• Updated@instructure/emotion@9.5.2-snapshot-7

• Updated@instructure/shared-types@9.5.2-snapshot-7

• Updated@instructure/ui-a11y-content@9.5.2-snapshot-7

• Updated@instructure/ui-buttons@9.5.2-snapshot-7

• Updated@instructure/ui-i18n@9.5.2-snapshot-7

• Updated@instructure/ui-icons@9.5.2-snapshot-7

• Updated@instructure/ui-prop-types@9.5.2-snapshot-7

• Updated@instructure/ui-react-utils@9.5.2-snapshot-7

• Updated@instructure/ui-simple-select@9.5.2-snapshot-7

• Updated@instructure/ui-testable@9.5.2-snapshot-7

• Updated@instructure/ui-utils@9.5.2-snapshot-7

• Updated@instructure/ui-view@9.5.2-snapshot-7

• Updated@instructure/uid@9.5.2-snapshot-7