| 1 | {"version":3,"file":"ActivityItem.styles.js","sourceRoot":"../src/","sources":["components/ActivityItem/ActivityItem.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n concatStyleSets,\n getTheme,\n HighContrastSelector,\n keyframes,\n PulsingBeaconAnimationStyles,\n} from '../../Styling';\nimport { memoizeFunction } from '../../Utilities';\nimport type { ITheme } from '../../Styling';\nimport type { IActivityItemStyles, IActivityItemProps } from './ActivityItem.types';\n\nconst DEFAULT_PERSONA_SIZE = '32px';\nconst COMPACT_PERSONA_SIZE = '16px';\nconst DEFAULT_ICON_SIZE = '16px';\nconst COMPACT_ICON_SIZE = '13px';\nconst ANIMATION_INNER_DIMENSION = '4px';\nconst ANIMATION_OUTER_DIMENSION = '28px';\nconst ANIMATION_BORDER_WIDTH = '4px';\n\nconst fadeIn = memoizeFunction(() =>\n keyframes({\n from: { opacity: 0 },\n to: { opacity: 1 },\n }),\n);\n\nconst slideIn = memoizeFunction(() =>\n keyframes({\n from: { transform: 'translateX(-10px)' },\n to: { transform: 'translateX(0)' },\n }),\n);\n\nexport const getStyles = memoizeFunction(\n (\n theme: ITheme = getTheme(),\n customStyles?: IActivityItemStyles,\n animateBeaconSignal?: IActivityItemProps['animateBeaconSignal'],\n beaconColorOne?: IActivityItemProps['beaconColorOne'],\n beaconColorTwo?: IActivityItemProps['beaconColorTwo'],\n isCompact?: IActivityItemProps['isCompact'],\n ): IActivityItemStyles => {\n const continuousPulse = PulsingBeaconAnimationStyles.continuousPulseAnimationSingle(\n beaconColorOne ? beaconColorOne : theme.palette.themePrimary,\n beaconColorTwo ? beaconColorTwo : theme.palette.themeTertiary,\n ANIMATION_INNER_DIMENSION,\n ANIMATION_OUTER_DIMENSION,\n ANIMATION_BORDER_WIDTH,\n );\n\n const continuousPulseAnimation = {\n animationName: continuousPulse,\n animationIterationCount: '1',\n animationDuration: '.8s',\n zIndex: 1,\n };\n\n const slideInAnimation = {\n animationName: slideIn(),\n animationIterationCount: '1',\n animationDuration: '.5s',\n };\n\n const fadeInAnimation = {\n animationName: fadeIn(),\n animationIterationCount: '1',\n animationDuration: '.5s',\n };\n\n const ActivityItemStyles: IActivityItemStyles = {\n root: [\n theme.fonts.small,\n {\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'flex-start',\n boxSizing: 'border-box',\n color: theme.palette.neutralSecondary,\n },\n isCompact && animateBeaconSignal && fadeInAnimation,\n ],\n\n pulsingBeacon: [\n {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '0px',\n height: '0px',\n borderRadius: '225px',\n borderStyle: 'solid',\n opacity: 0,\n },\n isCompact && animateBeaconSignal && continuousPulseAnimation,\n ],\n\n isCompactRoot: {\n alignItems: 'center',\n },\n\n personaContainer: {\n display: 'flex',\n flexWrap: 'wrap',\n minWidth: DEFAULT_PERSONA_SIZE,\n width: DEFAULT_PERSONA_SIZE,\n height: DEFAULT_PERSONA_SIZE,\n },\n\n isCompactPersonaContainer: {\n display: 'inline-flex',\n flexWrap: 'nowrap',\n flexBasis: 'auto',\n height: COMPACT_PERSONA_SIZE,\n width: 'auto',\n minWidth: '0',\n paddingRight: '6px',\n },\n\n activityTypeIcon: {\n height: DEFAULT_PERSONA_SIZE,\n fontSize: DEFAULT_ICON_SIZE,\n lineHeight: DEFAULT_ICON_SIZE,\n marginTop: '3px',\n },\n\n isCompactIcon: {\n height: COMPACT_PERSONA_SIZE,\n minWidth: COMPACT_PERSONA_SIZE,\n fontSize: COMPACT_ICON_SIZE,\n lineHeight: COMPACT_ICON_SIZE,\n color: theme.palette.themePrimary,\n marginTop: '1px',\n position: 'relative',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n selectors: {\n '.ms-Persona-imageArea': {\n margin: '-2px 0 0 -2px',\n border: '2px solid' + theme.palette.white,\n borderRadius: '50%',\n selectors: {\n [HighContrastSelector]: {\n border: 'none',\n margin: '0',\n },\n },\n },\n },\n },\n\n activityPersona: {\n display: 'block',\n },\n\n doublePersona: {\n selectors: {\n ':first-child': {\n alignSelf: 'flex-end',\n },\n },\n },\n\n isCompactPersona: {\n display: 'inline-block',\n width: '8px',\n minWidth: '8px',\n overflow: 'visible',\n },\n\n activityContent: [\n {\n padding: '0 8px',\n },\n isCompact && animateBeaconSignal && slideInAnimation,\n ],\n\n activityText: {\n display: 'inline',\n },\n\n isCompactContent: {\n flex: '1',\n padding: '0 4px',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n overflowX: 'hidden',\n },\n\n commentText: {\n color: theme.palette.neutralPrimary,\n },\n\n timeStamp: [\n theme.fonts.tiny,\n {\n fontWeight: 400,\n color: theme.palette.neutralSecondary,\n },\n ],\n\n isCompactTimeStamp: {\n display: 'inline-block',\n paddingLeft: '0.3em', // One space character\n fontSize: '1em',\n },\n };\n\n return concatStyleSets(ActivityItemStyles, customStyles);\n },\n);\n"]} |