useMessageBarStyles_unstable (MessageBar/useMessageBarStyles.styles.ts)

fluentui · packages/react-components/react-message-bar/library/src/components/MessageBar/useMessageBarStyles.styles.ts · typescript · MIT
ui

Hook applying styles to MessageBar slots based on state and intent.

// Source: https://github.com/microsoft/fluentui | License: MIT | Copyright Microsoft Corporation
// Provided via justclaw.it.com; keep this notice with the code.
'use client';

import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';
import { tokens } from '@fluentui/react-theme';
import type { SlotClassNames } from '@fluentui/react-utilities';
import type { MessageBarSlots, MessageBarState } from './MessageBar.types';

export const messageBarClassNames: SlotClassNames<MessageBarSlots> = {
  root: 'fui-MessageBar',
  icon: 'fui-MessageBar__icon',
  bottomReflowSpacer: 'fui-MessageBar__bottomReflowSpacer',
};

const useRootBaseStyles = makeResetStyles({
  whiteSpace: 'nowrap',
  display: 'grid',
  gridTemplateColumns: 'auto 1fr auto auto',
  gridTemplateRows:

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search for more like it.

Get a free API key