@fluentui/react-virtualizer 9.0.0-alpha.7 → 9.0.0-alpha.71

package/lib/components/Virtualizer/useVirtualizerStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"mappings":"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","names":["mergeClasses","virtualizerClassName","virtualizerClassNames","before","beforeContainer","after","afterContainer","useStyles","useVirtualizerStyles_unstable","state","styles","reversed","axis","beforeBufferHeight","afterBufferHeight","bufferSize","horizontal","className","base","relative","vertical","beforeHeightPx","afterHeightPx","beforeBufferHeightPx","afterBufferHeightPx","bufferPx","beforeBuffer","marginBottom","marginTop","marginLeft","marginRight","afterBuffer","style","height","width"],"sourceRoot":"../src/","sources":["packages/react-components/react-virtualizer/src/components/Virtualizer/useVirtualizerStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { VirtualizerSlots, VirtualizerState } from './Virtualizer.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nconst virtualizerClassName = 'fui-Virtualizer';\nexport const virtualizerClassNames: SlotClassNames<VirtualizerSlots> = {\n  before: `${virtualizerClassName}__before`,\n  beforeContainer: `${virtualizerClassName}__beforeContainer`,\n  after: `${virtualizerClassName}__after`,\n  afterContainer: `${virtualizerClassName}__afterContainer`,\n};\n\nconst useStyles = makeStyles({\n  base: {\n    display: 'block',\n    pointerEvents: 'none',\n  },\n  relative: {\n    position: 'relative',\n  },\n  horizontal: {\n    minHeight: '100%',\n  },\n  vertical: {\n    minWidth: '100%',\n  },\n});\n\n/**\n * Apply styling to the Virtualizer states\n */\nexport const useVirtualizerStyles_unstable = (state: VirtualizerState): VirtualizerState => {\n  const styles = useStyles();\n  const { reversed, axis, beforeBufferHeight, afterBufferHeight, bufferSize } = state;\n  const horizontal = axis === 'horizontal';\n\n  state.before.className = mergeClasses(\n    virtualizerClassNames.before,\n    styles.base,\n    styles.relative,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.before.className,\n  );\n\n  state.after.className = mergeClasses(\n    virtualizerClassNames.after,\n    styles.base,\n    styles.relative,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.after.className,\n  );\n\n  state.beforeContainer.className = mergeClasses(\n    virtualizerClassNames.beforeContainer,\n    styles.base,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.beforeContainer.className,\n  );\n\n  state.afterContainer.className = mergeClasses(\n    virtualizerClassNames.afterContainer,\n    styles.base,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.afterContainer.className,\n  );\n\n  const beforeHeightPx = beforeBufferHeight + 'px';\n  const afterHeightPx = afterBufferHeight + 'px';\n  const beforeBufferHeightPx = beforeBufferHeight + bufferSize + 'px';\n  const afterBufferHeightPx = afterBufferHeight + bufferSize + 'px';\n  const bufferPx = bufferSize + 'px';\n\n  const beforeBuffer = {\n    // Column\n    ...(!reversed && !horizontal && { marginBottom: `-${bufferPx}` }),\n    // Column-Reverse\n    ...(reversed && !horizontal && { marginTop: `-${bufferPx}` }),\n    // Row\n    ...(!reversed && horizontal && { marginLeft: `-${bufferPx}` }),\n    // Row-Reverse\n    ...(reversed && horizontal && { marginRight: `-${bufferPx}` }),\n  };\n\n  const afterBuffer = {\n    // Column\n    ...(!reversed && !horizontal && { marginTop: `-${bufferPx}` }),\n    // Column-Reverse\n    ...(reversed && !horizontal && { marginBottom: `-${bufferPx}` }),\n    // Row\n    ...(!reversed && horizontal && { marginLeft: `-${bufferPx}` }),\n    // Row-Reverse\n    ...(reversed && horizontal && { marginRight: `-${bufferPx}` }),\n  };\n\n  state.before.style = {\n    height: horizontal ? '100%' : beforeBufferHeightPx,\n    width: horizontal ? beforeBufferHeightPx : '100%',\n    ...beforeBuffer,\n    ...state.before.style,\n  };\n\n  state.beforeContainer.style = {\n    height: horizontal ? 'auto' : beforeHeightPx,\n    width: horizontal ? beforeHeightPx : 'auto',\n    ...state.beforeContainer.style,\n  };\n\n  state.after.style = {\n    height: horizontal ? '100%' : afterBufferHeightPx,\n    width: horizontal ? afterBufferHeightPx : '100%',\n    ...afterBuffer,\n    ...state.after.style,\n  };\n\n  state.afterContainer.style = {\n    height: horizontal ? 'auto' : afterHeightPx,\n    width: horizontal ? afterHeightPx : 'auto',\n    ...state.afterContainer.style,\n  };\n\n  return state;\n};\n"]}

package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.js

@@ -1,115 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useVirtualizerStyles_unstable = exports.virtualizerClassNames = void 0;
-const react_1 = /*#__PURE__*/require("@griffel/react");
-const virtualizerClassName = 'fui-Virtualizer';
-exports.virtualizerClassNames = {
-  before: `${virtualizerClassName}__before`,
-  beforeContainer: `${virtualizerClassName}__beforeContainer`,
-  after: `${virtualizerClassName}__after`,
-  afterContainer: `${virtualizerClassName}__afterContainer`
-};
-const useStyles = /*#__PURE__*/react_1.__styles({
-  base: {
-    mc9l5x: "ftgm304",
-    Bkecrkj: "f1aehjj5"
-  },
-  relative: {
-    qhf8xq: "f10pi13n"
-  },
-  horizontal: {
-    sshi5w: "fan4evk"
-  },
-  vertical: {
-    Bf4jedk: "f11qra4b"
-  }
-}, {
-  d: [".ftgm304{display:block;}", ".f1aehjj5{pointer-events:none;}", ".f10pi13n{position:relative;}", ".fan4evk{min-height:100%;}", ".f11qra4b{min-width:100%;}"]
-});
-/**
- * Apply styling to the Virtualizer states
- */
-const useVirtualizerStyles_unstable = state => {
-  const styles = useStyles();
-  const {
-    reversed,
-    axis,
-    beforeBufferHeight,
-    afterBufferHeight,
-    bufferSize
-  } = state;
-  const horizontal = axis === 'horizontal';
-  state.before.className = react_1.mergeClasses(exports.virtualizerClassNames.before, styles.base, styles.relative, horizontal ? styles.horizontal : styles.vertical, state.before.className);
-  state.after.className = react_1.mergeClasses(exports.virtualizerClassNames.after, styles.base, styles.relative, horizontal ? styles.horizontal : styles.vertical, state.after.className);
-  state.beforeContainer.className = react_1.mergeClasses(exports.virtualizerClassNames.beforeContainer, styles.base, horizontal ? styles.horizontal : styles.vertical, state.beforeContainer.className);
-  state.afterContainer.className = react_1.mergeClasses(exports.virtualizerClassNames.afterContainer, styles.base, horizontal ? styles.horizontal : styles.vertical, state.afterContainer.className);
-  const beforeHeightPx = beforeBufferHeight + 'px';
-  const afterHeightPx = afterBufferHeight + 'px';
-  const beforeBufferHeightPx = beforeBufferHeight + bufferSize + 'px';
-  const afterBufferHeightPx = afterBufferHeight + bufferSize + 'px';
-  const bufferPx = bufferSize + 'px';
-  const beforeBuffer = {
-    // Column
-    ...(!reversed && !horizontal && {
-      marginBottom: `-${bufferPx}`
-    }),
-    // Column-Reverse
-    ...(reversed && !horizontal && {
-      marginTop: `-${bufferPx}`
-    }),
-    // Row
-    ...(!reversed && horizontal && {
-      marginLeft: `-${bufferPx}`
-    }),
-    // Row-Reverse
-    ...(reversed && horizontal && {
-      marginRight: `-${bufferPx}`
-    })
-  };
-  const afterBuffer = {
-    // Column
-    ...(!reversed && !horizontal && {
-      marginTop: `-${bufferPx}`
-    }),
-    // Column-Reverse
-    ...(reversed && !horizontal && {
-      marginBottom: `-${bufferPx}`
-    }),
-    // Row
-    ...(!reversed && horizontal && {
-      marginLeft: `-${bufferPx}`
-    }),
-    // Row-Reverse
-    ...(reversed && horizontal && {
-      marginRight: `-${bufferPx}`
-    })
-  };
-  state.before.style = {
-    height: horizontal ? '100%' : beforeBufferHeightPx,
-    width: horizontal ? beforeBufferHeightPx : '100%',
-    ...beforeBuffer,
-    ...state.before.style
-  };
-  state.beforeContainer.style = {
-    height: horizontal ? 'auto' : beforeHeightPx,
-    width: horizontal ? beforeHeightPx : 'auto',
-    ...state.beforeContainer.style
-  };
-  state.after.style = {
-    height: horizontal ? '100%' : afterBufferHeightPx,
-    width: horizontal ? afterBufferHeightPx : '100%',
-    ...afterBuffer,
-    ...state.after.style
-  };
-  state.afterContainer.style = {
-    height: horizontal ? 'auto' : afterHeightPx,
-    width: horizontal ? afterHeightPx : 'auto',
-    ...state.afterContainer.style
-  };
-  return state;
-};
-exports.useVirtualizerStyles_unstable = useVirtualizerStyles_unstable;
-//# sourceMappingURL=useVirtualizerStyles.js.map

package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"mappings":"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","names":["virtualizerClassName","exports","before","beforeContainer","after","afterContainer","useStyles","react_1","useVirtualizerStyles_unstable","state","styles","reversed","axis","beforeBufferHeight","afterBufferHeight","bufferSize","horizontal","className","base","relative","vertical","beforeHeightPx","afterHeightPx","beforeBufferHeightPx","afterBufferHeightPx","bufferPx","beforeBuffer","marginBottom","marginTop","marginLeft","marginRight","afterBuffer","style","height","width"],"sourceRoot":"../src/","sources":["packages/react-components/react-virtualizer/src/components/Virtualizer/useVirtualizerStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { VirtualizerSlots, VirtualizerState } from './Virtualizer.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nconst virtualizerClassName = 'fui-Virtualizer';\nexport const virtualizerClassNames: SlotClassNames<VirtualizerSlots> = {\n  before: `${virtualizerClassName}__before`,\n  beforeContainer: `${virtualizerClassName}__beforeContainer`,\n  after: `${virtualizerClassName}__after`,\n  afterContainer: `${virtualizerClassName}__afterContainer`,\n};\n\nconst useStyles = makeStyles({\n  base: {\n    display: 'block',\n    pointerEvents: 'none',\n  },\n  relative: {\n    position: 'relative',\n  },\n  horizontal: {\n    minHeight: '100%',\n  },\n  vertical: {\n    minWidth: '100%',\n  },\n});\n\n/**\n * Apply styling to the Virtualizer states\n */\nexport const useVirtualizerStyles_unstable = (state: VirtualizerState): VirtualizerState => {\n  const styles = useStyles();\n  const { reversed, axis, beforeBufferHeight, afterBufferHeight, bufferSize } = state;\n  const horizontal = axis === 'horizontal';\n\n  state.before.className = mergeClasses(\n    virtualizerClassNames.before,\n    styles.base,\n    styles.relative,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.before.className,\n  );\n\n  state.after.className = mergeClasses(\n    virtualizerClassNames.after,\n    styles.base,\n    styles.relative,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.after.className,\n  );\n\n  state.beforeContainer.className = mergeClasses(\n    virtualizerClassNames.beforeContainer,\n    styles.base,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.beforeContainer.className,\n  );\n\n  state.afterContainer.className = mergeClasses(\n    virtualizerClassNames.afterContainer,\n    styles.base,\n    horizontal ? styles.horizontal : styles.vertical,\n    state.afterContainer.className,\n  );\n\n  const beforeHeightPx = beforeBufferHeight + 'px';\n  const afterHeightPx = afterBufferHeight + 'px';\n  const beforeBufferHeightPx = beforeBufferHeight + bufferSize + 'px';\n  const afterBufferHeightPx = afterBufferHeight + bufferSize + 'px';\n  const bufferPx = bufferSize + 'px';\n\n  const beforeBuffer = {\n    // Column\n    ...(!reversed && !horizontal && { marginBottom: `-${bufferPx}` }),\n    // Column-Reverse\n    ...(reversed && !horizontal && { marginTop: `-${bufferPx}` }),\n    // Row\n    ...(!reversed && horizontal && { marginLeft: `-${bufferPx}` }),\n    // Row-Reverse\n    ...(reversed && horizontal && { marginRight: `-${bufferPx}` }),\n  };\n\n  const afterBuffer = {\n    // Column\n    ...(!reversed && !horizontal && { marginTop: `-${bufferPx}` }),\n    // Column-Reverse\n    ...(reversed && !horizontal && { marginBottom: `-${bufferPx}` }),\n    // Row\n    ...(!reversed && horizontal && { marginLeft: `-${bufferPx}` }),\n    // Row-Reverse\n    ...(reversed && horizontal && { marginRight: `-${bufferPx}` }),\n  };\n\n  state.before.style = {\n    height: horizontal ? '100%' : beforeBufferHeightPx,\n    width: horizontal ? beforeBufferHeightPx : '100%',\n    ...beforeBuffer,\n    ...state.before.style,\n  };\n\n  state.beforeContainer.style = {\n    height: horizontal ? 'auto' : beforeHeightPx,\n    width: horizontal ? beforeHeightPx : 'auto',\n    ...state.beforeContainer.style,\n  };\n\n  state.after.style = {\n    height: horizontal ? '100%' : afterBufferHeightPx,\n    width: horizontal ? afterBufferHeightPx : '100%',\n    ...afterBuffer,\n    ...state.after.style,\n  };\n\n  state.afterContainer.style = {\n    height: horizontal ? 'auto' : afterHeightPx,\n    width: horizontal ? afterHeightPx : 'auto',\n    ...state.afterContainer.style,\n  };\n\n  return state;\n};\n"]}