@uifabric/experiments
Version:
Experimental React components for building experiences for Microsoft 365.
75 lines • 3.09 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
// Temporary import file to experiment with next version of foundation.
var composed_1 = require("@uifabric/foundation/lib-commonjs/next/composed");
var Button_state_1 = require("../Button.state");
var Button_styles_1 = require("../Button.styles");
var Button_view_1 = require("../Button.view");
/* eslint-disable deprecation/deprecation */
var baseTokens = function (props, theme) {
var palette = theme.palette, semanticColors = theme.semanticColors;
return {
backgroundColor: palette.white,
backgroundColorHovered: palette.neutralLighter,
backgroundColorPressed: semanticColors.buttonBackgroundPressed,
borderRadius: 0,
borderWidth: 0,
childrenGap: 8,
contentPadding: '0px 8px',
color: semanticColors.buttonText,
colorHovered: semanticColors.buttonTextHovered,
colorPressed: semanticColors.buttonTextPressed,
cursor: 'pointer',
highContrastBorderColor: 'transparent',
highContrastBorderColorHovered: 'transparent',
highContrastBorderColorPressed: 'transparent',
highContrastColorHovered: 'Highlight',
highContrastColorPressed: 'Highlight',
highContrastIconColorHovered: 'Highlight',
highContrastIconColorPressed: 'Highlight',
iconColor: semanticColors.buttonText,
iconColorHovered: palette.themeDarkAlt,
iconColorPressed: palette.themeDark,
minHeight: 0,
minWidth: 40,
textWeight: 'normal',
};
};
var disabledTokens = function (props, theme) {
var palette = theme.palette, semanticColors = theme.semanticColors;
return {
backgroundColor: palette.white,
backgroundColorHovered: palette.white,
backgroundColorPressed: palette.white,
color: semanticColors.buttonTextDisabled,
colorHovered: semanticColors.buttonTextDisabled,
colorPressed: semanticColors.buttonTextDisabled,
cursor: 'default',
highContrastColor: 'GrayText',
highContrastColorHovered: 'GrayText',
highContrastColorPressed: 'GrayText',
highContrastIconColor: 'GrayText',
highContrastIconColorHovered: 'GrayText',
highContrastIconColorPressed: 'GrayText',
iconColor: semanticColors.disabledBodySubtext,
iconColorHovered: semanticColors.disabledBodySubtext,
iconColorPressed: semanticColors.disabledBodySubtext,
};
};
var CommandBarButtonTokens = function (props, theme) { return [
baseTokens,
props.disabled && disabledTokens,
]; };
/**
* @deprecated This component was experimental and is not longer being developed on, nor will it be supported in the
* future.
*/
exports.CommandBarButton = composed_1.composed({
displayName: 'CommandBarButton',
slots: Button_view_1.ButtonSlots,
state: Button_state_1.useButtonState,
styles: Button_styles_1.ButtonStyles,
tokens: CommandBarButtonTokens,
view: Button_view_1.ButtonView,
});
//# sourceMappingURL=CommandBarButton.js.map