@fluentui/react-theme-provider
Version:
Fluent UI React theme provider component, hook, and theme related utilities.
1,489 lines (1,414 loc) • 3.39 MB
JavaScript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[0],[
/* 0 */,
/* 1 */,
/* 2 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
__webpack_require__(179);
tslib_1.__exportStar(__webpack_require__(10), exports);
/***/ }),
/* 3 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
__webpack_require__(179);
tslib_1.__exportStar(__webpack_require__(27), exports);
/***/ }),
/* 4 */,
/* 5 */,
/* 6 */,
/* 7 */,
/* 8 */,
/* 9 */,
/* 10 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(605), exports);
tslib_1.__exportStar(__webpack_require__(1778), exports);
tslib_1.__exportStar(__webpack_require__(1798), exports);
tslib_1.__exportStar(__webpack_require__(1799), exports);
tslib_1.__exportStar(__webpack_require__(1800), exports);
tslib_1.__exportStar(__webpack_require__(235), exports);
tslib_1.__exportStar(__webpack_require__(1801), exports);
tslib_1.__exportStar(__webpack_require__(613), exports);
tslib_1.__exportStar(__webpack_require__(1802), exports);
tslib_1.__exportStar(__webpack_require__(1803), exports);
tslib_1.__exportStar(__webpack_require__(1804), exports);
tslib_1.__exportStar(__webpack_require__(1805), exports);
tslib_1.__exportStar(__webpack_require__(1806), exports);
tslib_1.__exportStar(__webpack_require__(1807), exports);
tslib_1.__exportStar(__webpack_require__(1808), exports);
tslib_1.__exportStar(__webpack_require__(1809), exports);
tslib_1.__exportStar(__webpack_require__(1810), exports);
tslib_1.__exportStar(__webpack_require__(345), exports);
tslib_1.__exportStar(__webpack_require__(1811), exports);
tslib_1.__exportStar(__webpack_require__(614), exports);
tslib_1.__exportStar(__webpack_require__(1812), exports);
tslib_1.__exportStar(__webpack_require__(615), exports);
tslib_1.__exportStar(__webpack_require__(1813), exports);
tslib_1.__exportStar(__webpack_require__(1814), exports);
tslib_1.__exportStar(__webpack_require__(1815), exports);
tslib_1.__exportStar(__webpack_require__(1832), exports);
tslib_1.__exportStar(__webpack_require__(624), exports);
tslib_1.__exportStar(__webpack_require__(1833), exports);
tslib_1.__exportStar(__webpack_require__(1834), exports);
tslib_1.__exportStar(__webpack_require__(237), exports);
tslib_1.__exportStar(__webpack_require__(1835), exports);
tslib_1.__exportStar(__webpack_require__(1836), exports);
tslib_1.__exportStar(__webpack_require__(238), exports);
tslib_1.__exportStar(__webpack_require__(1837), exports);
tslib_1.__exportStar(__webpack_require__(628), exports);
tslib_1.__exportStar(__webpack_require__(625), exports);
tslib_1.__exportStar(__webpack_require__(626), exports);
tslib_1.__exportStar(__webpack_require__(618), exports);
tslib_1.__exportStar(__webpack_require__(239), exports);
tslib_1.__exportStar(__webpack_require__(1838), exports);
tslib_1.__exportStar(__webpack_require__(629), exports);
tslib_1.__exportStar(__webpack_require__(1839), exports);
tslib_1.__exportStar(__webpack_require__(1840), exports);
tslib_1.__exportStar(__webpack_require__(627), exports);
tslib_1.__exportStar(__webpack_require__(1841), exports);
tslib_1.__exportStar(__webpack_require__(1842), exports);
tslib_1.__exportStar(__webpack_require__(1843), exports);
tslib_1.__exportStar(__webpack_require__(1844), exports);
tslib_1.__exportStar(__webpack_require__(350), exports);
tslib_1.__exportStar(__webpack_require__(1845), exports);
tslib_1.__exportStar(__webpack_require__(1847), exports);
tslib_1.__exportStar(__webpack_require__(349), exports);
tslib_1.__exportStar(__webpack_require__(1848), exports);
tslib_1.__exportStar(__webpack_require__(1849), exports);
tslib_1.__exportStar(__webpack_require__(1850), exports);
var object_1 = __webpack_require__(606);
exports.assign = object_1.assign;
exports.filteredAssign = object_1.filteredAssign;
exports.mapEnumByName = object_1.mapEnumByName;
exports.shallowCompare = object_1.shallowCompare;
exports.values = object_1.values;
exports.omit = object_1.omit;
tslib_1.__exportStar(__webpack_require__(1851), exports);
tslib_1.__exportStar(__webpack_require__(1852), exports);
tslib_1.__exportStar(__webpack_require__(630), exports);
tslib_1.__exportStar(__webpack_require__(1853), exports);
tslib_1.__exportStar(__webpack_require__(1854), exports);
tslib_1.__exportStar(__webpack_require__(616), exports);
tslib_1.__exportStar(__webpack_require__(1855), exports);
tslib_1.__exportStar(__webpack_require__(1856), exports);
tslib_1.__exportStar(__webpack_require__(607), exports);
tslib_1.__exportStar(__webpack_require__(1857), exports);
tslib_1.__exportStar(__webpack_require__(1859), exports);
tslib_1.__exportStar(__webpack_require__(1860), exports);
tslib_1.__exportStar(__webpack_require__(632), exports);
tslib_1.__exportStar(__webpack_require__(1862), exports);
tslib_1.__exportStar(__webpack_require__(1863), exports);
var merge_styles_1 = __webpack_require__(36);
exports.IStyleFunctionOrObject = merge_styles_1.IStyleFunctionOrObject;
exports.Omit = merge_styles_1.Omit;
var setFocusVisibility_1 = __webpack_require__(351);
exports.setFocusVisibility = setFocusVisibility_1.setFocusVisibility;
exports.IsFocusVisibleClassName = setFocusVisibility_1.IsFocusVisibleClassName;
var setSSR_1 = __webpack_require__(343);
exports.setSSR = setSSR_1.setSSR;
var createMergedRef_1 = __webpack_require__(1864);
exports.createMergedRef = createMergedRef_1.createMergedRef;
__webpack_require__(1865);
/***/ }),
/* 11 */,
/* 12 */,
/* 13 */,
/* 14 */,
/* 15 */,
/* 16 */,
/* 17 */,
/* 18 */,
/* 19 */,
/* 20 */,
/* 21 */,
/* 22 */,
/* 23 */,
/* 24 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(681), exports);
/***/ }),
/* 25 */,
/* 26 */,
/* 27 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(1869), exports);
tslib_1.__exportStar(__webpack_require__(353), exports);
tslib_1.__exportStar(__webpack_require__(640), exports);
tslib_1.__exportStar(__webpack_require__(1888), exports);
tslib_1.__exportStar(__webpack_require__(642), exports);
__webpack_require__(1891);
// Ensure theme is initialized when this package is referenced.
var theme_1 = __webpack_require__(654);
theme_1.initializeThemeInCustomizations();
/***/ }),
/* 28 */,
/* 29 */,
/* 30 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Styling_1 = __webpack_require__(3);
exports.inputHeight = '18px';
exports.borderWidth = '1px';
exports.borderWidthError = '2px';
exports.borderSolid = 'solid';
exports.borderNone = 'none';
exports.dropDownItemHeight = '32px';
exports.dropDownRootHeight = '25px';
exports.fontFamily =
// eslint-disable-next-line @fluentui/max-len
'Segoe UI, "Segoe UI Web (West European)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue",sans-serif';
exports.fontWeightBold = '700';
exports.inputControlHeight = '24px';
exports.inputControlHeightInner = '20px';
exports.textAlignCenter = 'center';
exports.transparent = 'transparent';
exports.MinimumScreenSelector = Styling_1.getScreenSelector(0, Styling_1.ScreenWidthMaxSmall);
exports.MediumScreenSelector = Styling_1.getScreenSelector(Styling_1.ScreenWidthMinMedium, Styling_1.ScreenWidthMaxMedium);
/***/ }),
/* 31 */,
/* 32 */,
/* 33 */,
/* 34 */,
/* 35 */,
/* 36 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
var IStyle_1 = __webpack_require__(1779);
exports.IStyle = IStyle_1.IStyle;
exports.IStyleBase = IStyle_1.IStyleBase;
exports.IStyleBaseArray = IStyle_1.IStyleBaseArray;
var IRawStyle_1 = __webpack_require__(1780);
exports.IRawStyle = IRawStyle_1.IRawStyle;
var IKeyframes_1 = __webpack_require__(1781);
exports.IKeyframes = IKeyframes_1.IKeyframes;
var IStyleFunction_1 = __webpack_require__(1782);
exports.IStyleFunction = IStyleFunction_1.IStyleFunction;
exports.IStyleFunctionOrObject = IStyleFunction_1.IStyleFunctionOrObject;
var DeepPartial_1 = __webpack_require__(1783);
exports.DeepPartial = DeepPartial_1.DeepPartial;
var IStyleSet_1 = __webpack_require__(1784);
exports.IConcatenatedStyleSet = IStyleSet_1.IConcatenatedStyleSet;
exports.IProcessedStyleSet = IStyleSet_1.IProcessedStyleSet;
exports.IStyleSet = IStyleSet_1.IStyleSet;
exports.Omit = IStyleSet_1.Omit;
var IRawStyleBase_1 = __webpack_require__(1785);
exports.ICSSRule = IRawStyleBase_1.ICSSRule;
exports.IFontFace = IRawStyleBase_1.IFontFace;
exports.IFontWeight = IRawStyleBase_1.IFontWeight;
exports.IRawFontStyle = IRawStyleBase_1.IRawFontStyle;
exports.IRawStyleBase = IRawStyleBase_1.IRawStyleBase;
var mergeStyles_1 = __webpack_require__(1786);
exports.mergeStyles = mergeStyles_1.mergeStyles;
exports.mergeCss = mergeStyles_1.mergeCss;
var mergeStyleSets_1 = __webpack_require__(1792);
exports.mergeStyleSets = mergeStyleSets_1.mergeStyleSets;
exports.mergeCssSets = mergeStyleSets_1.mergeCssSets;
var concatStyleSets_1 = __webpack_require__(344);
exports.concatStyleSets = concatStyleSets_1.concatStyleSets;
var concatStyleSetsWithProps_1 = __webpack_require__(1793);
exports.concatStyleSetsWithProps = concatStyleSetsWithProps_1.concatStyleSetsWithProps;
var fontFace_1 = __webpack_require__(1794);
exports.fontFace = fontFace_1.fontFace;
var keyframes_1 = __webpack_require__(1795);
exports.keyframes = keyframes_1.keyframes;
tslib_1.__exportStar(__webpack_require__(180), exports);
var StyleOptionsState_1 = __webpack_require__(181);
exports.setRTL = StyleOptionsState_1.setRTL;
var ObjectOnly_1 = __webpack_require__(1796);
exports.ObjectOnly = ObjectOnly_1.ObjectOnly;
__webpack_require__(1797);
/***/ }),
/* 37 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(2013), exports);
/***/ }),
/* 38 */,
/* 39 */,
/* 40 */,
/* 41 */,
/* 42 */,
/* 43 */,
/* 44 */,
/* 45 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MAX_COLOR_SATURATION = 100;
exports.MAX_COLOR_HUE = 359;
exports.MAX_COLOR_VALUE = 100;
exports.MAX_COLOR_RGB = 255;
/** @deprecated Use MAX_COLOR_RGB (255) or MAX_COLOR_ALPHA (100) */
exports.MAX_COLOR_RGBA = exports.MAX_COLOR_RGB;
exports.MAX_COLOR_ALPHA = 100;
/** Minimum length for a hexadecimal color string (not including the #) */
exports.MIN_HEX_LENGTH = 3;
/** Maximum length for a hexadecimal color string (not including the #) */
exports.MAX_HEX_LENGTH = 6;
/** Minimum length for a string of an RGBA color component */
exports.MIN_RGBA_LENGTH = 1;
/** Maximum length for a string of an RGBA color component */
exports.MAX_RGBA_LENGTH = 3;
/** Regular expression matching only valid hexadecimal chars */
exports.HEX_REGEX = /^[\da-f]{0,6}$/i;
/** Regular expression matching only numbers */
exports.RGBA_REGEX = /^\d{0,3}$/;
/***/ }),
/* 46 */,
/* 47 */,
/* 48 */,
/* 49 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(1924), exports);
/***/ }),
/* 50 */,
/* 51 */,
/* 52 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DirectionalHint = {
/**
* Appear above the target element, with the left edges of the callout and target aligning.
*/
topLeftEdge: 0,
/**
* Appear above the target element, with the centers of the callout and target aligning.
*/
topCenter: 1,
/**
* Appear above the target element, with the right edges of the callout and target aligning.
*/
topRightEdge: 2,
/**
* Appear above the target element, aligning with the target element such that the callout tends toward
* the center of the screen.
*/
topAutoEdge: 3,
/**
* Appear below the target element, with the left edges of the callout and target aligning.
*/
bottomLeftEdge: 4,
/**
* Appear below the target element, with the centers of the callout and target aligning.
*/
bottomCenter: 5,
/**
* Appear below the target element, with the right edges of the callout and target aligning.
*/
bottomRightEdge: 6,
/**
* Appear below the target element, aligning with the target element such that the callout tends toward
* the center of the screen.
*/
bottomAutoEdge: 7,
/**
* Appear to the left of the target element, with the top edges of the callout and target aligning.
*/
leftTopEdge: 8,
/**
* Appear to the left of the target element, with the centers of the callout and target aligning.
*/
leftCenter: 9,
/**
* Appear to the left of the target element, with the bottom edges of the callout and target aligning.
*/
leftBottomEdge: 10,
/**
* Appear to the right of the target element, with the top edges of the callout and target aligning.
*/
rightTopEdge: 11,
/**
* Appear to the right of the target element, with the centers of the callout and target aligning.
*/
rightCenter: 12,
/**
* Appear to the right of the target element, with the bottom edges of the callout and target aligning.
*/
rightBottomEdge: 13,
};
/***/ }),
/* 53 */,
/* 54 */,
/* 55 */,
/* 56 */,
/* 57 */,
/* 58 */,
/* 59 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var setSSR_1 = __webpack_require__(343);
var _window = undefined;
// Note: Accessing "window" in IE11 is somewhat expensive, and calling "typeof window"
// hits a memory leak, whereas aliasing it and calling "typeof _window" does not.
// Caching the window value at the file scope lets us minimize the impact.
try {
_window = window;
}
catch (e) {
/* no-op */
}
/**
* Helper to get the window object. The helper will make sure to use a cached variable
* of "window", to avoid overhead and memory leaks in IE11. Note that in popup scenarios the
* window object won't match the "global" window object, and for these scenarios, you should
* pass in an element hosted within the popup.
*
* @public
*/
function getWindow(rootElement) {
if (setSSR_1._isSSR || typeof _window === 'undefined') {
return undefined;
}
else {
var el = rootElement;
return el && el.ownerDocument && el.ownerDocument.defaultView ? el.ownerDocument.defaultView : _window;
}
}
exports.getWindow = getWindow;
/***/ }),
/* 60 */,
/* 61 */,
/* 62 */,
/* 63 */,
/* 64 */,
/* 65 */,
/* 66 */,
/* 67 */,
/* 68 */,
/* 69 */,
/* 70 */,
/* 71 */,
/* 72 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var setVersion_1 = __webpack_require__(1777);
exports.setVersion = setVersion_1.setVersion;
setVersion_1.setVersion('@uifabric/set-version', '6.0.0');
/***/ }),
/* 73 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(1817), exports);
tslib_1.__exportStar(__webpack_require__(1818), exports);
tslib_1.__exportStar(__webpack_require__(1819), exports);
tslib_1.__exportStar(__webpack_require__(348), exports);
tslib_1.__exportStar(__webpack_require__(1820), exports);
tslib_1.__exportStar(__webpack_require__(346), exports);
tslib_1.__exportStar(__webpack_require__(619), exports);
tslib_1.__exportStar(__webpack_require__(347), exports);
tslib_1.__exportStar(__webpack_require__(1821), exports);
tslib_1.__exportStar(__webpack_require__(620), exports);
tslib_1.__exportStar(__webpack_require__(1822), exports);
/***/ }),
/* 74 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(633), exports);
/***/ }),
/* 75 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(686), exports);
/***/ }),
/* 76 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
tslib_1.__exportStar(__webpack_require__(657), exports);
tslib_1.__exportStar(__webpack_require__(1959), exports);
tslib_1.__exportStar(__webpack_require__(655), exports);
tslib_1.__exportStar(__webpack_require__(656), exports);
tslib_1.__exportStar(__webpack_require__(659), exports);
tslib_1.__exportStar(__webpack_require__(1961), exports);
tslib_1.__exportStar(__webpack_require__(355), exports);
tslib_1.__exportStar(__webpack_require__(240), exports);
var FluentTheme_1 = __webpack_require__(1963);
exports.FluentTheme = FluentTheme_1.FluentTheme;
/***/ }),
/* 77 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var BaseColors;
(function (BaseColors) {
BaseColors.BLUE_F0F6FF = '#F0F6FF';
BaseColors.BLUE_CCE1FF = '#cce1ff';
BaseColors.BLUE_DEECF9 = '#deecf9';
BaseColors.BLUE_0000CD = '#0000cd';
BaseColors.BLUE_00245B = '#00245B';
BaseColors.BLUE_00E8E8 = '#00e8e8';
BaseColors.BLUE_00FFFF = '#00ffff';
BaseColors.BLUE_004578 = '#004578';
BaseColors.BLUE_005A9E = '#005A9E';
BaseColors.BLUE_0078D4 = '#0078D4';
BaseColors.BLUE_016AFE = '#016afe';
BaseColors.BLUE_015CDA = '#015cda';
BaseColors.BLUE_014DB7 = '#014db7';
BaseColors.BLUE_012B65 = '#012b65';
BaseColors.BLUE_106EBE = '#106EBE';
BaseColors.BLUE_02FEFF = '#02FEFF';
BaseColors.BLUE_043862 = '#043862';
BaseColors.BLUE_6CA9FE = '#6ca9fe';
BaseColors.BLUE_6CB8F6 = '#6cb8f6';
BaseColors.BLUE_82C7FF = '#82C7FF';
BaseColors.BLUE_4894FE = '#4894fe';
BaseColors.BLUE_257FFE = '#257FFE';
BaseColors.BLUE_2899F5 = '#2899f5';
BaseColors.BLUE_3AA0F3 = '#3aa0f3';
BaseColors.BLUE_55B3FF = '#55b3ff';
BaseColors.GREEN_00FF00 = '#00FF00';
BaseColors.GREEN_E6FFCC = '#e6ffcc';
BaseColors.GREEN_F8FFF0 = '#F8FFF0';
BaseColors.GREEN_92C353 = '#92C353';
BaseColors.GREEN_5DB300 = '#5db300';
BaseColors.GREEN_57A300 = '#57A300';
BaseColors.GREEN_428000 = '#428000';
BaseColors.GREEN_393D1B = '#393D1B';
BaseColors.GREEN_1A3300 = '#1a3300';
BaseColors.GREEN_0AFF00 = '#0AFF00';
BaseColors.RED_FEF0F1 = '#FEF0F1';
BaseColors.RED_FDD8DB = '#fdd8db';
BaseColors.RED_F63747 = '#f63747';
BaseColors.RED_F1707B = '#F1707B';
BaseColors.RED_E00B1C = '#e00b1c';
BaseColors.RED_442726 = '#442726';
BaseColors.RED_61050C = '#61050c';
BaseColors.RED_800000 = '#800002';
BaseColors.ORANGE_DB7500 = '#DB7500';
BaseColors.ORANGE_FFDFB8 = '#ffdfb8';
BaseColors.ORANGE_FFF8F0 = '#FFF8F0';
BaseColors.ORANGE_FF8C00 = '#ff8c00';
BaseColors.ORANGE_422400 = '#422400';
BaseColors.ORANGE_4F2A0F = '#4F2A0F';
BaseColors.PURPLE_800080 = '#800080';
BaseColors.PURPLE_F9F3FC = '#F9F3FC';
BaseColors.PURPLE_EFDBF5 = '#efdbf5';
BaseColors.PURPLE_C87FDC = '#c87fdc';
BaseColors.PURPLE_917EDB = '#917EDB';
BaseColors.PURPLE_8A2DA5 = '#8a2da5';
BaseColors.PURPLE_660166 = '#660166';
BaseColors.PURPLE_471754 = '#471754';
BaseColors.PURPLE_38134A = '#38134A';
BaseColors.YELLOW_FEFF00 = '#FEFF00';
BaseColors.YELLOW_FCE100 = '#FCE100';
BaseColors.GRAY_CCCCCC = '#CCCCCC';
BaseColors.GRAY_111111 = '#111111';
BaseColors.GRAY_161616 = '#161616';
BaseColors.GRAY_1B1A19 = '#1b1a19';
BaseColors.GRAY_201F1E = '#201F1E';
BaseColors.GRAY_252423 = '#252423';
BaseColors.GRAY_292827 = '#292827';
BaseColors.GRAY_323130 = '#323130';
BaseColors.GRAY_302928 = '#302928';
BaseColors.GRAY_414141 = '#414141';
BaseColors.GRAY_484644 = '#484644';
BaseColors.GRAY_595959 = '#595959';
BaseColors.GRAY_605E5C = '#605E5C';
BaseColors.GRAY_747474 = '#747474';
BaseColors.GRAY_797775 = '#797775';
BaseColors.GRAY_808080 = '#808080';
BaseColors.GRAY_8A8886 = '#8A8886';
BaseColors.GRAY_979693 = '#979693';
BaseColors.GRAY_AFAFAF = '#afafaf';
BaseColors.GRAY_A19F9D = '#A19F9D';
BaseColors.GRAY_C8C6C4 = '#C8C6C4';
BaseColors.GRAY_EDEBE9 = '#EDEBE9';
BaseColors.GRAY_E1DFDD = '#E1DFDD';
BaseColors.GRAY_F3F2F1 = '#F3F2F1';
BaseColors.GRAY_6B849C = '#6B849C';
BaseColors.BLACK = '#000000';
BaseColors.WHITE = '#ffffff';
BaseColors.TRANSPARENT = 'transparent';
BaseColors.GRAY_000000_060 = 'rgba(0, 0, 0, .6)';
BaseColors.GRAY_6B849C_006 = 'rgba(107, 132, 156, .06)';
BaseColors.GRAY_6B849C_025 = 'rgba(107, 132, 156, .25)';
BaseColors.GRAY_6B849C_035 = 'rgba(107, 132, 156, .35)';
BaseColors.GRAY_808080_010 = 'rgba(128, 128, 128, .10)';
BaseColors.GRAY_808080_015 = 'rgba(128, 128, 128, .15)';
BaseColors.GRAY_808080_025 = 'rgba(128, 128, 128, .25)';
BaseColors.GRAY_808080_070 = 'rgba(128, 128, 128, .70)';
BaseColors.BLUE_55B3FF_010 = 'rgba(85, 179, 255, .10)';
BaseColors.BLUE_55B3FF_020 = 'rgba(85, 179, 255, .20)';
// Extended Palette Colors (not in Azure spec)
BaseColors.GRAY_FFFFFF_050 = 'rgba(255,255,255,.5)'; // overlay light
BaseColors.GRAY_000000_050 = 'rgba(0,0,0,.5)'; // overlay dark
BaseColors.GRAY_404040 = '#404040'; // shimmer
BaseColors.GRAY_F7F7F7 = '#f7f7f7'; // shimmer
BaseColors.GRAY_DFDFDF = '#dfdfdf'; // shimmer
})(BaseColors = exports.BaseColors || (exports.BaseColors = {}));
var CommonSemanticColors;
(function (CommonSemanticColors) {
CommonSemanticColors.icons = {
okay: BaseColors.GREEN_5DB300,
error: BaseColors.RED_E00B1C,
warning: BaseColors.ORANGE_FF8C00,
information: BaseColors.BLUE_015CDA,
upsell: BaseColors.PURPLE_8A2DA5,
};
CommonSemanticColors.dividers = {
lineSeparator: BaseColors.GRAY_6B849C_025,
sectionDivider: BaseColors.GRAY_6B849C_035,
};
CommonSemanticColors.backgrounds = {
disabled: BaseColors.GRAY_808080_010,
section: BaseColors.GRAY_6B849C_006,
overlay: BaseColors.GRAY_000000_060,
};
CommonSemanticColors.textControlOutline = {
rest: BaseColors.GRAY_808080_070,
hover: BaseColors.GRAY_808080,
};
CommonSemanticColors.controlOutline = {
rest: BaseColors.GRAY_808080,
disabled: BaseColors.GRAY_808080_070,
};
CommonSemanticColors.overlay = {
light: BaseColors.GRAY_FFFFFF_050,
dark: BaseColors.GRAY_000000_050,
};
})(CommonSemanticColors = exports.CommonSemanticColors || (exports.CommonSemanticColors = {}));
exports.DarkSemanticColors = {
background: BaseColors.GRAY_111111,
text: {
list: BaseColors.WHITE,
heading: BaseColors.WHITE,
body: BaseColors.GRAY_F3F2F1,
bodyHovered: BaseColors.WHITE,
value: BaseColors.WHITE,
icon: BaseColors.WHITE,
label: BaseColors.WHITE,
disabled: BaseColors.GRAY_A19F9D,
hyperlink: BaseColors.BLUE_4894FE,
hyperlinkHovered: BaseColors.BLUE_82C7FF,
hyperlinkBackgroundHovered: BaseColors.TRANSPARENT,
success: BaseColors.GREEN_5DB300,
error: BaseColors.RED_F63747,
placeholder: BaseColors.GRAY_AFAFAF,
},
statusBar: {
link: BaseColors.BLUE_6CB8F6,
background: {
default: BaseColors.BLUE_00245B,
okay: BaseColors.GREEN_393D1B,
error: BaseColors.RED_442726,
warning: BaseColors.ORANGE_4F2A0F,
information: BaseColors.BLUE_00245B,
upsell: BaseColors.PURPLE_38134A,
},
border: {
default: BaseColors.BLUE_00245B,
okay: BaseColors.GREEN_393D1B,
error: BaseColors.RED_442726,
warning: BaseColors.ORANGE_4F2A0F,
information: BaseColors.BLUE_00245B,
upsell: BaseColors.PURPLE_38134A,
},
icon: {
default: BaseColors.BLUE_2899F5,
okay: BaseColors.GREEN_92C353,
error: BaseColors.RED_F1707B,
warning: BaseColors.YELLOW_FCE100,
information: BaseColors.BLUE_2899F5,
upsell: BaseColors.PURPLE_917EDB,
},
},
primaryButton: {
rest: {
background: BaseColors.BLUE_0078D4,
text: BaseColors.WHITE,
border: BaseColors.BLUE_0078D4,
},
hover: {
background: BaseColors.BLUE_106EBE,
text: BaseColors.WHITE,
},
pressed: {
background: BaseColors.BLUE_005A9E,
text: BaseColors.WHITE,
},
disabled: {
background: BaseColors.GRAY_F3F2F1,
border: BaseColors.GRAY_252423,
text: BaseColors.GRAY_A19F9D,
},
focus: {
text: BaseColors.BLACK,
},
},
disabledButton: {
background: BaseColors.GRAY_252423,
text: BaseColors.GRAY_797775,
},
secondaryButton: {
rest: {
background: BaseColors.GRAY_111111,
border: BaseColors.GRAY_979693,
text: BaseColors.WHITE,
},
hover: {
background: BaseColors.GRAY_252423,
border: BaseColors.GRAY_979693,
color: BaseColors.WHITE,
},
pressed: {
text: BaseColors.WHITE,
background: BaseColors.GRAY_292827,
border: BaseColors.GRAY_979693,
},
},
checkBox: {
rest: {
border: BaseColors.GRAY_F3F2F1,
hover: BaseColors.GRAY_A19F9D,
background: BaseColors.BLUE_2899F5,
focus: BaseColors.BLUE_4894FE,
check: BaseColors.BLACK,
},
checked: {
border: BaseColors.BLUE_2899F5,
background: BaseColors.BLUE_2899F5,
default: BaseColors.BLUE_6CB8F6,
hoverBackground: BaseColors.BLUE_6CB8F6,
hoverBorder: BaseColors.BLUE_6CB8F6,
},
disabled: {
border: BaseColors.GRAY_484644,
background: BaseColors.GRAY_484644,
},
},
controlOutlines: {
rest: BaseColors.GRAY_808080,
background: BaseColors.GRAY_252423,
disabled: BaseColors.GRAY_808080_070,
hover: BaseColors.WHITE,
accent: BaseColors.BLUE_106EBE,
error: BaseColors.RED_F63747,
dirty: BaseColors.PURPLE_C87FDC,
},
choiceGroup: {
circle: {
hover: BaseColors.BLUE_3AA0F3,
},
},
item: {
hover: BaseColors.GRAY_808080_015,
select: BaseColors.GRAY_808080_025,
selectHovered: BaseColors.GRAY_808080_070,
},
shimmer: {
primary: BaseColors.GRAY_808080,
secondary: BaseColors.GRAY_404040,
},
toggle: {
disabled: {
backrgound: BaseColors.GRAY_484644,
},
},
commandBar: {
border: BaseColors.GRAY_605E5C,
},
datePicker: {
rest: {
selected: BaseColors.BLUE_0078D4,
text: BaseColors.WHITE,
},
disabled: {
border: BaseColors.GRAY_A19F9D,
},
},
detailsRow: {
border: BaseColors.GRAY_414141,
},
radioButton: {
circle: {
uncheckedRest: BaseColors.WHITE,
checkedDisabled: BaseColors.BLACK,
borderDisabled: BaseColors.GRAY_F3F2F1,
},
pill: {
disabled: BaseColors.GRAY_C8C6C4,
uncheckedDisabled: BaseColors.BLACK,
checkedHover: BaseColors.BLUE_3AA0F3,
uncheckedHover: BaseColors.BLACK,
},
},
tabs: {
hover: BaseColors.GRAY_252423,
},
teachingBubble: {
rest: {
background: BaseColors.BLUE_2899F5,
border: BaseColors.BLUE_2899F5,
text: BaseColors.BLACK,
secondaryBackround: BaseColors.BLACK,
},
hover: {
primaryButtonBackground: BaseColors.BLUE_043862,
},
},
};
exports.HighContrastDarkSemanticColors = {
background: BaseColors.GRAY_111111,
text: {
list: BaseColors.YELLOW_FEFF00,
heading: BaseColors.WHITE,
body: BaseColors.WHITE,
bodyHovered: BaseColors.WHITE,
value: BaseColors.WHITE,
icon: BaseColors.WHITE,
label: BaseColors.WHITE,
disabled: BaseColors.GREEN_0AFF00,
hyperlink: BaseColors.YELLOW_FEFF00,
hyperlinkHovered: BaseColors.BLACK,
hyperlinkBackgroundHovered: BaseColors.BLUE_00FFFF,
success: BaseColors.GREEN_5DB300,
error: BaseColors.RED_F63747,
placeholder: BaseColors.GREEN_0AFF00,
},
statusBar: {
link: BaseColors.YELLOW_FEFF00,
background: {
default: BaseColors.TRANSPARENT,
okay: BaseColors.TRANSPARENT,
error: BaseColors.TRANSPARENT,
warning: BaseColors.TRANSPARENT,
information: BaseColors.TRANSPARENT,
upsell: BaseColors.TRANSPARENT,
},
border: {
default: BaseColors.BLUE_00245B,
okay: BaseColors.GREEN_393D1B,
error: BaseColors.RED_442726,
warning: BaseColors.ORANGE_4F2A0F,
information: BaseColors.BLUE_00245B,
upsell: BaseColors.PURPLE_38134A,
},
icon: {
default: BaseColors.BLUE_2899F5,
okay: BaseColors.GREEN_92C353,
error: BaseColors.RED_F1707B,
warning: BaseColors.YELLOW_FCE100,
information: BaseColors.BLUE_2899F5,
upsell: BaseColors.PURPLE_917EDB,
},
},
primaryButton: {
rest: {
background: BaseColors.BLACK,
text: BaseColors.WHITE,
border: BaseColors.WHITE,
},
hover: {
background: BaseColors.BLUE_00FFFF,
text: BaseColors.BLACK,
},
pressed: {
background: BaseColors.BLUE_00FFFF,
text: BaseColors.GRAY_1B1A19,
},
disabled: {
background: BaseColors.BLACK,
border: BaseColors.GREEN_00FF00,
text: BaseColors.GREEN_00FF00,
},
focus: {
text: BaseColors.WHITE,
},
},
disabledButton: {
background: BaseColors.GRAY_F3F2F1,
text: BaseColors.GRAY_A19F9D,
},
secondaryButton: {
rest: {
background: BaseColors.BLACK,
border: BaseColors.WHITE,
text: BaseColors.WHITE,
},
hover: {
background: BaseColors.BLUE_00FFFF,
border: BaseColors.BLUE_00E8E8,
color: BaseColors.GRAY_1B1A19,
},
pressed: {
text: BaseColors.GRAY_1B1A19,
background: BaseColors.BLUE_00E8E8,
border: BaseColors.BLUE_00E8E8,
},
},
checkBox: {
rest: {
border: BaseColors.GRAY_F3F2F1,
background: BaseColors.BLUE_0078D4,
hover: BaseColors.GRAY_A19F9D,
focus: BaseColors.BLUE_4894FE,
check: BaseColors.WHITE,
},
checked: {
border: BaseColors.BLUE_00FFFF,
background: BaseColors.TRANSPARENT,
default: BaseColors.BLUE_6CB8F6,
hoverBackground: BaseColors.TRANSPARENT,
hoverBorder: BaseColors.PURPLE_800080,
},
disabled: {
border: BaseColors.GREEN_0AFF00,
background: BaseColors.TRANSPARENT,
},
},
controlOutlines: {
rest: BaseColors.WHITE,
background: BaseColors.GRAY_111111,
disabled: BaseColors.GRAY_808080_070,
hover: BaseColors.WHITE,
accent: BaseColors.BLUE_00FFFF,
error: BaseColors.RED_F63747,
dirty: BaseColors.PURPLE_C87FDC,
},
choiceGroup: {
circle: {
hover: BaseColors.BLUE_00FFFF,
},
},
item: {
hover: BaseColors.BLUE_00FFFF,
select: BaseColors.GRAY_808080_025,
selectHovered: BaseColors.GRAY_808080_070,
},
shimmer: {
primary: BaseColors.GRAY_808080,
secondary: BaseColors.GRAY_404040,
},
toggle: {
disabled: {
backrgound: BaseColors.GRAY_484644,
},
},
commandBar: {
border: BaseColors.GRAY_605E5C,
},
datePicker: {
rest: {
selected: BaseColors.BLUE_02FEFF,
text: BaseColors.BLACK,
},
disabled: {
border: BaseColors.GRAY_A19F9D,
},
},
detailsRow: {
border: BaseColors.WHITE,
},
radioButton: {
circle: {
uncheckedRest: BaseColors.WHITE,
checkedDisabled: BaseColors.WHITE,
borderDisabled: BaseColors.GREEN_00FF00,
},
pill: {
disabled: BaseColors.GREEN_00FF00,
uncheckedDisabled: BaseColors.GREEN_00FF00,
checkedHover: BaseColors.BLUE_6CA9FE,
uncheckedHover: BaseColors.BLUE_00FFFF,
},
},
tabs: {
hover: BaseColors.GRAY_252423,
},
teachingBubble: {
rest: {
background: BaseColors.BLUE_00FFFF,
border: BaseColors.BLUE_00FFFF,
text: BaseColors.BLACK,
secondaryBackround: BaseColors.BLACK,
},
hover: {
primaryButtonBackground: BaseColors.BLUE_043862,
},
},
};
exports.LightSemanticColors = {
background: BaseColors.WHITE,
text: {
list: BaseColors.GRAY_302928,
heading: BaseColors.GRAY_302928,
body: BaseColors.GRAY_323130,
bodyHovered: BaseColors.GRAY_201F1E,
value: BaseColors.GRAY_302928,
icon: BaseColors.GRAY_302928,
label: BaseColors.GRAY_323130,
disabled: BaseColors.GRAY_A19F9D,
hyperlink: BaseColors.BLUE_0078D4,
hyperlinkHovered: BaseColors.BLUE_004578,
hyperlinkBackgroundHovered: BaseColors.TRANSPARENT,
success: BaseColors.GREEN_428000,
error: BaseColors.RED_E00B1C,
placeholder: BaseColors.GRAY_8A8886,
},
statusBar: {
link: BaseColors.BLUE_106EBE,
background: {
default: BaseColors.BLUE_F0F6FF,
okay: BaseColors.GREEN_F8FFF0,
error: BaseColors.RED_FEF0F1,
warning: BaseColors.ORANGE_FFF8F0,
information: BaseColors.BLUE_F0F6FF,
upsell: BaseColors.PURPLE_F9F3FC,
},
border: {
default: BaseColors.BLUE_F0F6FF,
okay: BaseColors.GREEN_F8FFF0,
error: BaseColors.RED_FEF0F1,
warning: BaseColors.ORANGE_FFF8F0,
information: BaseColors.BLUE_F0F6FF,
upsell: BaseColors.PURPLE_F9F3FC,
},
icon: {
default: BaseColors.BLUE_015CDA,
okay: BaseColors.GREEN_57A300,
error: BaseColors.RED_E00B1C,
warning: BaseColors.ORANGE_DB7500,
information: BaseColors.BLUE_015CDA,
upsell: BaseColors.PURPLE_8A2DA5,
},
},
primaryButton: {
rest: {
background: BaseColors.BLUE_0078D4,
text: BaseColors.WHITE,
border: BaseColors.BLUE_0078D4,
},
hover: {
background: BaseColors.BLUE_106EBE,
text: BaseColors.WHITE,
},
pressed: {
background: BaseColors.BLUE_005A9E,
text: BaseColors.WHITE,
},
disabled: {
background: BaseColors.GRAY_F3F2F1,
border: BaseColors.GRAY_F3F2F1,
text: BaseColors.GRAY_A19F9D,
},
focus: {
text: BaseColors.WHITE,
},
},
disabledButton: {
background: BaseColors.GRAY_F3F2F1,
text: BaseColors.GRAY_A19F9D,
},
secondaryButton: {
rest: {
text: BaseColors.GRAY_323130,
background: BaseColors.WHITE,
border: BaseColors.GRAY_8A8886,
},
hover: {
background: BaseColors.GRAY_F3F2F1,
border: BaseColors.GRAY_8A8886,
color: BaseColors.GRAY_201F1E,
},
pressed: {
text: BaseColors.GRAY_201F1E,
background: BaseColors.GRAY_EDEBE9,
border: BaseColors.GRAY_8A8886,
},
},
checkBox: {
rest: {
border: BaseColors.GRAY_323130,
background: BaseColors.BLUE_0078D4,
hover: BaseColors.GRAY_605E5C,
focus: BaseColors.BLUE_0078D4,
check: BaseColors.WHITE,
},
checked: {
border: BaseColors.BLUE_0078D4,
background: BaseColors.BLUE_0078D4,
default: BaseColors.BLUE_106EBE,
hoverBackground: BaseColors.BLUE_005A9E,
hoverBorder: BaseColors.BLUE_005A9E,
},
disabled: {
border: BaseColors.GRAY_C8C6C4,
background: BaseColors.GRAY_C8C6C4,
},
},
controlOutlines: {
rest: BaseColors.GRAY_323130,
background: BaseColors.WHITE,
disabled: BaseColors.GRAY_C8C6C4,
hover: BaseColors.GRAY_605E5C,
accent: BaseColors.BLUE_0078D4,
error: BaseColors.RED_E00B1C,
dirty: BaseColors.PURPLE_8A2DA5,
},
choiceGroup: {
circle: {
hover: BaseColors.GRAY_605E5C,
},
},
item: {
hover: BaseColors.GRAY_F3F2F1,
select: BaseColors.GRAY_EDEBE9,
selectHovered: BaseColors.GRAY_E1DFDD,
},
shimmer: {
primary: BaseColors.GRAY_F7F7F7,
secondary: BaseColors.GRAY_DFDFDF,
},
toggle: {
disabled: {
backrgound: BaseColors.WHITE,
},
},
commandBar: {
border: BaseColors.GRAY_CCCCCC,
},
datePicker: {
rest: {
selected: BaseColors.BLUE_0078D4,
text: BaseColors.WHITE,
},
disabled: {
border: BaseColors.GRAY_F3F2F1,
},
},
detailsRow: {
border: BaseColors.GRAY_F3F2F1,
},
radioButton: {
circle: {
uncheckedRest: BaseColors.GRAY_605E5C,
checkedDisabled: BaseColors.GRAY_F3F2F1,
borderDisabled: BaseColors.GRAY_F3F2F1,
},
pill: {
disabled: BaseColors.GRAY_C8C6C4,
uncheckedDisabled: BaseColors.WHITE,
checkedHover: BaseColors.BLUE_005A9E,
uncheckedHover: BaseColors.WHITE,
},
},
tabs: {
hover: BaseColors.GRAY_F3F2F1,
},
teachingBubble: {
rest: {
background: BaseColors.BLUE_0078D4,
border: BaseColors.BLUE_0078D4,
text: BaseColors.WHITE,
secondaryBackround: BaseColors.WHITE,
},
hover: {
primaryButtonBackground: BaseColors.BLUE_DEECF9,
},
},
};
exports.HighContrastLightSemanticColors = {
background: BaseColors.WHITE,
text: {
list: BaseColors.BLUE_0000CD,
heading: BaseColors.BLACK,
body: BaseColors.BLACK,
bodyHovered: BaseColors.BLACK,
value: BaseColors.BLACK,
icon: BaseColors.BLACK,
label: BaseColors.BLACK,
disabled: BaseColors.RED_800000,
hyperlink: BaseColors.BLUE_0000CD,
hyperlinkHovered: BaseColors.WHITE,
hyperlinkBackgroundHovered: BaseColors.PURPLE_800080,
success: BaseColors.GREEN_428000,
error: BaseColors.RED_E00B1C,
placeholder: BaseColors.RED_800000,
},
statusBar: {
link: BaseColors.BLUE_0000CD,
background: {
default: BaseColors.TRANSPARENT,
okay: BaseColors.TRANSPARENT,
error: BaseColors.TRANSPARENT,
warning: BaseColors.TRANSPARENT,
information: BaseColors.TRANSPARENT,
upsell: BaseColors.TRANSPARENT,
},
border: {
default: BaseColors.BLUE_F0F6FF,
okay: BaseColors.GREEN_F8FFF0,
error: BaseColors.RED_FEF0F1,
warning: BaseColors.ORANGE_FFF8F0,
information: BaseColors.BLUE_F0F6FF,
upsell: BaseColors.PURPLE_F9F3FC,
},
icon: {
default: BaseColors.BLUE_015CDA,
okay: BaseColors.GREEN_57A300,
error: BaseColors.RED_E00B1C,
warning: BaseColors.ORANGE_DB7500,
information: BaseColors.BLUE_015CDA,
upsell: BaseColors.PURPLE_8A2DA5,
},
},
primaryButton: {
rest: {
background: BaseColors.WHITE,
text: BaseColors.BLACK,
border: BaseColors.BLACK,
},
hover: {
background: BaseColors.PURPLE_800080,
text: BaseColors.WHITE,
},
pressed: {
background: BaseColors.PURPLE_660166,
text: BaseColors.WHITE,
},
disabled: {
background: BaseColors.GRAY_F3F2F1,
border: BaseColors.RED_800000,
text: BaseColors.RED_800000,
},
focus: {
text: BaseColors.BLACK,
},
},
disabledButton: {
background: BaseColors.WHITE,
text: BaseColors.RED_800000,
},
secondaryButton: {
rest: {
text: BaseColors.BLACK,
background: BaseColors.WHITE,
border: BaseColors.BLACK,
},
hover: {
background: BaseColors.PURPLE_800080,
border: BaseColors.PURPLE_800080,
color: BaseColors.WHITE,
},
pressed: {
text: BaseColors.WHITE,
background: BaseColors.PURPLE_660166,
border: BaseColors.PURPLE_660166,
},
},
checkBox: {
rest: {
border: BaseColors.GRAY_323130,
background: BaseColors.BLUE_0078D4,
hover: BaseColors.GRAY_323130,
focus: BaseColors.GRAY_323130,
check: BaseColors.WHITE,
},
checked: {
border: BaseColors.BLUE_0078D4,
background: BaseColors.BLUE_0078D4,
default: BaseColors.BLUE_106EBE,
hoverBackground: BaseColors.BLUE_005A9E,
hoverBorder: BaseColors.BLUE_005A9E,
},
disabled: {
border: BaseColors.GRAY_C8C6C4,
background: BaseColors.TRANSPARENT,
},
},
controlOutlines: {
rest: BaseColors.BLACK,
background: BaseColors.WHITE,
disabled: BaseColors.GRAY_F3F2F1,
hover: BaseColors.GRAY_605E5C,
accent: BaseColors.PURPLE_800080,
error: BaseColors.RED_E00B1C,
dirty: BaseColors.PURPLE_8A2DA5,
},
choiceGroup: {
circle: {
hover: BaseColors.GRAY_605E5C,
},
},
item: {
hover: BaseColors.PURPLE_800080,
select: BaseColors.GRAY_EDEBE9,
selectHovered: BaseColors.GRAY_E1DFDD,
},
shimmer: {
primary: BaseColors.GRAY_F7F7F7,
secondary: BaseColors.GRAY_DFDFDF,
},
toggle: {
disabled: {
backrgound: BaseColors.WHITE,
},
},
commandBar: {
border: BaseColors.GRAY_CCCCCC,
},
datePicker: {
rest: {
selected: BaseColors.BLUE_0078D4,
text: BaseColors.WHITE,
},
disabled: {
border: BaseColors.GRAY_F3F2F1,
},
},
detailsRow: {
border: BaseColors.BLACK,
},
radioButton: {
circle: {
uncheckedRest: BaseColors.BLACK,
checkedDisabled: BaseColors.BLACK,
borderDisabled: BaseColors.RED_800000,
},
pill: {
disabled: BaseColors.RED_800000,
uncheckedDisabled: BaseColors.RED_800000,
checkedHover: BaseColors.BLUE_0078D4,
uncheckedHover: BaseColors.PURPLE_800080,
},
},
tabs: {
hover: BaseColors.GRAY_F3F2F1,
},
teachingBubble: {
rest: {
background: BaseColors.PURPLE_800080,
border: BaseColors.PURPLE_800080,
text: BaseColors.WHITE,
secondaryBackround: BaseColors.WHITE,
},
hover: {
primaryButtonBackground: BaseColors.BLUE_DEECF9,
},
},
};
/***/ }),
/* 78 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = __webpack_require__(0);
var Styling_1 = __webpack_require__(3);
var Utilities_1 = __webpack_require__(2);
exports.DetailsRowGlobalClassNames = {
root: 'ms-DetailsRow',
// TODO: in Fabric 7.0 lowercase the 'Compact' for consistency across other components.
compact: 'ms-DetailsList--Compact',
cell: 'ms-DetailsRow-cell',
cellAnimation: 'ms-DetailsRow-cellAnimation',
cellCheck: 'ms-DetailsRow-cellCheck',
check: 'ms-DetailsRow-check',
cellMeasurer: 'ms-DetailsRow-cellMeasurer',
listCellFirstChild: 'ms-List-cell:first-child',
isContentUnselectable: 'is-contentUnselectable',
isSelected: 'is-selected',
isCheckVisible: 'is-check-visible',
isRowHeader: 'is-row-header',
fields: 'ms-DetailsRow-fields',
};
var IsFocusableSelector = "[data-is-focusable='true']";
exports.DEFAULT_CELL_STYLE_PROPS = {
cellLeftPadding: 12,
cellRightPadding: 8,
cellExtraRightPadding: 24,
};
// Source of default row heights to share.
exports.DEFAULT_ROW_HEIGHTS = {
rowHeight: 42,
compactRowHeight: 32,
};
// Constant values
var values = tslib_1.__assign(tslib_1.__assign({}, exports.DEFAULT_ROW_HEIGHTS), { rowVerticalPadding: 11, compactRowVerticalPadding: 6 });
exports.getDetailsRowStyles = function (props) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
var theme = props.theme, isSelected = props.isSelected, canSelect = props.canSelect, droppingClassName = props.droppingClassName, anySelected = props.anySelected, isCheckVisible = props.isCheckVisible, checkboxCellClassName = props.checkboxCellClassName, compact = props.compact, className = props.className, _o = props.cellStyleProps, cellStyleProps = _o === void 0 ? exports.DEFAULT_CELL_STYLE_PROPS : _o, enableUpdateAnimations = props.enableUpdateAnimations;
var palette = theme.palette, fonts = theme.fonts;
var neutralPrimary = palette.neutralPrimary, white = palette.white, neutralSecondary = palette.neutralSecondary, neutralLighter = palette.neutralLighter, neutralLight = palette.neutralLight, neutralDark = palette.neutralDark, neutralQuaternaryAlt = palette.neutralQuaternaryAlt;
var focusBorder = theme.semanticColors.focusBorder;
var classNames = Styling_1.getGlobalClassNames(exports.DetailsRowGlobalClassNames, theme);
var colors = {
// Default
defaultHeaderText: neutralPrimary,
defaultMetaText: neutralSecondary,
defaultBackground: white,
// Default Hover
defaultHoverHeaderText: neutralDark,
defaultHoverMetaText: neutralPrimary,
defaultHoverBackground: neutralLighter,
// Selected
selectedHeaderText: neutralDark,
selectedMetaText: neutralPrimary,
selectedBackground: neutralLight,
// Selected Hover
selectedHoverHeaderText: neutralDark,
selectedHoverMetaText: neutralPrimary,
selectedHoverBackground: neutralQuaternaryAlt,
// Focus
focusHeaderText: neutralDark,
focusMetaText: neutralPrimary,
focusBackground: neutralLight,
focusHoverBackground: neutralQuaternaryAlt,
};
// Selected row styles
var selectedStyles = [
Styling_1.getFocusStyle(theme, { inset: -1, borderColor: focusBorder, outlineColor: white }),
classNames.isSelected,
{
color: colors.selectedMetaText,
background: colors.selectedBackground,
borderBottom: "1px solid " + white,
selectors: (_a = {
'&:before': {
position: 'absolute',
display: 'block',
top: -1,
height: 1,
bottom: 0,
left: 0,
right: 0,
content: '',
borderTop: "1px solid " + white,
},
// Selected State hover
'&:hover': {
background: colors.selectedHoverBackground,
color: colors.selectedHoverMetaText,
selectors: (_b = {},
// Selected State hover meta cell
_b["." + classNames.cell + " " + Styling_1.HighContrastSelector] = {