| 1 | {"version":3,"file":"ScrollablePane.styles.js","sourceRoot":"../src/","sources":["components/ScrollablePane/ScrollablePane.styles.ts"],"names":[],"mappings":";;;AAAA,yCAA0E;AAI1E,IAAM,gBAAgB,GAAG;IACvB,IAAI,EAAE,mBAAmB;IACzB,gBAAgB,EAAE,qCAAqC;CACxD,CAAC;AAEK,IAAM,SAAS,GAAG,UAAC,KAAgC;;IAChD,IAAA,SAAS,GAAY,KAAK,UAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;IAEnC,IAAM,UAAU,GAAG,6BAAmB,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;IAEhE,IAAM,mBAAmB,GAAW;QAClC,QAAQ,EAAE,UAAU;QACpB,aAAa,EAAE,MAAM;KACtB,CAAC;IAEF,IAAM,gBAAgB,GAAW;QAC/B,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,CAAC;QACT,IAAI,EAAE,CAAC;QACP,uBAAuB,EAAE,OAAO;KACjC,CAAC;IAEF,OAAO;QACL,IAAI,EAAE,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,gBAAgB,EAAE,SAAS,CAAC;QACxE,gBAAgB,EAAE;YAChB,UAAU,CAAC,gBAAgB;YAC3B;gBACE,SAAS,EAAE,KAAK,CAAC,mBAAmB,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM;aACtE;YACD,gBAAgB;SACjB;QACD,WAAW,EAAE;YACX;gBACE,GAAG,EAAE,CAAC;gBACN,MAAM,EAAE,CAAC;gBACT,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,YAAY,EAAE,sBAAsB;qBACrC;uBACF;aACF;YACD,mBAAmB;SACpB;QACD,WAAW,EAAE;YACX;gBACE,MAAM,EAAE,CAAC;gBACT,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,SAAS,EAAE,sBAAsB;qBAClC;uBACF;aACF;YACD,mBAAmB;SACpB;QACD,gBAAgB,EAAE;YAChB;gBACE,MAAM,EAAE,CAAC;aACV;YACD,mBAAmB;YACnB;gBACE,KAAK,EAAE,MAAM;aACd;SACF;KACF,CAAC;AACJ,CAAC,CAAC;AA7DW,QAAA,SAAS,aA6DpB","sourcesContent":["import { HighContrastSelector, getGlobalClassNames } from '../../Styling';\nimport type { IScrollablePaneStyleProps, IScrollablePaneStyles } from './ScrollablePane.types';\nimport type { IStyle } from '../../Styling';\n\nconst GlobalClassNames = {\n root: 'ms-ScrollablePane',\n contentContainer: 'ms-ScrollablePane--contentContainer',\n};\n\nexport const getStyles = (props: IScrollablePaneStyleProps): IScrollablePaneStyles => {\n const { className, theme } = props;\n\n const classNames = getGlobalClassNames(GlobalClassNames, theme);\n\n const AboveAndBelowStyles: IStyle = {\n position: 'absolute',\n pointerEvents: 'none',\n };\n\n const positioningStyle: IStyle = {\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n WebkitOverflowScrolling: 'touch',\n };\n\n return {\n root: [classNames.root, theme.fonts.medium, positioningStyle, className],\n contentContainer: [\n classNames.contentContainer,\n {\n overflowY: props.scrollbarVisibility === 'always' ? 'scroll' : 'auto',\n },\n positioningStyle,\n ],\n stickyAbove: [\n {\n top: 0,\n zIndex: 1,\n selectors: {\n [HighContrastSelector]: {\n borderBottom: '1px solid WindowText',\n },\n },\n },\n AboveAndBelowStyles,\n ],\n stickyBelow: [\n {\n bottom: 0,\n selectors: {\n [HighContrastSelector]: {\n borderTop: '1px solid WindowText',\n },\n },\n },\n AboveAndBelowStyles,\n ],\n stickyBelowItems: [\n {\n bottom: 0,\n },\n AboveAndBelowStyles,\n {\n width: '100%',\n },\n ],\n };\n};\n"]} |