export { buttonStyles , initializeIcons , linkStyles , settingsButtonStyles , spinButtonStyles , templateTypeIconStyles , templateTypeIconOptionStyles , theme } ; import { IButtonStyles } from '@fluentui/react/lib/Button' ; import { ILinkStyles } from '@fluentui/react/lib/Link' ; import { ISpinButtonStyles } from '@fluentui/react/lib/SpinButton' ; import { FontWeights , IIconOptions , IIconSubset , registerIcons } from '@fluentui/react/lib/Styling' ; import { IPartialTheme } from '@fluentui/react/lib/Theme' ; import { getConfig , getIcons } from '../utils/config' ; /**
 * Initialise packaged Fluent UI icons rather than loading from CDN (default behaviour).
 * Icons are updated via the `update-fabric-icons` NPM script and driven via the IDs in `/config/fabric-icons.json`
 */ const initializeIcons = ( baseUrl = '' , options ? ) : void => { const subset = { style : { MozOsxFontSmoothing : 'grayscale' , WebkitFontSmoothing : 'antialiased' , fontStyle : 'normal' , fontWeight : 'normal' , speak : 'none' } , fontFace : { fontFamily : `"FabricMDL2Icons"` } , icons : getIcons ( ) } ; registerIcons ( subset , options ) ; } ; /**
 * The Fluent UI theme, as from the visual configuration.
 */ const theme = < IPartialTheme > getConfig ( ) ?. fluentUiTheme || { } ; /**
 * General styling for buttons within the UI.
 */ const buttonStyles = { root : { borderRadius : 0 } , label : { color : theme . palette . black , fontWeight : FontWeights . regular } } ; const settingsButtonStyles = { root : { backgroundColor : theme . palette . neutralLighterAlt } , rootDisabled : { backgroundColor : theme . palette . neutralLighterAlt } , icon : { color : theme . palette . neutralPrimary } , iconHovered : { color : theme . palette . neutralDark } , iconPressed : { color : theme . palette . neutralDark } , iconChecked : { color : theme . palette . neutralDark } } ; const linkStyles = { root : { color : theme . palette . themeDark } } ; const spinButtonStyles = { spinButtonWrapper : { width : 50 } } ; const templateTypeIconStyles = { icon : { color : theme . palette . neutralPrimary } , iconHovered : { color : theme . palette . neutralDark } , iconPressed : { color : theme . palette . neutralDark } } ; const templateTypeIconOptionStyles = { ... templateTypeIconStyles , ... { root : { marginRight : '8px' , cursor : 'pointer' } } } ;