baseui 10.11.1 → 11.0.0

package/spinner/styled-components.js

@@ -3,20 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledSpinnerNext = exports.StyledActivePath = exports.StyledTrackPath = exports.Svg = void 0;
+exports.StyledSpinner = void 0;
 
 var _index = require("../styles/index.js");
 
-var _styledComponents = require("../icon/styled-components.js");
-
 var _constants = require("./constants.js");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+/*
+Copyright (c) Uber Technologies, Inc.
 
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+*/
 var spin = {
   from: {
     transform: 'rotate(0deg)'
@@ -25,41 +23,7 @@ var spin = {
     transform: 'rotate(360deg)'
   }
 };
-/**
- * Spinner icon overrides
- */
-
-var Svg = (0, _index.styled)('svg', function (props) {
-  var $theme = props.$theme,
-      $color = props.$color;
-  return _objectSpread(_objectSpread({}, (0, _styledComponents.getSvgStyles)(props)), {}, {
-    fill: $color || $theme.colors.accent,
-    cursor: 'wait',
-    animationName: spin,
-    animationDuration: $theme.animation.timing1000,
-    animationIterationCount: 'infinite',
-    animationTimingFunction: 'linear'
-  });
-});
-exports.Svg = Svg;
-Svg.displayName = "Svg";
-var StyledTrackPath = (0, _index.styled)('path', function (props) {
-  return {
-    fill: props.$theme.colors.spinnerTrackFill,
-    opacity: 0.16
-  };
-});
-exports.StyledTrackPath = StyledTrackPath;
-StyledTrackPath.displayName = "StyledTrackPath";
-var StyledActivePath = (0, _index.styled)('path', function (props) {
-  return {
-    fill: props.$color || props.$theme.colors.accent
-  };
-}); // TODO(v11): Replace Spinner with SpinnerNext
-
-exports.StyledActivePath = StyledActivePath;
-StyledActivePath.displayName = "StyledActivePath";
-var StyledSpinnerNext = (0, _index.styled)('i', function (_ref) {
+var StyledSpinner = (0, _index.styled)('i', function (_ref) {
   var $theme = _ref.$theme,
       _ref$$color = _ref.$color,
       $color = _ref$$color === void 0 ? $theme.colors.contentAccent : _ref$$color,
@@ -117,5 +81,5 @@ var StyledSpinnerNext = (0, _index.styled)('i', function (_ref) {
     cursor: 'wait'
   };
 });
-exports.StyledSpinnerNext = StyledSpinnerNext;
-StyledSpinnerNext.displayName = "StyledSpinnerNext";
+exports.StyledSpinner = StyledSpinner;
+StyledSpinner.displayName = "StyledSpinner";

package/spinner/styled-components.js.flow

@@ -6,14 +6,8 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import { styled } from '../styles/index.js';
-import { getSvgStyles } from '../icon/styled-components.js';
 import { SIZE } from './constants.js';
-import type { StyledSpinnerNextPropsT } from './types.js';
-
-type StylePropsT = {
-  $size?: number | string,
-  $color?: string,
-};
+import type { SpinnerPropsT } from './types.js';
 
 const spin = {
   from: {
@@ -24,33 +18,7 @@ const spin = {
   },
 };
 
-/**
- * Spinner icon overrides
- */
-export const Svg = styled<StylePropsT>('svg', (props) => {
-  const { $theme, $color } = props;
-  return {
-    ...getSvgStyles(props),
-    fill: $color || $theme.colors.accent,
-    cursor: 'wait',
-    animationName: spin,
-    animationDuration: $theme.animation.timing1000,
-    animationIterationCount: 'infinite',
-    animationTimingFunction: 'linear',
-  };
-});
-
-export const StyledTrackPath = styled<StylePropsT>('path', (props) => ({
-  fill: props.$theme.colors.spinnerTrackFill,
-  opacity: 0.16,
-}));
-
-export const StyledActivePath = styled<StylePropsT>('path', (props) => ({
-  fill: props.$color || props.$theme.colors.accent,
-}));
-
-// TODO(v11): Replace Spinner with SpinnerNext
-export const StyledSpinnerNext = styled<StyledSpinnerNextPropsT>(
+export const StyledSpinner = styled<SpinnerPropsT>(
   'i',
   ({
     //$FlowFixMe

package/spinner/types.js.flow

@@ -7,29 +7,11 @@ LICENSE file in the root directory of this source tree.
 // @flow
 
 import { SIZE } from './constants.js';
-import type { OverrideT } from '../helpers/overrides.js';
 import type { SizingT } from '../themes/types.js';
 
 export type SizeT = $Keys<typeof SIZE>;
-export type SpinnerPropsT = {
-  /** Sets aria-label attribute. */
-  'aria-label'?: string,
-  /** Size of element, will be passed to the svg width/height style. Can also be a value included in */
-  size?: number | string,
-  /** Color of icon, will be used as svg fill */
-  color?: string,
-  /** Silence should only be used in baseui. Used to not spam console on composed components like Select */
-  $silenceV11DeprecationWarning?: boolean,
-  /** Allows you to set the SVG `<title>` label, which is used for accessibility */
-  title?: string,
-  overrides?: {
-    Svg?: OverrideT,
-    ActivePath?: OverrideT,
-    TrackPath?: OverrideT,
-  },
-};
 
-export type StyledSpinnerNextPropsT = {
+export type SpinnerPropsT = {
   /** Color of progress indicator */
   $color?: string,
   /** Width of the progress indicator "stroke".  */

package/styles/types.js.flow

@@ -12,7 +12,6 @@ import type {
   ColorTokensT,
   ComponentColorTokensT,
   SemanticColorTokensT,
-  DeprecatedSemanticColorTokensT,
   AnimationT,
   BreakpointsT,
   BorderT,
@@ -44,7 +43,6 @@ export type ColorsT = {
   ...ColorTokensT,
   ...ComponentColorTokensT,
   ...SemanticColorTokensT,
-  ...DeprecatedSemanticColorTokensT,
 };
 
 export type ThemeT = {|

package/table/filter.js

@@ -95,19 +95,19 @@ function Filter(props) {
         ,
         crossFrame: false
       }, /*#__PURE__*/React.createElement(Heading, headingProps, "Filter Column"), /*#__PURE__*/React.createElement(Content, contentProps, props.children), /*#__PURE__*/React.createElement(Footer, footerProps, /*#__PURE__*/React.createElement(_index.Button, {
-        kind: _index.KIND.minimal,
+        kind: _index.KIND.tertiary,
         size: _index.SIZE.compact,
         onClick: function onClick() {
           onSelectAll();
         }
       }, "Select All"), /*#__PURE__*/React.createElement(_index.Button, {
-        kind: _index.KIND.minimal,
+        kind: _index.KIND.tertiary,
         size: _index.SIZE.compact,
         onClick: function onClick() {
           onReset();
         }
       }, "Reset"), props.hasCloseButton && /*#__PURE__*/React.createElement(_index.Button, {
-        kind: _index.KIND.minimal,
+        kind: _index.KIND.tertiary,
         size: _index.SIZE.compact,
         onClick: close
       }, "Close")));

package/table/filter.js.flow

@@ -54,7 +54,7 @@ export default function Filter(props: FilterProps) {
           <Content {...contentProps}>{props.children}</Content>
           <Footer {...footerProps}>
             <Button
-              kind={KIND.minimal}
+              kind={KIND.tertiary}
               size={SIZE.compact}
               onClick={() => {
                 onSelectAll();
@@ -64,7 +64,7 @@ export default function Filter(props: FilterProps) {
             </Button>
 
             <Button
-              kind={KIND.minimal}
+              kind={KIND.tertiary}
               size={SIZE.compact}
               onClick={() => {
                 onReset();
@@ -74,7 +74,7 @@ export default function Filter(props: FilterProps) {
             </Button>
 
             {props.hasCloseButton && (
-              <Button kind={KIND.minimal} size={SIZE.compact} onClick={close}>
+              <Button kind={KIND.tertiary} size={SIZE.compact} onClick={close}>
                 Close
               </Button>
             )}

package/tag/styled-components.js

@@ -251,7 +251,7 @@ var customColorStates = (_customColorStates = {}, _defineProperty(_customColorSt
   return {
     color: customOnRamp(color, theme.colors.tagFontDisabledRampUnit),
     backgroundColor: null,
-    borderColor: customOnRamp(color, theme.colors.tagOutlinedDisabledRampUnit)
+    borderColor: customOnRamp(color, theme.colors.tagSolidDisabledRampUnit)
   };
 }), _defineProperty(_customColorStates, COLOR_STATE.solid, function (theme, color) {
   return {

package/tag/styled-components.js.flow

@@ -217,7 +217,7 @@ const customColorStates = {
   [COLOR_STATE.disabled]: (theme, color) => ({
     color: customOnRamp(color, theme.colors.tagFontDisabledRampUnit),
     backgroundColor: null,
-    borderColor: customOnRamp(color, theme.colors.tagOutlinedDisabledRampUnit),
+    borderColor: customOnRamp(color, theme.colors.tagSolidDisabledRampUnit),
   }),
   [COLOR_STATE.solid]: (theme, color) => ({
     color: customOnRamp(color, theme.colors.tagSolidFontRampUnit),

package/theme.ts

@@ -120,8 +120,6 @@ export interface Colors {
   black: string;
 
   // Rating Palette
-  rating200: string;
-  rating400: string;
   ratingInactiveFill: string;
   ratingStroke: string;
 
@@ -199,30 +197,6 @@ export interface Colors {
 
   /* ---- End of Semantic Colors ---- */
 
-  /* ---- Deprecated Semantic Colors ---- */
-
-  // Font Color
-  colorPrimary: string;
-  colorSecondary: string;
-
-  // Background
-  background: string;
-  backgroundAlt: string;
-  backgroundInv: string;
-
-  // Foreground
-  foreground: string;
-  foregroundAlt: string;
-  foregroundInv: string;
-
-  // Borders
-  border: string;
-  borderAlt: string;
-  borderFocus: string;
-  borderError: string;
-
-  /* ---- End of Deprecated Semantic Colors ---- */
-
   /* ---- Component Specific Colors ---- */
 
   // Buttons
@@ -250,14 +224,6 @@ export interface Colors {
   buttonTertiarySelectedFill: string;
   buttonTertiarySpinnerForeground: string;
   buttonTertiarySpinnerBackground: string;
-  buttonMinimalFill: string;
-  buttonMinimalText: string;
-  buttonMinimalHover: string;
-  buttonMinimalActive: string;
-  buttonMinimalSelectedText: string;
-  buttonMinimalSelectedFill: string;
-  buttonMinimalSpinnerForeground: string;
-  buttonMinimalSpinnerBackground: string;
   buttonDisabledFill: string;
   buttonDisabledText: string;
   buttonDisabledSpinnerForeground: string;
@@ -268,12 +234,6 @@ export interface Colors {
   breadcrumbsSeparatorFill: string;
 
   // Datepicker
-  datepickerBackground: string;
-  datepickerDayFont: string;
-  datepickerDayFontDisabled: string;
-  datepickerDayPseudoSelected: string;
-  datepickerDayPseudoHighlighted: string;
-
   calendarBackground: string;
   calendarForeground: string;
   calendarForegroundDisabled: string;
@@ -310,15 +270,12 @@ export interface Colors {
   // Lists
   listHeaderFill: string;
   listBodyFill: string;
-  listIconFill: string;
-  listBorder: string;
 
   // ProgressSteps
   progressStepsCompletedText: string;
   progressStepsCompletedFill: string;
   progressStepsActiveText: string;
   progressStepsActiveFill: string;
-  progressStepsIconActiveFill: string;
 
   // Toggle
   toggleFill: string;
@@ -351,24 +308,13 @@ export interface Colors {
   sliderTrackFill: string;
   sliderTrackFillHover: string;
   sliderTrackFillActive: string;
-  sliderTrackFillSelected: string;
-  sliderTrackFillSelectedHover: string;
-  sliderTrackFillSelectedActive: string;
   sliderTrackFillDisabled: string;
   sliderHandleFill: string;
-  sliderHandleFillHover: string;
-  sliderHandleFillActive: string;
-  sliderHandleFillSelected: string;
-  sliderHandleFillSelectedHover: string;
-  sliderHandleFillSelectedActive: string;
   sliderHandleFillDisabled: string;
   sliderHandleInnerFill: string;
   sliderHandleInnerFillDisabled: string;
   sliderHandleInnerFillSelectedHover: string;
   sliderHandleInnerFillSelectedActive: string;
-  sliderBorder: string;
-  sliderBorderHover: string;
-  sliderBorderDisabled: string;
 
   // Input
   inputBorder: string;
@@ -387,8 +333,6 @@ export interface Colors {
   inputPlaceholderDisabled: string;
 
   // Notification
-  notificationPrimaryBackground: string;
-  notificationPrimaryText: string;
   notificationInfoBackground: string;
   notificationInfoText: string;
   notificationPositiveBackground: string;
@@ -411,12 +355,6 @@ export interface Colors {
   modalCloseColorHover: string;
   modalCloseColorFocus: string;
 
-  // Pagination
-  paginationTriangleDown: string;
-
-  // Header navigation
-  headerNavigationFill: string;
-
   // Tab
   tabBarFill: string;
   tabColor: string;
@@ -426,18 +364,6 @@ export interface Colors {
   shadowError: string;
 
   // Tag
-
-  // Remove this section of theme values in next major version
-  tagBackground: string;
-  tagNeutralBackground: string;
-  tagPrimaryBackground: string;
-  tagPositiveBackground: string;
-  tagWarningBackground: string;
-  tagNegativeBackground: string;
-  tagRGBGradient: string;
-  tagRGBGradientSecondary: string;
-  // ^^^^^^^
-
   tagSolidRampUnit: string;
   tagSolidHoverRampUnit: string;
   tagSolidActiveRampUnit: string;
@@ -447,13 +373,11 @@ export interface Colors {
   tagLightRampUnit: string;
   tagLightHoverRampUnit: string;
   tagLightActiveRampUnit: string;
-  tagLightDisabledRampUnit: string;
   tagLightFontRampUnit: string;
   tagLightFontHoverRampUnit: string;
   tagOutlinedRampUnit: string;
   tagOutlinedHoverRampUnit: string;
   tagOutlinedActiveRampUnit: string;
-  tagOutlinedDisabledRampUnit: string;
   tagOutlinedFontRampUnit: string;
   tagOutlinedFontHoverRampUnit: string;
   tagFontDisabledRampUnit: string;
@@ -589,7 +513,6 @@ export interface Colors {
 
   // Toast
   toastText: string;
-  toastPrimaryBackground: string;
   toastInfoBackground: string;
   toastPositiveBackground: string;
   toastWarningBackground: string;
@@ -858,9 +781,5 @@ export interface ThemePrimitives {
   mono900: string;
   mono1000: string;
 
-  // Rating Palette
-  rating200: string;
-  rating400: string;
-
   primaryFontFamily: string;
 }

package/themes/dark-theme/color-component-tokens.js

@@ -52,14 +52,6 @@ var _default = function _default() {
     buttonTertiaryDisabledActiveText: themePrimitives.mono300,
     buttonTertiarySpinnerForeground: themePrimitives.primary50,
     buttonTertiarySpinnerBackground: themePrimitives.primary500,
-    buttonMinimalFill: 'transparent',
-    buttonMinimalText: themePrimitives.primary,
-    buttonMinimalHover: themePrimitives.primary700,
-    buttonMinimalActive: themePrimitives.primary600,
-    buttonMinimalSelectedText: themePrimitives.primary,
-    buttonMinimalSelectedFill: themePrimitives.primary600,
-    buttonMinimalSpinnerForeground: themePrimitives.primary50,
-    buttonMinimalSpinnerBackground: themePrimitives.primary500,
     buttonDisabledFill: themePrimitives.mono600,
     buttonDisabledText: themePrimitives.mono300,
     buttonDisabledActiveFill: themePrimitives.mono200,
@@ -70,12 +62,6 @@ var _default = function _default() {
     breadcrumbsText: themePrimitives.mono100,
     breadcrumbsSeparatorFill: themePrimitives.mono200,
     // Datepicker
-    datepickerBackground: themePrimitives.mono600,
-    datepickerDayFont: themePrimitives.white,
-    datepickerDayFontDisabled: themePrimitives.mono100,
-    datepickerDayPseudoSelected: themePrimitives.mono500,
-    datepickerDayPseudoHighlighted: themePrimitives.mono600,
-    // Calendar
     calendarBackground: themePrimitives.mono800,
     calendarForeground: themePrimitives.white,
     calendarForegroundDisabled: themePrimitives.mono300,
@@ -83,7 +69,6 @@ var _default = function _default() {
     calendarHeaderForeground: themePrimitives.primary,
     calendarHeaderBackgroundActive: themePrimitives.primary600,
     calendarHeaderForegroundDisabled: themePrimitives.primary500,
-    calendarDayBackgroundPseudoSelected: themePrimitives.primary700,
     calendarDayForegroundPseudoSelected: themePrimitives.primary,
     calendarDayBackgroundPseudoSelectedHighlighted: themePrimitives.primary600,
     calendarDayForegroundPseudoSelectedHighlighted: themePrimitives.primary,
@@ -108,21 +93,16 @@ var _default = function _default() {
     // List
     listHeaderFill: themePrimitives.mono600,
     listBodyFill: themePrimitives.mono800,
-    listIconFill: themePrimitives.mono100,
-    listBorder: themePrimitives.mono500,
     // ProgressSteps
     progressStepsCompletedText: themePrimitives.black,
     progressStepsCompletedFill: themePrimitives.primary,
     progressStepsActiveText: themePrimitives.black,
     progressStepsActiveFill: themePrimitives.primary,
-    progressStepsIconActiveFill: themePrimitives.primary,
     // Modal
     modalCloseColor: themePrimitives.mono300,
     modalCloseColorHover: themePrimitives.mono400,
     modalCloseColorFocus: themePrimitives.mono400,
     // Notification
-    notificationPrimaryBackground: themePrimitives.primary700,
-    notificationPrimaryText: themePrimitives.primaryA,
     notificationInfoBackground: themePrimitives.accent700,
     notificationInfoText: themePrimitives.primaryA,
     notificationPositiveBackground: themePrimitives.positive700,
@@ -134,7 +114,6 @@ var _default = function _default() {
     // Tag
     // Custom ramps
     tagFontDisabledRampUnit: '600',
-    tagOutlinedDisabledRampUnit: '700',
     tagSolidFontRampUnit: '0',
     tagSolidRampUnit: '500',
     tagOutlinedFontRampUnit: '500',
@@ -147,7 +126,6 @@ var _default = function _default() {
     tagLightRampUnit: '700',
     tagLightHoverRampUnit: '700',
     tagLightActiveRampUnit: '600',
-    tagLightDisabledRampUnit: '700',
     tagLightFontRampUnit: '100',
     tagLightFontHoverRampUnit: '100',
     tagOutlinedActiveRampUnit: '300',
@@ -290,7 +268,6 @@ var _default = function _default() {
     tableFilterFooterBackground: themePrimitives.mono800,
     // Toast
     toastText: themePrimitives.white,
-    toastPrimaryBackground: themePrimitives.primary400,
     toastPrimaryText: themePrimitives.white,
     toastInfoBackground: themePrimitives.accent400,
     toastInfoText: themePrimitives.white,
@@ -330,23 +307,12 @@ var _default = function _default() {
     sliderHandleFill: themePrimitives.primaryA,
     sliderHandleFillDisabled: themePrimitives.primary500,
     sliderHandleInnerFill: themePrimitives.primaryA,
-    sliderHandleFillHover: themePrimitives.mono300,
-    sliderHandleFillActive: themePrimitives.mono300,
-    sliderHandleFillSelected: themePrimitives.primary500,
-    sliderHandleFillSelectedHover: themePrimitives.primary600,
-    sliderHandleFillSelectedActive: themePrimitives.primary700,
     sliderTrackFillHover: themePrimitives.mono500,
     sliderTrackFillActive: themePrimitives.mono400,
-    sliderTrackFillSelected: themePrimitives.primary500,
-    sliderTrackFillSelectedActive: themePrimitives.primary600,
-    sliderTrackFillSelectedHover: themePrimitives.primary700,
     sliderTrackFillDisabled: themePrimitives.mono700,
     sliderHandleInnerFillDisabled: themePrimitives.mono500,
     sliderHandleInnerFillSelectedHover: themePrimitives.primary600,
     sliderHandleInnerFillSelectedActive: themePrimitives.primary700,
-    sliderBorder: themePrimitives.white,
-    sliderBorderHover: themePrimitives.white,
-    sliderBorderDisabled: themePrimitives.mono400,
     // Input
     inputBorder: themePrimitives.mono600,
     inputFill: themePrimitives.mono600,
@@ -369,10 +335,6 @@ var _default = function _default() {
     menuFontDisabled: themePrimitives.mono400,
     menuFontHighlighted: themePrimitives.white,
     menuFontSelected: themePrimitives.white,
-    // Pagination
-    paginationTriangleDown: themePrimitives.mono100,
-    // Header navigation
-    headerNavigationFill: themePrimitives.mono700,
     // Tab
     tabBarFill: themePrimitives.mono1000,
     tabColor: themePrimitives.mono300,

package/themes/dark-theme/color-component-tokens.js.flow

@@ -46,15 +46,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   buttonTertiarySpinnerForeground: themePrimitives.primary50,
   buttonTertiarySpinnerBackground: themePrimitives.primary500,
 
-  buttonMinimalFill: 'transparent',
-  buttonMinimalText: themePrimitives.primary,
-  buttonMinimalHover: themePrimitives.primary700,
-  buttonMinimalActive: themePrimitives.primary600,
-  buttonMinimalSelectedText: themePrimitives.primary,
-  buttonMinimalSelectedFill: themePrimitives.primary600,
-  buttonMinimalSpinnerForeground: themePrimitives.primary50,
-  buttonMinimalSpinnerBackground: themePrimitives.primary500,
-
   buttonDisabledFill: themePrimitives.mono600,
   buttonDisabledText: themePrimitives.mono300,
   buttonDisabledActiveFill: themePrimitives.mono200,
@@ -67,13 +58,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   breadcrumbsSeparatorFill: themePrimitives.mono200,
 
   // Datepicker
-  datepickerBackground: themePrimitives.mono600,
-  datepickerDayFont: themePrimitives.white,
-  datepickerDayFontDisabled: themePrimitives.mono100,
-  datepickerDayPseudoSelected: themePrimitives.mono500,
-  datepickerDayPseudoHighlighted: themePrimitives.mono600,
-
-  // Calendar
   calendarBackground: themePrimitives.mono800,
   calendarForeground: themePrimitives.white,
   calendarForegroundDisabled: themePrimitives.mono300,
@@ -81,7 +65,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   calendarHeaderForeground: themePrimitives.primary,
   calendarHeaderBackgroundActive: themePrimitives.primary600,
   calendarHeaderForegroundDisabled: themePrimitives.primary500,
-  calendarDayBackgroundPseudoSelected: themePrimitives.primary700,
   calendarDayForegroundPseudoSelected: themePrimitives.primary,
   calendarDayBackgroundPseudoSelectedHighlighted: themePrimitives.primary600,
   calendarDayForegroundPseudoSelectedHighlighted: themePrimitives.primary,
@@ -110,15 +93,12 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   // List
   listHeaderFill: themePrimitives.mono600,
   listBodyFill: themePrimitives.mono800,
-  listIconFill: themePrimitives.mono100,
-  listBorder: themePrimitives.mono500,
 
   // ProgressSteps
   progressStepsCompletedText: themePrimitives.black,
   progressStepsCompletedFill: themePrimitives.primary,
   progressStepsActiveText: themePrimitives.black,
   progressStepsActiveFill: themePrimitives.primary,
-  progressStepsIconActiveFill: themePrimitives.primary,
 
   // Modal
   modalCloseColor: themePrimitives.mono300,
@@ -126,8 +106,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   modalCloseColorFocus: themePrimitives.mono400,
 
   // Notification
-  notificationPrimaryBackground: themePrimitives.primary700,
-  notificationPrimaryText: themePrimitives.primaryA,
   notificationInfoBackground: themePrimitives.accent700,
   notificationInfoText: themePrimitives.primaryA,
   notificationPositiveBackground: themePrimitives.positive700,
@@ -141,7 +119,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
 
   // Custom ramps
   tagFontDisabledRampUnit: '600',
-  tagOutlinedDisabledRampUnit: '700',
   tagSolidFontRampUnit: '0',
   tagSolidRampUnit: '500',
   tagOutlinedFontRampUnit: '500',
@@ -154,7 +131,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   tagLightRampUnit: '700',
   tagLightHoverRampUnit: '700',
   tagLightActiveRampUnit: '600',
-  tagLightDisabledRampUnit: '700',
   tagLightFontRampUnit: '100',
   tagLightFontHoverRampUnit: '100',
   tagOutlinedActiveRampUnit: '300',
@@ -304,7 +280,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
 
   // Toast
   toastText: themePrimitives.white,
-  toastPrimaryBackground: themePrimitives.primary400,
   toastPrimaryText: themePrimitives.white,
   toastInfoBackground: themePrimitives.accent400,
   toastInfoText: themePrimitives.white,
@@ -354,23 +329,12 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   sliderHandleFillDisabled: themePrimitives.primary500,
   sliderHandleInnerFill: themePrimitives.primaryA,
 
-  sliderHandleFillHover: themePrimitives.mono300,
-  sliderHandleFillActive: themePrimitives.mono300,
-  sliderHandleFillSelected: themePrimitives.primary500,
-  sliderHandleFillSelectedHover: themePrimitives.primary600,
-  sliderHandleFillSelectedActive: themePrimitives.primary700,
   sliderTrackFillHover: themePrimitives.mono500,
   sliderTrackFillActive: themePrimitives.mono400,
-  sliderTrackFillSelected: themePrimitives.primary500,
-  sliderTrackFillSelectedActive: themePrimitives.primary600,
-  sliderTrackFillSelectedHover: themePrimitives.primary700,
   sliderTrackFillDisabled: themePrimitives.mono700,
   sliderHandleInnerFillDisabled: themePrimitives.mono500,
   sliderHandleInnerFillSelectedHover: themePrimitives.primary600,
   sliderHandleInnerFillSelectedActive: themePrimitives.primary700,
-  sliderBorder: themePrimitives.white,
-  sliderBorderHover: themePrimitives.white,
-  sliderBorderDisabled: themePrimitives.mono400,
 
   // Input
   inputBorder: themePrimitives.mono600,
@@ -396,12 +360,6 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
   menuFontHighlighted: themePrimitives.white,
   menuFontSelected: themePrimitives.white,
 
-  // Pagination
-  paginationTriangleDown: themePrimitives.mono100,
-
-  // Header navigation
-  headerNavigationFill: themePrimitives.mono700,
-
   // Tab
   tabBarFill: themePrimitives.mono1000,
   tabColor: themePrimitives.mono300,

package/themes/dark-theme/color-tokens.js

@@ -82,8 +82,6 @@ var darkColorTokens = {
   mono900: '#111111',
   mono1000: _index.colors.black,
   // Rating Palette,
-  rating200: _index.colors.yellow200,
-  rating400: _index.colors.yellow400,
   ratingInactiveFill: _index.colors.gray500,
   ratingStroke: _index.colors.gray700
 };

package/themes/dark-theme/color-tokens.js.flow

@@ -77,8 +77,6 @@ export const darkColorTokens: ColorTokensT = {
   mono900: '#111111',
   mono1000: colors.black,
   // Rating Palette,
-  rating200: colors.yellow200,
-  rating400: colors.yellow400,
   ratingInactiveFill: colors.gray500,
   ratingStroke: colors.gray700,
 };