baseui/themes/dark-theme/color-semantic-tokens.js

A React Component library implementing the Base design language

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _colorFoundationTokens = _interopRequireDefault(require("./color-foundation-tokens"));
var _util = require("../../styles/util");
var _colorPrimitiveTokens = require("../../tokens/color-primitive-tokens");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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 _default = (foundation = _colorFoundationTokens.default) => {
  const core = {
    // Background
    backgroundPrimary: foundation.primaryB,
    backgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    backgroundTertiary: _colorPrimitiveTokens.primitiveDarkColors.gray200Dark,
    backgroundInversePrimary: _colorPrimitiveTokens.primitiveDarkColors.gray800Dark,
    backgroundInverseSecondary: _colorPrimitiveTokens.primitiveDarkColors.gray700Dark,
    // Content
    contentPrimary: foundation.primaryA,
    contentSecondary: _colorPrimitiveTokens.primitiveDarkColors.gray800Dark,
    contentTertiary: _colorPrimitiveTokens.primitiveDarkColors.gray700Dark,
    contentInversePrimary: _colorPrimitiveTokens.primitiveDarkColors.black,
    contentInverseSecondary: _colorPrimitiveTokens.primitiveDarkColors.gray200Dark,
    contentInverseTertiary: _colorPrimitiveTokens.primitiveDarkColors.gray300Dark,
    // Border
    borderOpaque: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    borderTransparent: (0, _util.hexToRgb)(foundation.primaryA, '0.08') || '',
    borderSelected: foundation.primaryA,
    borderInverseOpaque: _colorPrimitiveTokens.primitiveDarkColors.gray300Dark,
    borderInverseTransparent: (0, _util.hexToRgb)(foundation.primaryB, '0.2') || '',
    borderInverseSelected: foundation.primaryB,
    // Brand Default
    brandBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.brandDefault500Dark,
    brandBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.brandDefault100Dark,
    brandBackgroundTertiary: _colorPrimitiveTokens.primitiveDarkColors.white,
    brandBackgroundDisabled: _colorPrimitiveTokens.primitiveDarkColors.brandDefault100Dark,
    brandContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.brandDefault600Dark,
    brandContentOnPrimary: _colorPrimitiveTokens.primitiveDarkColors.white,
    brandContentOnSecondary: _colorPrimitiveTokens.primitiveDarkColors.brandDefault700Dark,
    brandContentOnTertiary: _colorPrimitiveTokens.primitiveDarkColors.black,
    brandContentOnGradient: _colorPrimitiveTokens.primitiveDarkColors.white,
    brandContentDisabled: _colorPrimitiveTokens.primitiveDarkColors.brandDefault400Dark,
    brandBorderAccessible: _colorPrimitiveTokens.primitiveDarkColors.brandDefault600Dark,
    brandBorderSubtle: _colorPrimitiveTokens.primitiveDarkColors.brandDefault400Dark
  };
  const coreExtensions = {
    // Backgrounds
    backgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    backgroundOverlay: (0, _util.hexToRgb)(_colorPrimitiveTokens.primitiveDarkColors.black, '0.7') || '',
    backgroundOverlayArt: (0, _util.hexToRgb)(_colorPrimitiveTokens.primitiveDarkColors.black, '0.16') || '',
    backgroundAccent: foundation.accent,
    backgroundNegative: foundation.negative,
    backgroundWarning: foundation.warning,
    backgroundPositive: foundation.positive,
    backgroundAccentLight: _colorPrimitiveTokens.primitiveDarkColors.blue100Dark,
    backgroundPositiveLight: _colorPrimitiveTokens.primitiveDarkColors.green100Dark,
    backgroundNegativeLight: _colorPrimitiveTokens.primitiveDarkColors.red100Dark,
    backgroundWarningLight: _colorPrimitiveTokens.primitiveDarkColors.yellow100Dark,
    backgroundAlwaysDark: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    backgroundAlwaysLight: _colorPrimitiveTokens.primitiveDarkColors.gray900Dark,
    // Content
    contentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.gray400Dark,
    contentAccent: _colorPrimitiveTokens.primitiveDarkColors.blue600Dark,
    contentOnColor: _colorPrimitiveTokens.primitiveDarkColors.gray900Dark,
    contentOnColorInverse: _colorPrimitiveTokens.primitiveDarkColors.black,
    contentNegative: _colorPrimitiveTokens.primitiveDarkColors.red600Dark,
    contentWarning: _colorPrimitiveTokens.primitiveDarkColors.yellow600Dark,
    contentPositive: _colorPrimitiveTokens.primitiveDarkColors.green600Dark,
    tagRedContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.red700Dark,
    // Border
    borderStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    borderAccent: _colorPrimitiveTokens.primitiveDarkColors.blue500Dark,
    borderAccentLight: _colorPrimitiveTokens.primitiveDarkColors.blue400Dark,
    borderNegative: _colorPrimitiveTokens.primitiveDarkColors.red500Dark,
    borderNegativeLight: _colorPrimitiveTokens.primitiveDarkColors.red400Dark,
    borderWarning: _colorPrimitiveTokens.primitiveDarkColors.yellow500Dark,
    borderWarningLight: _colorPrimitiveTokens.primitiveDarkColors.yellow400Dark,
    borderPositive: _colorPrimitiveTokens.primitiveDarkColors.green500Dark,
    borderPositiveLight: _colorPrimitiveTokens.primitiveDarkColors.green400Dark,
    tagRedBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.red800Dark,
    // Programs
    safety: _colorPrimitiveTokens.primitiveLightColors.blue600,
    eatsGreen400: _colorPrimitiveTokens.primitiveLightColors.green600,
    freightBlue400: _colorPrimitiveTokens.primitiveLightColors.cobalt400,
    rewardsTier1: _colorPrimitiveTokens.primitiveLightColors.blue600,
    rewardsTier2: _colorPrimitiveTokens.primitiveLightColors.yellow300,
    rewardsTier3: _colorPrimitiveTokens.primitiveLightColors.platinum400,
    rewardsTier4: _colorPrimitiveTokens.primitiveLightColors.black,
    membership: _colorPrimitiveTokens.primitiveLightColors.yellow600
  };
  const deprecated = {
    jumpRed400: _colorPrimitiveTokens.primitiveLightColors.red600,
    backgroundOverlayLight: coreExtensions.backgroundOverlay,
    backgroundOverlayDark: coreExtensions.backgroundOverlay,
    backgroundLightAccent: coreExtensions.backgroundAccentLight,
    backgroundLightPositive: coreExtensions.backgroundPositiveLight,
    backgroundLightWarning: coreExtensions.backgroundWarningLight,
    backgroundLightNegative: coreExtensions.backgroundNegativeLight
  };
  const tagTokens = {
    tagGrayBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.gray400Dark,
    tagGrayBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    tagGrayContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.gray900Dark,
    tagGrayContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.gray700Dark,
    tagGrayBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.gray100Dark,
    tagGrayContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.gray400Dark,
    tagGrayBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.gray500Dark,
    tagGrayBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.gray500Dark,
    tagGrayBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.gray800Dark,
    tagRedBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.red400Dark,
    tagRedBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.red100Dark,
    tagRedContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.red900Dark,
    tagRedContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.red700Dark,
    tagRedBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.red100Dark,
    tagRedContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.red400Dark,
    tagRedBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.red500Dark,
    tagRedBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.red500Dark,
    tagRedBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.red800Dark,
    tagOrangeBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.orange400Dark,
    tagOrangeBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.orange100Dark,
    tagOrangeContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.orange900Dark,
    tagOrangeContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.orange700Dark,
    tagOrangeBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.orange100Dark,
    tagOrangeContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.orange400Dark,
    tagYellowBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.yellow700Dark,
    tagOrangeBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.orange500Dark,
    tagYellowBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.yellow100Dark,
    tagOrangeBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.orange500Dark,
    tagOrangeBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.orange800Dark,
    tagYellowContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.yellow50Dark,
    tagYellowContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.yellow900Dark,
    tagYellowBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.yellow100Dark,
    tagYellowContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.yellow400Dark,
    tagYellowBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.yellow800Dark,
    tagYellowBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.yellow500Dark,
    tagYellowBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.yellow800Dark,
    tagGreenBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.green400Dark,
    tagGreenBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.green100Dark,
    tagGreenContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.green900Dark,
    tagGreenContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.green700Dark,
    tagGreenBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.green100Dark,
    tagGreenContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.green400Dark,
    tagGreenBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.green500Dark,
    tagBlueBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.blue400Dark,
    tagBlueBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.blue100Dark,
    tagGreenBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.green500Dark,
    tagBlueContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.blue900Dark,
    tagGreenBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.green800Dark,
    tagBlueContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.blue700Dark,
    tagBlueBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.blue100Dark,
    tagBlueContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.blue400Dark,
    tagBlueBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.blue500Dark,
    tagPurpleBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.purple400Dark,
    tagPurpleBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.purple100Dark,
    tagBlueBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.blue500Dark,
    tagBlueBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.blue800Dark,
    tagPurpleContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.purple900Dark,
    tagPurpleContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.purple700Dark,
    tagPurpleBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.purple100Dark,
    tagPurpleContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.purple400Dark,
    tagPurpleBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.purple500Dark,
    tagMagentaBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.magenta400Dark,
    tagPurpleBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.purple500Dark,
    tagMagentaBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.magenta100Dark,
    tagPurpleBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.purple800Dark,
    tagMagentaContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.magenta900Dark,
    tagMagentaContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.magenta700Dark,
    tagMagentaBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.magenta100Dark,
    tagMagentaContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.magenta400Dark,
    tagMagentaBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.magenta500Dark,
    tagMagentaBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.magenta500Dark,
    tagMagentaBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.magenta800Dark,
    tagTealBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.teal400Dark,
    tagTealBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.teal100Dark,
    tagTealContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.teal900Dark,
    tagTealContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.teal700Dark,
    tagTealBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.teal100Dark,
    tagTealContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.teal400Dark,
    tagTealBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.teal500Dark,
    tagTealBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.teal500Dark,
    tagTealBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.teal800Dark,
    tagLimeBackgroundPrimary: _colorPrimitiveTokens.primitiveDarkColors.lime400Dark,
    tagLimeBackgroundSecondary: _colorPrimitiveTokens.primitiveDarkColors.lime100Dark,
    tagLimeContentPrimary: _colorPrimitiveTokens.primitiveDarkColors.lime900Dark,
    tagLimeContentSecondary: _colorPrimitiveTokens.primitiveDarkColors.lime700Dark,
    tagLimeBackgroundStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.lime100Dark,
    tagLimeContentStateDisabled: _colorPrimitiveTokens.primitiveDarkColors.lime400Dark,
    tagLimeBorderPrimaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.lime500Dark,
    tagLimeBorderSecondaryUnselected: _colorPrimitiveTokens.primitiveDarkColors.lime500Dark,
    tagLimeBorderSecondarySelected: _colorPrimitiveTokens.primitiveDarkColors.lime800Dark
  };
  const hoveredAndPressedColors = {
    hoverOverlayInverseAlpha: 'rgba(0, 0, 0, 0.04)',
    hoverOverlayAlpha: 'rgba(255, 255, 255, 0.1)',
    hoverNegativeAlpha: 'rgba(163, 44, 52, 0.4)',
    pressedOverlayAlpha: 'rgba(255, 255, 255, 0.15)',
    pressedOverlayInverseAlpha: 'rgba(0, 0, 0, 0.08)',
    pressedNegativeAlpha: 'rgba(163, 44, 52, 0.6)'
  };
  return {
    ...core,
    ...coreExtensions,
    ...tagTokens,
    ...hoveredAndPressedColors,
    ...deprecated
  };
};
exports.default = _default;