import { getFocusStyle , getTheme , IChoiceGroupStyles , IChoiceGroupOptionStyles , IStackItemStyles , IStackStyles , IStackTokens , ITheme , mergeStyleSets , FontSizes } from '@fluentui/react' ; import { theme } from '../../core/ui/fluent' ; export { choiceGroupStyles , choiceItemStyles , templateExportInfoStackTokens , templatePickerItemListStyles , templatePickerStackStyles , templatePickerStackItemStyles , templatePickerStackSeparatorStyles , templatePickerStackItemListStyles , templatePickerNonShrinkingStackItemStyles , templatePickerStackTokens } ; const defaultTheme = getTheme ( ) ; const choiceGroupStyles = { flexContainer : { display : 'flex' , flexWrap : 'wrap' } } , choiceItemStyles = { root : { paddingRight : '16px' } } ; const templatePickerItemListStyles = mergeStyleSets ( { itemCell : [ getFocusStyle ( defaultTheme , { inset : - 1 } ) , { minHeight : 34 , padding : 10 , boxSizing : 'border-box' , borderBottom : `1px solid ${ theme . palette . neutralLighterAlt }` , display : 'flex' , selectors : { '&:hover' : { background : theme . palette . neutralLight } , '&:focus' : { background : theme . palette . neutralLighterAlt } , '&[tabindex="0"]' : { background : theme . palette . neutralLighterAlt } } } ] , itemImage : { flexShrink : 0 } , itemContent : { overflow : 'hidden' , flexGrow : 1 , fontSize : FontSizes . smallPlus } , itemName : [ { fontSize : FontSizes . medium , whiteSpace : 'nowrap' , overflow : 'hidden' , textOverflow : 'ellipsis' } ] , itemIndex : { fontSize : FontSizes . small , color : theme . palette . neutralTertiary , marginBottom : 10 } , chevron : { alignSelf : 'center' , marginLeft : 10 , color : theme . palette . neutralTertiary , fontSize : FontSizes . large , flexShrink : 0 } } ) , templatePickerStackStyles = { root : { width : '100%' , height : '100%' , maxHeight : '100%' , maxWidth : '100%' } } , templatePickerStackItemStyles = { root : { display : 'flex' , maxHeight : '100%' } } , templatePickerStackSeparatorStyles = { ... templatePickerStackItemStyles , ... { root : { width : 15 } } } , templatePickerStackItemListStyles = { ... templatePickerStackItemStyles , ... { root : { overflowY : 'auto' , width : 250 , maxWidth : 250 } } } , templatePickerNonShrinkingStackItemStyles = { ... templatePickerStackStyles , ... { root : { overflowY : 'auto' } } } , templatePickerStackTokens = { childrenGap : 25 } , templateExportInfoStackTokens = { childrenGap : 5 } ;