@instructure/canvas-theme - npm Package Compare versions

Comparing version 10.0.1-snapshot-9 to 10.1.1-snapshot-4973

CHANGELOG.md

@@ -6,10 +6,24 @@ # Change Log
 
-## [10.0.1-snapshot-9](https://github.com/instructure/instructure-ui/compare/v10.0.0...v10.0.1-snapshot-9) (2024-08-14)
+## [10.1.1-snapshot-4973](https://github.com/instructure/instructure-ui/compare/v10.0.0...v10.1.1-snapshot-4973) (2024-08-23)
 
-**Note:** Version bump only for package @instructure/canvas-theme
 
+### Features
 
+* **many:** add data visualization colors, refactor theme code ([c395e17](https://github.com/instructure/instructure-ui/commit/c395e17a43be9fd7ec9d6854f28ae8584c3667bc))
 
 
 
+
+
+# [10.1.0](https://github.com/instructure/instructure-ui/compare/v10.0.0...v10.1.0) (2024-08-23)
+
+
+### Features
+
+* **many:** add data visualization colors, refactor theme code ([c395e17](https://github.com/instructure/instructure-ui/commit/c395e17a43be9fd7ec9d6854f28ae8584c3667bc))
+
+
+
+
+
 # [10.0.0](https://github.com/instructure/instructure-ui/compare/v9.5.1...v10.0.0) (2024-07-31)
@@ -16,0 +30,0 @@

es/index.js

@@ -1,2 +0,1 @@
-var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7, _colors$contrasts8, _colors$contrasts9, _colors$contrasts10, _colors$contrasts11, _colors$contrasts12, _colors$contrasts13;
 /*
@@ -26,4 +25,3 @@ * The MIT License (MIT)
 
-import { canvas } from '@instructure/ui-theme-tokens';
-import { ThemeRegistry } from '@instructure/theme-registry';
+import canvas from '@instructure/ui-themes';
 const borders = canvas.borders,
@@ -39,27 +37,5 @@ breakpoints = canvas.breakpoints,
   typography = canvas.typography;
+const theme = canvas;
 const key = 'canvas';
-const brandVariables = {
-  /* Defaults for Canvas account branding variables: */
-  'ic-brand-primary': colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.blue4570,
-  'ic-brand-font-color-dark': colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.grey125125,
-  'ic-link-color': colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.blue4570,
-  'ic-link-decoration': 'none',
-  'ic-brand-button--primary-bgd': colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.blue4570,
-  'ic-brand-button--primary-text': colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.white1010,
-  'ic-brand-button--secondary-bgd': colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.grey125125,
-  'ic-brand-button--secondary-text': colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.white1010,
-  'ic-brand-global-nav-bgd': colors === null || colors === void 0 ? void 0 : (_colors$contrasts8 = colors.contrasts) === null || _colors$contrasts8 === void 0 ? void 0 : _colors$contrasts8.grey100100,
-  'ic-global-nav-link-hover': colors === null || colors === void 0 ? void 0 : (_colors$contrasts9 = colors.contrasts) === null || _colors$contrasts9 === void 0 ? void 0 : _colors$contrasts9.grey125125,
-  'ic-brand-global-nav-ic-icon-svg-fill': colors === null || colors === void 0 ? void 0 : (_colors$contrasts10 = colors.contrasts) === null || _colors$contrasts10 === void 0 ? void 0 : _colors$contrasts10.white1010,
-  'ic-brand-global-nav-ic-icon-svg-fill--active': colors === null || colors === void 0 ? void 0 : (_colors$contrasts11 = colors.contrasts) === null || _colors$contrasts11 === void 0 ? void 0 : _colors$contrasts11.blue4570,
-  'ic-brand-global-nav-menu-item__text-color': colors === null || colors === void 0 ? void 0 : (_colors$contrasts12 = colors.contrasts) === null || _colors$contrasts12 === void 0 ? void 0 : _colors$contrasts12.white1010,
-  'ic-brand-global-nav-menu-item__text-color--active': colors === null || colors === void 0 ? void 0 : (_colors$contrasts13 = colors.contrasts) === null || _colors$contrasts13 === void 0 ? void 0 : _colors$contrasts13.blue4570
-};
-const __theme = {
-  key,
-  ...canvas,
-  ...brandVariables
-};
-const theme = ThemeRegistry.registerTheme(__theme);
-export default theme;
+export default canvas;
 export { theme, key, borders, breakpoints, colors, forms, media, shadows, spacing, stacking, transitions, typography };

lib/index.js

 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
@@ -7,5 +8,3 @@ value: true
 exports.typography = exports.transitions = exports.theme = exports.stacking = exports.spacing = exports.shadows = exports.media = exports.key = exports.forms = exports.default = exports.colors = exports.breakpoints = exports.borders = void 0;
-var _canvas = require("@instructure/ui-theme-tokens/lib/canvas");
-var _themeRegistry = require("@instructure/theme-registry");
-var _colors$contrasts, _colors$contrasts2, _colors$contrasts3, _colors$contrasts4, _colors$contrasts5, _colors$contrasts6, _colors$contrasts7, _colors$contrasts8, _colors$contrasts9, _colors$contrasts10, _colors$contrasts11, _colors$contrasts12, _colors$contrasts13;
+var _uiThemes = _interopRequireDefault(require("@instructure/ui-themes"));
 /*
@@ -34,36 +33,15 @@ * The MIT License (MIT)
  */
-const borders = exports.borders = _canvas.canvas.borders,
-  breakpoints = exports.breakpoints = _canvas.canvas.breakpoints,
-  colors = exports.colors = _canvas.canvas.colors,
-  forms = exports.forms = _canvas.canvas.forms,
-  media = exports.media = _canvas.canvas.media,
-  shadows = exports.shadows = _canvas.canvas.shadows,
-  spacing = exports.spacing = _canvas.canvas.spacing,
-  stacking = exports.stacking = _canvas.canvas.stacking,
-  transitions = exports.transitions = _canvas.canvas.transitions,
-  typography = exports.typography = _canvas.canvas.typography;
+
+const borders = exports.borders = _uiThemes.default.borders,
+  breakpoints = exports.breakpoints = _uiThemes.default.breakpoints,
+  colors = exports.colors = _uiThemes.default.colors,
+  forms = exports.forms = _uiThemes.default.forms,
+  media = exports.media = _uiThemes.default.media,
+  shadows = exports.shadows = _uiThemes.default.shadows,
+  spacing = exports.spacing = _uiThemes.default.spacing,
+  stacking = exports.stacking = _uiThemes.default.stacking,
+  transitions = exports.transitions = _uiThemes.default.transitions,
+  typography = exports.typography = _uiThemes.default.typography;
+const theme = exports.theme = _uiThemes.default;
 const key = exports.key = 'canvas';
-const brandVariables = {
-  /* Defaults for Canvas account branding variables: */
-  'ic-brand-primary': colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.blue4570,
-  'ic-brand-font-color-dark': colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.grey125125,
-  'ic-link-color': colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.blue4570,
-  'ic-link-decoration': 'none',
-  'ic-brand-button--primary-bgd': colors === null || colors === void 0 ? void 0 : (_colors$contrasts4 = colors.contrasts) === null || _colors$contrasts4 === void 0 ? void 0 : _colors$contrasts4.blue4570,
-  'ic-brand-button--primary-text': colors === null || colors === void 0 ? void 0 : (_colors$contrasts5 = colors.contrasts) === null || _colors$contrasts5 === void 0 ? void 0 : _colors$contrasts5.white1010,
-  'ic-brand-button--secondary-bgd': colors === null || colors === void 0 ? void 0 : (_colors$contrasts6 = colors.contrasts) === null || _colors$contrasts6 === void 0 ? void 0 : _colors$contrasts6.grey125125,
-  'ic-brand-button--secondary-text': colors === null || colors === void 0 ? void 0 : (_colors$contrasts7 = colors.contrasts) === null || _colors$contrasts7 === void 0 ? void 0 : _colors$contrasts7.white1010,
-  'ic-brand-global-nav-bgd': colors === null || colors === void 0 ? void 0 : (_colors$contrasts8 = colors.contrasts) === null || _colors$contrasts8 === void 0 ? void 0 : _colors$contrasts8.grey100100,
-  'ic-global-nav-link-hover': colors === null || colors === void 0 ? void 0 : (_colors$contrasts9 = colors.contrasts) === null || _colors$contrasts9 === void 0 ? void 0 : _colors$contrasts9.grey125125,
-  'ic-brand-global-nav-ic-icon-svg-fill': colors === null || colors === void 0 ? void 0 : (_colors$contrasts10 = colors.contrasts) === null || _colors$contrasts10 === void 0 ? void 0 : _colors$contrasts10.white1010,
-  'ic-brand-global-nav-ic-icon-svg-fill--active': colors === null || colors === void 0 ? void 0 : (_colors$contrasts11 = colors.contrasts) === null || _colors$contrasts11 === void 0 ? void 0 : _colors$contrasts11.blue4570,
-  'ic-brand-global-nav-menu-item__text-color': colors === null || colors === void 0 ? void 0 : (_colors$contrasts12 = colors.contrasts) === null || _colors$contrasts12 === void 0 ? void 0 : _colors$contrasts12.white1010,
-  'ic-brand-global-nav-menu-item__text-color--active': colors === null || colors === void 0 ? void 0 : (_colors$contrasts13 = colors.contrasts) === null || _colors$contrasts13 === void 0 ? void 0 : _colors$contrasts13.blue4570
-};
-const __theme = {
-  key,
-  ..._canvas.canvas,
-  ...brandVariables
-};
-const theme = exports.theme = _themeRegistry.ThemeRegistry.registerTheme(__theme);
-var _default = exports.default = theme;
+var _default = exports.default = _uiThemes.default;

package.json

 {
   "name": "@instructure/canvas-theme",
-  "version": "10.0.1-snapshot-9",
+  "version": "10.1.1-snapshot-4973",
   "description": "A theme for Canvas LMS made by Instructure Inc.",
@@ -25,9 +25,9 @@ "author": "Instructure, Inc. Engineering and Product Design",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "10.0.1-snapshot-9"
+    "@instructure/ui-babel-preset": "10.1.1-snapshot-4973"
   },
   "dependencies": {
     "@babel/runtime": "^7.24.5",
-    "@instructure/shared-types": "10.0.1-snapshot-9",
-    "@instructure/theme-registry": "10.0.1-snapshot-9",
-    "@instructure/ui-theme-tokens": "10.0.1-snapshot-9"
+    "@instructure/shared-types": "10.1.1-snapshot-4973",
+    "@instructure/theme-registry": "10.1.1-snapshot-4973",
+    "@instructure/ui-themes": "10.1.1-snapshot-4973"
   },
@@ -34,0 +34,0 @@ "publishConfig": {

src/index.ts

@@ -25,6 +25,6 @@ /*
 
-import { canvas } from '@instructure/ui-theme-tokens'
-import { ThemeRegistry } from '@instructure/theme-registry'
-import { BaseTheme } from '@instructure/shared-types'
+import canvas from '@instructure/ui-themes'
 
+import type { CanvasTheme } from '@instructure/ui-themes'
+
 const {
@@ -42,43 +42,6 @@ borders,
 } = canvas
-
+const theme = canvas
 const key = 'canvas'
 
-const brandVariables = {
-  /* Defaults for Canvas account branding variables: */
-  'ic-brand-primary': colors?.contrasts?.blue4570,
-  'ic-brand-font-color-dark': colors?.contrasts?.grey125125,
-
-  'ic-link-color': colors?.contrasts?.blue4570,
-  'ic-link-decoration': 'none',
-
-  'ic-brand-button--primary-bgd': colors?.contrasts?.blue4570,
-  'ic-brand-button--primary-text': colors?.contrasts?.white1010,
-  'ic-brand-button--secondary-bgd': colors?.contrasts?.grey125125,
-  'ic-brand-button--secondary-text': colors?.contrasts?.white1010,
-
-  'ic-brand-global-nav-bgd': colors?.contrasts?.grey100100,
-  'ic-global-nav-link-hover': colors?.contrasts?.grey125125,
-  'ic-brand-global-nav-ic-icon-svg-fill': colors?.contrasts?.white1010,
-  'ic-brand-global-nav-ic-icon-svg-fill--active': colors?.contrasts?.blue4570,
-  'ic-brand-global-nav-menu-item__text-color': colors?.contrasts?.white1010,
-  'ic-brand-global-nav-menu-item__text-color--active':
-    colors?.contrasts?.blue4570
-}
-
-export type CanvasBrandVariables = typeof brandVariables
-
-export type CanvasTheme = BaseTheme & {
-  key: 'canvas'
-} & typeof canvas &
-  CanvasBrandVariables
-
-const __theme: CanvasTheme = {
-  key,
-  ...canvas,
-  ...brandVariables
-}
-
-const theme = ThemeRegistry.registerTheme(__theme)
-
-export default theme
+export default canvas
 export {
@@ -98,1 +61,3 @@ theme,
 }
+
+export type { CanvasTheme }

tokens/source.json

@@ -1,1 +0,1 @@
-{"colors":{},"borders":{"radiusSmall":{"value":"0.125rem"},"radiusMedium":{"value":"0.25rem"},"radiusLarge":{"value":"0.5rem"},"widthSmall":{"value":"0.0625rem"},"widthMedium":{"value":"0.125rem"},"widthLarge":{"value":"0.25rem"},"style":{"value":"solid"}},"transitions":{"duration":{"value":"300ms"},"timing":{"value":"ease-in-out"}},"typography":{"fontFamily":{"value":"LatoWeb, Lato, \"Helvetica Neue\", Helvetica, Arial, sans-serif"},"fontFamilyMonospace":{"value":"Menlo, Consolas, Monaco, \"Andale Mono\", monospace"},"fontSizeXSmall":{"value":"0.75rem"},"fontSizeSmall":{"value":"0.875rem"},"fontSizeMedium":{"value":"1rem"},"fontSizeLarge":{"value":"1.375rem"},"fontSizeXLarge":{"value":"1.75rem"},"fontSizeXXLarge":{"value":"2.375rem"},"fontWeightLight":{"value":300},"fontWeightNormal":{"value":400},"fontWeightBold":{"value":700},"lineHeight":{"value":1.5},"lineHeightFit":{"value":1.125},"lineHeightCondensed":{"value":1.25},"lineHeightDouble":{"value":2},"letterSpacingNormal":{"value":0},"letterSpacingCondensed":{"value":"-0.0625rem"},"letterSpacingExpanded":{"value":"0.0625rem"}},"spacing":{"xxxSmall":{"value":"0.125rem"},"xxSmall":{"value":"0.375rem"},"xSmall":{"value":"0.5rem"},"small":{"value":"0.75rem"},"mediumSmall":{"value":"1rem"},"medium":{"value":"1.5rem"},"large":{"value":"2.25rem"},"xLarge":{"value":"3rem"},"xxLarge":{"value":"3.75rem"}},"forms":{"inputHeightSmall":{"value":"1.75rem"},"inputHeightMedium":{"value":"2.375rem"},"inputHeightLarge":{"value":"3rem"}},"breakpoints":{"xxSmall":{"value":"8em"},"xSmall":{"value":"16em"},"small":{"value":"30em"},"medium":{"value":"48em"},"tablet":{"value":"48em"},"large":{"value":"62em"},"desktop":{"value":"64em"},"xLarge":{"value":"75em"},"maxWidth":{"value":"61.9375em"}},"shadows":{"depth1":{"value":"0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2), 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.1)"},"depth2":{"value":"0 0.1875rem 0.375rem rgba(0, 0, 0, 0.1), 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16)"},"depth3":{"value":"0 0.375rem 0.4375rem rgba(0, 0, 0, 0.1), 0 0.625rem 1.75rem rgba(0, 0, 0, 0.25)"},"resting":{"value":"0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2), 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.1)"},"above":{"value":"0 0.1875rem 0.375rem rgba(0, 0, 0, 0.1), 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16)"},"topmost":{"value":"0 0.375rem 0.4375rem rgba(0, 0, 0, 0.1), 0 0.625rem 1.75rem rgba(0, 0, 0, 0.25)"}},"stacking":{"topmost":{"value":9999},"above":{"value":1},"below":{"value":-1},"deepest":{"value":-9999}}}
+{"borders":{"radiusSmall":{"value":"0.125rem"},"radiusMedium":{"value":"0.25rem"},"radiusLarge":{"value":"0.5rem"},"widthSmall":{"value":"0.0625rem"},"widthMedium":{"value":"0.125rem"},"widthLarge":{"value":"0.25rem"},"style":{"value":"solid"}},"transitions":{"duration":{"value":"300ms"},"timing":{"value":"ease-in-out"}},"typography":{"fontFamily":{"value":"LatoWeb, Lato, \"Helvetica Neue\", Helvetica, Arial, sans-serif"},"fontFamilyMonospace":{"value":"Menlo, Consolas, Monaco, \"Andale Mono\", monospace"},"fontSizeXSmall":{"value":"0.75rem"},"fontSizeSmall":{"value":"0.875rem"},"fontSizeMedium":{"value":"1rem"},"fontSizeLarge":{"value":"1.375rem"},"fontSizeXLarge":{"value":"1.75rem"},"fontSizeXXLarge":{"value":"2.375rem"},"fontWeightLight":{"value":300},"fontWeightNormal":{"value":400},"fontWeightBold":{"value":700},"lineHeight":{"value":1.5},"lineHeightFit":{"value":1.125},"lineHeightCondensed":{"value":1.25},"lineHeightDouble":{"value":2},"letterSpacingNormal":{"value":0},"letterSpacingCondensed":{"value":"-0.0625rem"},"letterSpacingExpanded":{"value":"0.0625rem"}},"spacing":{"xxxSmall":{"value":"0.125rem"},"xxSmall":{"value":"0.375rem"},"xSmall":{"value":"0.5rem"},"small":{"value":"0.75rem"},"mediumSmall":{"value":"1rem"},"medium":{"value":"1.5rem"},"large":{"value":"2.25rem"},"xLarge":{"value":"3rem"},"xxLarge":{"value":"3.75rem"}},"forms":{"inputHeightSmall":{"value":"1.75rem"},"inputHeightMedium":{"value":"2.375rem"},"inputHeightLarge":{"value":"3rem"}},"breakpoints":{"xxSmall":{"value":"8em"},"xSmall":{"value":"16em"},"small":{"value":"30em"},"medium":{"value":"48em"},"tablet":{"value":"48em"},"large":{"value":"62em"},"desktop":{"value":"64em"},"xLarge":{"value":"75em"},"maxWidth":{"value":"61.9375em"}},"shadows":{"depth1":{"value":"0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2), 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.1)"},"depth2":{"value":"0 0.1875rem 0.375rem rgba(0, 0, 0, 0.1), 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16)"},"depth3":{"value":"0 0.375rem 0.4375rem rgba(0, 0, 0, 0.1), 0 0.625rem 1.75rem rgba(0, 0, 0, 0.25)"},"resting":{"value":"0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2), 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.1)"},"above":{"value":"0 0.1875rem 0.375rem rgba(0, 0, 0, 0.1), 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16)"},"topmost":{"value":"0 0.375rem 0.4375rem rgba(0, 0, 0, 0.1), 0 0.625rem 1.75rem rgba(0, 0, 0, 0.25)"}},"stacking":{"topmost":{"value":9999},"above":{"value":1},"below":{"value":-1},"deepest":{"value":-9999}},"colors":{"primitives":{"white":{"value":"#FFFFFF"},"white10op75":{"value":"#FFFFFFBF"},"grey11":{"value":"#F2F4F4"},"grey12":{"value":"#E8EAEC"},"grey14":{"value":"#D7DADE"},"grey24":{"value":"#9EA6AD"},"grey45":{"value":"#6A7883"},"grey57":{"value":"#586874"},"grey70":{"value":"#4A5B68"},"grey82":{"value":"#3F515E"},"grey100":{"value":"#334451"},"grey100op75":{"value":"#334451BF"},"grey125":{"value":"#273540"},"blue12":{"value":"#E0EBF5"},"blue45":{"value":"#2B7ABC"},"blue57":{"value":"#0E68B3"},"blue70":{"value":"#0A5A9E"},"blue82":{"value":"#09508C"},"green12":{"value":"#DCEEE4"},"green45":{"value":"#03893D"},"green57":{"value":"#027634"},"green70":{"value":"#02672D"},"green82":{"value":"#015B28"},"orange12":{"value":"#FCE5D9"},"orange30":{"value":"#F06E26"},"orange45":{"value":"#CF4A00"},"orange57":{"value":"#B34000"},"orange70":{"value":"#9C3800"},"orange82":{"value":"#8B3200"},"red12":{"value":"#FCE4E5"},"red45":{"value":"#E62429"},"red57":{"value":"#C71F23"},"red70":{"value":"#AE1B1F"},"red82":{"value":"#9B181C"}},"contrasts":{"white1010":{"value":"#FFFFFF"},"white1010op75":{"value":"#FFFFFFBF"},"grey1111":{"value":"#F2F4F4"},"grey1214":{"value":"#E8EAEC"},"grey1424":{"value":"#D7DADE"},"grey2424":{"value":"#9EA6AD"},"grey4570":{"value":"#6A7883"},"grey5782":{"value":"#586874"},"grey100100":{"value":"#334451"},"grey100100op75":{"value":"#334451BF"},"grey125125":{"value":"#273540"},"blue1212":{"value":"#E0EBF5"},"blue4570":{"value":"#2B7ABC"},"blue5782":{"value":"#0E68B3"},"green1212":{"value":"#DCEEE4"},"green4570":{"value":"#03893D"},"green5782":{"value":"#027634"},"orange1212":{"value":"#FCE5D9"},"orange3045":{"value":"#F06E26"},"orange4570":{"value":"#CF4A00"},"orange5782":{"value":"#B34000"},"red1212":{"value":"#FCE4E5"},"red4570":{"value":"#E62429"},"red5782":{"value":"#C71F23"}},"ui":{"surfacePagePrimary":{"value":"#FFFFFF"},"surfacePageSecondary":{"value":"#F2F4F4"},"surfaceCardPrimary":{"value":"#FFFFFF"},"surfaceCardSecondary":{"value":"#F2F4F4"},"surfaceDark":{"value":"#334451"},"textTitle":{"value":"#273540"},"textDescription":{"value":"#273540"},"textBody":{"value":"#273540"},"textTimestamp":{"value":"#586874"},"textAuthor":{"value":"#586874"},"textDatapoint":{"value":"#586874"},"textLink":{"value":"#0E68B3"},"textPlaceholder":{"value":"#9EA6AD"},"textSuccess":{"value":"#027634"},"textWarning":{"value":"#B34000"},"textError":{"value":"#C71F23"},"lineStroke":{"value":"#D7DADE"},"lineDivider":{"value":"#E8EAEC"},"surfaceOverlayGrey":{"value":"#334451BF"},"surfaceOverlayWhite":{"value":"#FFFFFFBF"},"surfaceAttention":{"value":"#2B7ABC"},"surfaceSuccess":{"value":"#03893D"},"surfaceWarning":{"value":"#CF4A00"},"surfaceError":{"value":"#E62429"},"surfaceDivider":{"value":"#E8EAEC"},"textSurfaceColored":{"value":"#FFFFFF"},"iconDefault":{"value":"#273540"},"iconSuccess":{"value":"#03893D"},"iconWarning":{"value":"#CF4A00"},"iconError":{"value":"#E62429"},"iconSurfaceColored":{"value":"#FFFFFF"},"lineConnector":{"value":"#D7DADE"}}}}

tsconfig.build.json

@@ -13,3 +13,2 @@ {
     },
-
     {
@@ -19,3 +18,3 @@ "path": "../shared-types/tsconfig.build.json"
     {
-      "path": "../ui-theme-tokens/tsconfig.build.json"
+      "path": "../ui-themes/tsconfig.build.json"
     },
@@ -22,0 +21,0 @@ {

types/index.d.ts

@@ -1,28 +0,9 @@
-import { canvas } from '@instructure/ui-theme-tokens';
-import { BaseTheme } from '@instructure/shared-types';
+import canvas from '@instructure/ui-themes';
+import type { CanvasTheme } from '@instructure/ui-themes';
 declare const borders: import("@instructure/shared-types").Border, breakpoints: import("@instructure/shared-types").Breakpoints, colors: import("@instructure/shared-types").Colors, forms: import("@instructure/shared-types").Forms, media: import("@instructure/shared-types").Media, shadows: import("@instructure/shared-types").Shadows, spacing: import("@instructure/shared-types").Spacing, stacking: import("@instructure/shared-types").Stacking, transitions: import("@instructure/shared-types").Transitions, typography: import("@instructure/shared-types").Typography;
+declare const theme: import("@instructure/theme-registry").Theme<CanvasTheme>;
 declare const key = "canvas";
-declare const brandVariables: {
-    'ic-brand-primary': string;
-    'ic-brand-font-color-dark': string;
-    'ic-link-color': string;
-    'ic-link-decoration': string;
-    'ic-brand-button--primary-bgd': string;
-    'ic-brand-button--primary-text': string;
-    'ic-brand-button--secondary-bgd': string;
-    'ic-brand-button--secondary-text': string;
-    'ic-brand-global-nav-bgd': string;
-    'ic-global-nav-link-hover': string;
-    'ic-brand-global-nav-ic-icon-svg-fill': string;
-    'ic-brand-global-nav-ic-icon-svg-fill--active': string;
-    'ic-brand-global-nav-menu-item__text-color': string;
-    'ic-brand-global-nav-menu-item__text-color--active': string;
-};
-export type CanvasBrandVariables = typeof brandVariables;
-export type CanvasTheme = BaseTheme & {
-    key: 'canvas';
-} & typeof canvas & CanvasBrandVariables;
-declare const theme: import("@instructure/theme-registry").Theme<CanvasTheme>;
-export default theme;
+export default canvas;
 export { theme, key, borders, breakpoints, colors, forms, media, shadows, spacing, stacking, transitions, typography };
+export type { CanvasTheme };
 //# sourceMappingURL=index.d.ts.map

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

Number of downloads

32025

increased by5.86%

Published versions last two months

71

increased by4.41%

Worsened metrics

Total package byte prevSize

127415

decreased by-1.92%

Lines of code

171

decreased by-35.47%

Published versions last week

5

decreased by-16.67%

Published versions last year

277

decreased by-0.72%

Dependency changes

• + Added@instructure/ui-themes@10.1.1-snapshot-4973

• + Added@instructure/console@10.1.1-snapshot-4973(transitive)

• + Added@instructure/shared-types@10.1.1-snapshot-4973(transitive)

• + Added@instructure/theme-registry@10.1.1-snapshot-4973(transitive)

• + Added@instructure/ui-dom-utils@10.1.1-snapshot-4973(transitive)

• + Added@instructure/ui-themes@10.1.1-snapshot-4973(transitive)

• + Added@instructure/ui-utils@10.1.1-snapshot-4973(transitive)

• - Removed@instructure/ui-theme-tokens@10.0.1-snapshot-9

• - Removed@instructure/console@10.0.1-snapshot-9(transitive)

• - Removed@instructure/shared-types@10.0.1-snapshot-9(transitive)

• - Removed@instructure/theme-registry@10.0.1-snapshot-9(transitive)

• - Removed@instructure/ui-dom-utils@10.0.1-snapshot-9(transitive)

• - Removed@instructure/ui-theme-tokens@10.0.1-snapshot-9(transitive)

• - Removed@instructure/ui-utils@10.0.1-snapshot-9(transitive)

• Updated@instructure/shared-types@10.1.1-snapshot-4973

• Updated@instructure/theme-registry@10.1.1-snapshot-4973