@fluentui/react-positioning 9.0.0-alpha.9 → 9.0.0-beta.4

package/lib-commonjs/utils/mergeArrowOffset.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/mergeArrowOffset.ts"],"names":[],"mappings":";;;;;;AAEA;;;;;;;AAOG;;AACH,SAAgB,gBAAhB,CAAiC,UAAjC,EAAwE,WAAxE,EAA2F;AACzF,MAAI,eAAe,GAAG,UAAtB;;AACA,MAAI,CAAC,UAAL,EAAiB;AACf,WAAO,CAAC,CAAD,EAAI,WAAJ,CAAP;AACD;;AAED,MAAI,KAAK,CAAC,OAAN,CAAc,eAAd,CAAJ,EAAoC;AAClC,IAAA,cAAc,CAAC,eAAD,EAAkB,WAAlB,CAAd;AACA,WAAO,eAAP;AACD;;AAED,MAAI,OAAO,eAAP,KAA2B,UAA/B,EAA2C;AACzC,UAAM,YAAY,GAAG,eAArB;;AACA,IAAA,eAAe,GAAG,YAAY,IAAG;AAC/B,YAAM,MAAM,GAAG,YAAY,CAAC,YAAD,CAA3B;AACA,MAAA,cAAc,CAAC,MAAD,EAAS,WAAT,CAAd;AACA,aAAO,MAAP;AACD,KAJD;AAKD,GAlBwF,CAoBzF;;;AACA,SAAO,CAAC,CAAD,EAAI,CAAJ,CAAP;AACD;;AAtBD,OAAA,CAAA,gBAAA,GAAA,gBAAA;;AAwBA,MAAM,cAAc,GAAG,CAAC,MAAD,EAAiE,WAAjE,KAAwF;AAC7G,MAAI,MAAM,CAAC,CAAD,CAAN,KAAc,IAAd,IAAsB,MAAM,CAAC,CAAD,CAAN,KAAc,SAAxC,EAAmD;AACjD,IAAA,MAAM,CAAC,CAAD,CAAN,IAAa,WAAb;AACD,GAFD,MAEO;AACL,IAAA,MAAM,CAAC,CAAD,CAAN,GAAY,WAAZ;AACD;AACF,CAND","sourceRoot":""}

package/lib-commonjs/utils/positioningHelper.d.ts

@@ -1,7 +1,7 @@
 import * as PopperJs from '@popperjs/core';
-import { OffsetFunction } from '../types';
+import type { Offset } from '../types';
 /**
  * @see positioninHelper.test.ts for expected placement values
  */
-export declare const getPlacement: (align?: "top" | "bottom" | "start" | "end" | "center" | undefined, position?: "above" | "below" | "before" | "after" | undefined, rtl?: boolean | undefined) => PopperJs.Placement;
-export declare const applyRtlToOffset: (offset: OffsetFunction | [number | null | undefined, number | null | undefined] | undefined) => OffsetFunction | [number | null | undefined, number | null | undefined] | undefined;
+export declare const getPlacement: (align?: "bottom" | "top" | "center" | "start" | "end" | undefined, position?: "above" | "below" | "before" | "after" | undefined, rtl?: boolean | undefined) => PopperJs.Placement;
+export declare const applyRtlToOffset: (offset: Offset | undefined) => Offset | undefined;

package/lib-commonjs/utils/positioningHelper.js

@@ -1,43 +1,61 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var getPositionMap = function (rtl) { return ({
-    above: 'top',
-    below: 'bottom',
-    before: rtl ? 'right' : 'left',
-    after: rtl ? 'left' : 'right',
-}); };
-var getAlignmentMap = function (rtl) { return ({
-    start: rtl ? 'end' : 'start',
-    end: rtl ? 'start' : 'end',
-    top: 'start',
-    bottom: 'end',
-    center: '',
-}); };
-var shouldAlignToCenter = function (p, a) {
-    var positionedVertically = p === 'above' || p === 'below';
-    var alignedVertically = a === 'top' || a === 'bottom';
-    return (positionedVertically && alignedVertically) || (!positionedVertically && !alignedVertically);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.applyRtlToOffset = exports.getPlacement = void 0;
+
+const getPositionMap = rtl => ({
+  above: 'top',
+  below: 'bottom',
+  before: rtl ? 'right' : 'left',
+  after: rtl ? 'left' : 'right'
+});
+
+const getAlignmentMap = rtl => ({
+  start: rtl ? 'end' : 'start',
+  end: rtl ? 'start' : 'end',
+  top: 'start',
+  bottom: 'end',
+  center: ''
+});
+
+const shouldAlignToCenter = (p, a) => {
+  const positionedVertically = p === 'above' || p === 'below';
+  const alignedVertically = a === 'top' || a === 'bottom';
+  return positionedVertically && alignedVertically || !positionedVertically && !alignedVertically;
 };
 /**
  * @see positioninHelper.test.ts for expected placement values
  */
-exports.getPlacement = function (align, position, rtl) {
-    var alignment = shouldAlignToCenter(position, align) ? 'center' : align;
-    var computedPosition = position && getPositionMap(rtl)[position];
-    var computedAlignmnent = alignment && getAlignmentMap(rtl)[alignment];
-    if (computedPosition && computedAlignmnent) {
-        return computedPosition + "-" + computedAlignmnent;
-    }
-    return computedPosition || 'auto';
+
+
+const getPlacement = (align, position, rtl) => {
+  const alignment = shouldAlignToCenter(position, align) ? 'center' : align;
+  const computedPosition = position && getPositionMap(rtl)[position];
+  const computedAlignmnent = alignment && getAlignmentMap(rtl)[alignment];
+
+  if (computedPosition && computedAlignmnent) {
+    return `${computedPosition}-${computedAlignmnent}`;
+  }
+
+  return computedPosition || 'auto';
 };
-exports.applyRtlToOffset = function (offset) {
-    if (typeof offset === 'undefined') {
-        return undefined;
-    }
-    if (Array.isArray(offset)) {
-        offset[0] = offset[0] * -1;
-        return offset;
-    }
-    return (function (param) { return exports.applyRtlToOffset(offset(param)); });
+
+exports.getPlacement = getPlacement;
+
+const applyRtlToOffset = offset => {
+  if (typeof offset === 'undefined') {
+    return undefined;
+  }
+
+  if (Array.isArray(offset)) {
+    offset[0] = offset[0] * -1;
+    return offset;
+  }
+
+  return param => exports.applyRtlToOffset(offset(param));
 };
+
+exports.applyRtlToOffset = applyRtlToOffset;
 //# sourceMappingURL=positioningHelper.js.map

package/lib-commonjs/utils/positioningHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"positioningHelper.js","sourceRoot":"../src/","sources":["utils/positioningHelper.ts"],"names":[],"mappings":";;AAMA,IAAM,cAAc,GAAG,UAAC,GAAa,IAA0C,OAAA,CAAC;IAC9E,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,QAAQ;IACf,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;IAC9B,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;CAC9B,CAAC,EAL6E,CAK7E,CAAC;AAEH,IAAM,eAAe,GAAG,UAAC,GAAa,IAAwC,OAAA,CAAC;IAC7E,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;IAC5B,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;IAC1B,GAAG,EAAE,OAAO;IACZ,MAAM,EAAE,KAAK;IACb,MAAM,EAAE,EAAE;CACX,CAAC,EAN4E,CAM5E,CAAC;AAEH,IAAM,mBAAmB,GAAG,UAAC,CAAY,EAAE,CAAa;IACtD,IAAM,oBAAoB,GAAG,CAAC,KAAK,OAAO,IAAI,CAAC,KAAK,OAAO,CAAC;IAC5D,IAAM,iBAAiB,GAAG,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,QAAQ,CAAC;IAExD,OAAO,CAAC,oBAAoB,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC,oBAAoB,IAAI,CAAC,iBAAiB,CAAC,CAAC;AACtG,CAAC,CAAC;AAEF;;GAEG;AACU,QAAA,YAAY,GAAG,UAAC,KAAiB,EAAE,QAAmB,EAAE,GAAa;IAChF,IAAM,SAAS,GAAG,mBAAmB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC;IAE1E,IAAM,gBAAgB,GAAG,QAAQ,IAAI,cAAc,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,CAAC;IACnE,IAAM,kBAAkB,GAAG,SAAS,IAAI,eAAe,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;IAExE,IAAI,gBAAgB,IAAI,kBAAkB,EAAE;QAC1C,OAAU,gBAAgB,SAAI,kBAA0C,CAAC;KAC1E;IAED,OAAO,gBAAgB,IAAK,MAA6B,CAAC;AAC5D,CAAC,CAAC;AAEW,QAAA,gBAAgB,GAAG,UAAC,MAA0B;IACzD,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,OAAO,SAAS,CAAC;KAClB;IAED,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;QACzB,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAE,GAAG,CAAC,CAAC,CAAC;QAE5B,OAAO,MAAM,CAAC;KACf;IAED,OAAO,CAAC,UAAC,KAA0B,IAAK,OAAA,wBAAgB,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAA/B,CAA+B,CAAmB,CAAC;AAC7F,CAAC,CAAC","sourcesContent":["import * as PopperJs from '@popperjs/core';\nimport { Alignment, Offset, OffsetFunction, OffsetFunctionParam, Position } from '../types';\n\ntype PlacementPosition = 'top' | 'bottom' | 'left' | 'right';\ntype PlacementAlign = 'start' | 'end' | ''; // '' represents center\n\nconst getPositionMap = (rtl?: boolean): Record<Position, PlacementPosition> => ({\n  above: 'top',\n  below: 'bottom',\n  before: rtl ? 'right' : 'left',\n  after: rtl ? 'left' : 'right',\n});\n\nconst getAlignmentMap = (rtl?: boolean): Record<Alignment, PlacementAlign> => ({\n  start: rtl ? 'end' : 'start',\n  end: rtl ? 'start' : 'end',\n  top: 'start',\n  bottom: 'end',\n  center: '',\n});\n\nconst shouldAlignToCenter = (p?: Position, a?: Alignment): boolean => {\n  const positionedVertically = p === 'above' || p === 'below';\n  const alignedVertically = a === 'top' || a === 'bottom';\n\n  return (positionedVertically && alignedVertically) || (!positionedVertically && !alignedVertically);\n};\n\n/**\n * @see positioninHelper.test.ts for expected placement values\n */\nexport const getPlacement = (align?: Alignment, position?: Position, rtl?: boolean): PopperJs.Placement => {\n  const alignment = shouldAlignToCenter(position, align) ? 'center' : align;\n\n  const computedPosition = position && getPositionMap(rtl)[position];\n  const computedAlignmnent = alignment && getAlignmentMap(rtl)[alignment];\n\n  if (computedPosition && computedAlignmnent) {\n    return `${computedPosition}-${computedAlignmnent}` as PopperJs.Placement;\n  }\n\n  return computedPosition || ('auto' as PopperJs.Placement);\n};\n\nexport const applyRtlToOffset = (offset: Offset | undefined): Offset | undefined => {\n  if (typeof offset === 'undefined') {\n    return undefined;\n  }\n\n  if (Array.isArray(offset)) {\n    offset[0] = offset[0]! * -1;\n\n    return offset;\n  }\n\n  return ((param: OffsetFunctionParam) => applyRtlToOffset(offset(param))) as OffsetFunction;\n};\n"]}
+{"version":3,"sources":["../../src/utils/positioningHelper.ts"],"names":[],"mappings":";;;;;;;AAMA,MAAM,cAAc,GAAI,GAAD,KAAyD;AAC9E,EAAA,KAAK,EAAE,KADuE;AAE9E,EAAA,KAAK,EAAE,QAFuE;AAG9E,EAAA,MAAM,EAAE,GAAG,GAAG,OAAH,GAAa,MAHsD;AAI9E,EAAA,KAAK,EAAE,GAAG,GAAG,MAAH,GAAY;AAJwD,CAAzD,CAAvB;;AAOA,MAAM,eAAe,GAAI,GAAD,KAAuD;AAC7E,EAAA,KAAK,EAAE,GAAG,GAAG,KAAH,GAAW,OADwD;AAE7E,EAAA,GAAG,EAAE,GAAG,GAAG,OAAH,GAAa,KAFwD;AAG7E,EAAA,GAAG,EAAE,OAHwE;AAI7E,EAAA,MAAM,EAAE,KAJqE;AAK7E,EAAA,MAAM,EAAE;AALqE,CAAvD,CAAxB;;AAQA,MAAM,mBAAmB,GAAG,CAAC,CAAD,EAAe,CAAf,KAAyC;AACnE,QAAM,oBAAoB,GAAG,CAAC,KAAK,OAAN,IAAiB,CAAC,KAAK,OAApD;AACA,QAAM,iBAAiB,GAAG,CAAC,KAAK,KAAN,IAAe,CAAC,KAAK,QAA/C;AAEA,SAAQ,oBAAoB,IAAI,iBAAzB,IAAgD,CAAC,oBAAD,IAAyB,CAAC,iBAAjF;AACD,CALD;AAOA;;AAEG;;;AACI,MAAM,YAAY,GAAG,CAAC,KAAD,EAAoB,QAApB,EAAyC,GAAzC,KAA8E;AACxG,QAAM,SAAS,GAAG,mBAAmB,CAAC,QAAD,EAAW,KAAX,CAAnB,GAAuC,QAAvC,GAAkD,KAApE;AAEA,QAAM,gBAAgB,GAAG,QAAQ,IAAI,cAAc,CAAC,GAAD,CAAd,CAAoB,QAApB,CAArC;AACA,QAAM,kBAAkB,GAAG,SAAS,IAAI,eAAe,CAAC,GAAD,CAAf,CAAqB,SAArB,CAAxC;;AAEA,MAAI,gBAAgB,IAAI,kBAAxB,EAA4C;AAC1C,WAAO,GAAG,gBAAgB,IAAI,kBAAkB,EAAhD;AACD;;AAED,SAAO,gBAAgB,IAAK,MAA5B;AACD,CAXM;;AAAM,OAAA,CAAA,YAAA,GAAY,YAAZ;;AAaN,MAAM,gBAAgB,GAAI,MAAD,IAAmD;AACjF,MAAI,OAAO,MAAP,KAAkB,WAAtB,EAAmC;AACjC,WAAO,SAAP;AACD;;AAED,MAAI,KAAK,CAAC,OAAN,CAAc,MAAd,CAAJ,EAA2B;AACzB,IAAA,MAAM,CAAC,CAAD,CAAN,GAAY,MAAM,CAAC,CAAD,CAAN,GAAa,CAAC,CAA1B;AAEA,WAAO,MAAP;AACD;;AAED,SAAS,KAAD,IAAgC,OAAA,CAAA,gBAAA,CAAiB,MAAM,CAAC,KAAD,CAAvB,CAAxC;AACD,CAZM;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourceRoot":""}

package/lib-commonjs/utils/resolvePositioningShorthand.d.ts

@@ -0,0 +1,2 @@
+import type { PositioningShorthand, PositioningProps } from '../types';
+export declare function resolvePositioningShorthand(shorthand: PositioningShorthand | undefined | null): Readonly<PositioningProps>;

package/lib-commonjs/utils/resolvePositioningShorthand.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resolvePositioningShorthand = void 0; // Look up table for shorthand to avoid parsing strings
+
+const shorthandLookup = {
+  above: {
+    position: 'above',
+    align: 'center'
+  },
+  'above-start': {
+    position: 'above',
+    align: 'start'
+  },
+  'above-end': {
+    position: 'above',
+    align: 'end'
+  },
+  below: {
+    position: 'below',
+    align: 'center'
+  },
+  'below-start': {
+    position: 'below',
+    align: 'start'
+  },
+  'below-end': {
+    position: 'below',
+    align: 'end'
+  },
+  before: {
+    position: 'before',
+    align: 'center'
+  },
+  'before-top': {
+    position: 'before',
+    align: 'top'
+  },
+  'before-bottom': {
+    position: 'before',
+    align: 'bottom'
+  },
+  after: {
+    position: 'after',
+    align: 'center'
+  },
+  'after-top': {
+    position: 'after',
+    align: 'top'
+  },
+  'after-bottom': {
+    position: 'after',
+    align: 'bottom'
+  }
+};
+
+function resolvePositioningShorthand(shorthand) {
+  if (shorthand === undefined || shorthand === null) {
+    return {};
+  }
+
+  if (typeof shorthand === 'string') {
+    return shorthandLookup[shorthand];
+  }
+
+  return shorthand;
+}
+
+exports.resolvePositioningShorthand = resolvePositioningShorthand;
+//# sourceMappingURL=resolvePositioningShorthand.js.map

package/lib-commonjs/utils/resolvePositioningShorthand.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/resolvePositioningShorthand.ts"],"names":[],"mappings":";;;;;8CAEA;;AACA,MAAM,eAAe,GAAoF;AACvG,EAAA,KAAK,EAAE;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GADgG;AAEvG,iBAAe;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GAFwF;AAGvG,eAAa;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GAH0F;AAIvG,EAAA,KAAK,EAAE;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GAJgG;AAKvG,iBAAe;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GALwF;AAMvG,eAAa;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GAN0F;AAOvG,EAAA,MAAM,EAAE;AAAE,IAAA,QAAQ,EAAE,QAAZ;AAAsB,IAAA,KAAK,EAAE;AAA7B,GAP+F;AAQvG,gBAAc;AAAE,IAAA,QAAQ,EAAE,QAAZ;AAAsB,IAAA,KAAK,EAAE;AAA7B,GARyF;AASvG,mBAAiB;AAAE,IAAA,QAAQ,EAAE,QAAZ;AAAsB,IAAA,KAAK,EAAE;AAA7B,GATsF;AAUvG,EAAA,KAAK,EAAE;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GAVgG;AAWvG,eAAa;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B,GAX0F;AAYvG,kBAAgB;AAAE,IAAA,QAAQ,EAAE,OAAZ;AAAqB,IAAA,KAAK,EAAE;AAA5B;AAZuF,CAAzG;;AAeA,SAAgB,2BAAhB,CACE,SADF,EACoD;AAElD,MAAI,SAAS,KAAK,SAAd,IAA2B,SAAS,KAAK,IAA7C,EAAmD;AACjD,WAAO,EAAP;AACD;;AAED,MAAI,OAAO,SAAP,KAAqB,QAAzB,EAAmC;AACjC,WAAO,eAAe,CAAC,SAAD,CAAtB;AACD;;AAED,SAAO,SAAP;AACD;;AAZD,OAAA,CAAA,2BAAA,GAAA,2BAAA","sourceRoot":""}

package/lib-commonjs/utils/useCallbackRef.js

@@ -1,7 +1,13 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var react_utilities_1 = require("@fluentui/react-utilities");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCallbackRef = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 /**
  * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content
  * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via
@@ -19,36 +25,44 @@ var react_utilities_1 = require("@fluentui/react-utilities");
  * ref.current = 1;
  * // prints 0 -> 1
  */
+
+
 function useCallbackRef(initialValue, callback, skipInitialResolve) {
-    var isFirst = React.useRef(true);
-    var ref = React.useState(function () { return ({
-        // value
-        value: initialValue,
-        // last callback
-        callback: callback,
-        // "memoized" public interface
-        facade: {
-            get current() {
-                return ref.value;
-            },
-            set current(value) {
-                var last = ref.value;
-                if (last !== value) {
-                    ref.value = value;
-                    if (skipInitialResolve && isFirst.current) {
-                        return;
-                    }
-                    ref.callback(value, last);
-                }
-            },
-        },
-    }); })[0];
-    react_utilities_1.useIsomorphicLayoutEffect(function () {
-        isFirst.current = false;
-    }, []);
-    // update callback
-    ref.callback = callback;
-    return ref.facade;
+  const isFirst = React.useRef(true);
+  const [ref] = React.useState(() => ({
+    // value
+    value: initialValue,
+    // last callback
+    callback,
+    // "memoized" public interface
+    facade: {
+      get current() {
+        return ref.value;
+      },
+
+      set current(value) {
+        const last = ref.value;
+
+        if (last !== value) {
+          ref.value = value;
+
+          if (skipInitialResolve && isFirst.current) {
+            return;
+          }
+
+          ref.callback(value, last);
+        }
+      }
+
+    }
+  }));
+  react_utilities_1.useIsomorphicLayoutEffect(() => {
+    isFirst.current = false;
+  }, []); // update callback
+
+  ref.callback = callback;
+  return ref.facade;
 }
+
 exports.useCallbackRef = useCallbackRef;
 //# sourceMappingURL=useCallbackRef.js.map

package/lib-commonjs/utils/useCallbackRef.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCallbackRef.js","sourceRoot":"../src/","sources":["utils/useCallbackRef.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAC/B,6DAAsE;AAEtE;;;;;;;;;;;;;;;;GAgBG;AACH,SAAgB,cAAc,CAC5B,YAAsB,EACtB,QAA2D,EAC3D,kBAA4B;IAE5B,IAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAA;;;;;;;;;;;;;;;;;;;;;aAAG,CAwBN;IAEJ,2CAAyB,CAAC;QACxB,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC;IAC1B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,kBAAkB;IAClB,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAExB,OAAO,GAAG,CAAC,MAAM,CAAC;AACpB,CAAC;AAxCD,wCAwCC","sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\n/**\n * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content\n * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via\n * React.useState(), but it will cause re-renders always.\n *\n * https://reactjs.org/docs/hooks-reference.html#useref\n * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n *\n * @param initialValue - initial ref value\n * @param callback - a callback to run when value changes\n * @param skipInitialResolve - a flag to skip an initial ref report\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n */\nexport function useCallbackRef<T>(\n  initialValue: T | null,\n  callback: (newValue: T | null, lastValue: T | null) => void,\n  skipInitialResolve?: boolean,\n): React.MutableRefObject<T | null> {\n  const isFirst = React.useRef(true);\n  const [ref] = React.useState(() => ({\n    // value\n    value: initialValue,\n    // last callback\n    callback,\n    // \"memoized\" public interface\n    facade: {\n      get current() {\n        return ref.value;\n      },\n      set current(value) {\n        const last = ref.value;\n\n        if (last !== value) {\n          ref.value = value;\n\n          if (skipInitialResolve && isFirst.current) {\n            return;\n          }\n\n          ref.callback(value, last);\n        }\n      },\n    },\n  }));\n\n  useIsomorphicLayoutEffect(() => {\n    isFirst.current = false;\n  }, []);\n\n  // update callback\n  ref.callback = callback;\n\n  return ref.facade;\n}\n"]}
+{"version":3,"sources":["../../src/utils/useCallbackRef.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAEA;;;;;;;;;;;;;;;;AAgBG;;;AACH,SAAgB,cAAhB,CACE,YADF,EAEE,QAFF,EAGE,kBAHF,EAG8B;AAE5B,QAAM,OAAO,GAAG,KAAK,CAAC,MAAN,CAAa,IAAb,CAAhB;AACA,QAAM,CAAC,GAAD,IAAQ,KAAK,CAAC,QAAN,CAAe,OAAO;AAClC;AACA,IAAA,KAAK,EAAE,YAF2B;AAGlC;AACA,IAAA,QAJkC;AAKlC;AACA,IAAA,MAAM,EAAE;AACN,UAAI,OAAJ,GAAW;AACT,eAAO,GAAG,CAAC,KAAX;AACD,OAHK;;AAIN,UAAI,OAAJ,CAAY,KAAZ,EAAiB;AACf,cAAM,IAAI,GAAG,GAAG,CAAC,KAAjB;;AAEA,YAAI,IAAI,KAAK,KAAb,EAAoB;AAClB,UAAA,GAAG,CAAC,KAAJ,GAAY,KAAZ;;AAEA,cAAI,kBAAkB,IAAI,OAAO,CAAC,OAAlC,EAA2C;AACzC;AACD;;AAED,UAAA,GAAG,CAAC,QAAJ,CAAa,KAAb,EAAoB,IAApB;AACD;AACF;;AAhBK;AAN0B,GAAP,CAAf,CAAd;AA0BA,EAAA,iBAAA,CAAA,yBAAA,CAA0B,MAAK;AAC7B,IAAA,OAAO,CAAC,OAAR,GAAkB,KAAlB;AACD,GAFD,EAEG,EAFH,EA7B4B,CAiC5B;;AACA,EAAA,GAAG,CAAC,QAAJ,GAAe,QAAf;AAEA,SAAO,GAAG,CAAC,MAAX;AACD;;AAxCD,OAAA,CAAA,cAAA,GAAA,cAAA","sourceRoot":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-positioning",
-  "version": "9.0.0-alpha.9",
+  "version": "9.0.0-beta.4",
   "description": "A react wrapper around Popper.js for Fluent UI",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -13,27 +13,31 @@
   "license": "MIT",
   "scripts": {
     "build": "just-scripts build",
+    "bundle-size": "bundle-size measure",
     "clean": "just-scripts clean",
     "code-style": "just-scripts code-style",
     "just": "just-scripts",
     "lint": "just-scripts lint",
-    "start-test": "just-scripts jest-watch",
-    "test": "just-scripts test",
-    "update-snapshots": "just-scripts jest -u"
+    "test": "jest",
+    "docs": "api-extractor run --config=config/api-extractor.local.json --local",
+    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-positioning/src && yarn docs",
+    "type-check": "tsc -b tsconfig.json"
   },
   "devDependencies": {
-    "@fluentui/eslint-plugin": "^1.1.0",
+    "@fluentui/eslint-plugin": "*",
     "@fluentui/scripts": "^1.0.0",
     "@types/react": "16.9.42",
     "@types/react-dom": "16.9.10",
     "react": "16.8.6",
-    "react-dom": "16.8.6"
+    "react-dom": "16.8.6",
+    "@fluentui/babel-make-styles": "9.0.0-beta.4"
   },
   "dependencies": {
-    "@fluentui/react-shared-contexts": "^9.0.0-alpha.4",
-    "@fluentui/react-utilities": "^9.0.0-alpha.15",
+    "@fluentui/react-make-styles": "9.0.0-beta.4",
+    "@fluentui/react-shared-contexts": "9.0.0-beta.4",
+    "@fluentui/react-utilities": "9.0.0-beta.4",
     "@popperjs/core": "~2.4.3",
-    "tslib": "^1.10.0"
+    "tslib": "^2.1.0"
   },
   "peerDependencies": {
     "@types/react": ">=16.8.0 <18.0.0",
@@ -42,7 +46,6 @@
     "react-dom": ">=16.8.0 <18.0.0"
   },
   "beachball": {
-    "tag": "alpha",
     "disallowedChangeTypes": [
       "major",
       "minor",

package/config/api-extractor.json

@@ -1,3 +0,0 @@
-{
-  "extends": "@fluentui/scripts/api-extractor/api-extractor.common.json"
-}

package/etc/react-positioning.api.md

@@ -1,70 +0,0 @@
-## API Report File for "@fluentui/react-positioning"
-
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
-
-```ts
-
-import * as PopperJs from '@popperjs/core';
-import * as React from 'react';
-
-// @public (undocumented)
-export type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';
-
-// @public (undocumented)
-export type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';
-
-// @public (undocumented)
-export type Offset = OffsetFunction | [number | null | undefined, number | null | undefined];
-
-// @public (undocumented)
-export type OffsetFunction = (param: OffsetFunctionParam) => [number | null | undefined, number | null | undefined];
-
-// @public (undocumented)
-export type OffsetFunctionParam = {
-    popper: PopperJs.Rect;
-    reference: PopperJs.Rect;
-    placement: PopperJs.Placement;
-};
-
-// @public (undocumented)
-export interface PopperOptions extends PositioningProps {
-    enabled?: boolean;
-    // (undocumented)
-    onStateUpdate?: (state: Partial<PopperJs.State>) => void;
-    positioningDependencies?: React.DependencyList;
-}
-
-// @public (undocumented)
-export type PopperRefHandle = {
-    updatePosition: () => void;
-};
-
-// @public (undocumented)
-export type Position = 'above' | 'below' | 'before' | 'after';
-
-// @public (undocumented)
-export interface PositioningProps {
-    align?: Alignment;
-    arrowPadding?: number;
-    autoSize?: 'height' | 'width' | boolean;
-    containerRef?: React.Ref<PopperRefHandle>;
-    flipBoundary?: Boundary;
-    offset?: Offset;
-    overflowBoundary?: Boundary;
-    position?: Position;
-    positionFixed?: boolean;
-    unstable_disableTether?: boolean | 'all';
-    unstable_pinned?: boolean;
-}
-
-// @public
-export function usePopper(options?: PopperOptions): {
-    targetRef: React.MutableRefObject<any>;
-    containerRef: React.MutableRefObject<any>;
-    arrowRef: React.MutableRefObject<any>;
-};
-
-
-// (No @packageDocumentation comment for this package)
-
-```

package/just.config.ts

@@ -1,3 +0,0 @@
-import { preset } from '@fluentui/scripts';
-
-preset();

package/lib/utils/isBrowser.d.ts

@@ -1 +0,0 @@
-export declare const isBrowser: () => boolean;

package/lib/utils/isBrowser.js

@@ -1,4 +0,0 @@
-var hasDocument = typeof document === 'object' && document !== null;
-var hasWindow = typeof window === 'object' && window !== null && window.self === window;
-export var isBrowser = function () { return hasDocument && hasWindow; };
-//# sourceMappingURL=isBrowser.js.map

package/lib/utils/isBrowser.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"isBrowser.js","sourceRoot":"../src/","sources":["utils/isBrowser.tsx"],"names":[],"mappings":"AAAA,IAAM,WAAW,GAAG,OAAO,QAAQ,KAAK,QAAQ,IAAI,QAAQ,KAAK,IAAI,CAAC;AACtE,IAAM,SAAS,GAAG,OAAO,MAAM,KAAK,QAAQ,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,CAAC,IAAI,KAAK,MAAM,CAAC;AAE1F,MAAM,CAAC,IAAM,SAAS,GAAG,cAAM,OAAA,WAAW,IAAI,SAAS,EAAxB,CAAwB,CAAC","sourcesContent":["const hasDocument = typeof document === 'object' && document !== null;\nconst hasWindow = typeof window === 'object' && window !== null && window.self === window;\n\nexport const isBrowser = () => hasDocument && hasWindow;\n"]}

package/lib-amd/index.d.ts

@@ -1,2 +0,0 @@
-export * from './usePopper';
-export * from './types';

package/lib-amd/index.js

@@ -1,6 +0,0 @@
-define(["require", "exports", "tslib", "./usePopper"], function (require, exports, tslib_1, usePopper_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    tslib_1.__exportStar(usePopper_1, exports);
-});
-//# sourceMappingURL=index.js.map

package/lib-amd/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;IAAA,2CAA4B","sourcesContent":["export * from './usePopper';\nexport * from './types';\n"]}

package/lib-amd/types.d.ts

@@ -1,78 +0,0 @@
-import * as PopperJs from '@popperjs/core';
-import * as React from 'react';
-export declare type OffsetFunctionParam = {
-    popper: PopperJs.Rect;
-    reference: PopperJs.Rect;
-    placement: PopperJs.Placement;
-};
-export declare type OffsetFunction = (param: OffsetFunctionParam) => [number | null | undefined, number | null | undefined];
-export declare type Offset = OffsetFunction | [number | null | undefined, number | null | undefined];
-export declare type Position = 'above' | 'below' | 'before' | 'after';
-export declare type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';
-export declare type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';
-export declare type PopperRefHandle = {
-    updatePosition: () => void;
-};
-export interface PositioningProps {
-    /**
-     * Alignment for the component.
-     */
-    align?: Alignment;
-    /** The element which will define the boundaries of the popper position for the flip behavior. */
-    flipBoundary?: Boundary;
-    /** The element which will define the boundaries of the popper position for the overflow behavior. */
-    overflowBoundary?: Boundary;
-    /** An imperative handle to Popper methods. */
-    containerRef?: React.Ref<PopperRefHandle>;
-    /**
-     * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')
-     * and align is also vertical ('top' | 'bottom') or if both position and align are horizontal ('before' | 'after'
-     * and 'start' | 'end' respectively),
-     * then provided value for 'align' will be ignored and 'center' will be used instead.
-     */
-    position?: Position;
-    /**
-     * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')
-     * @default false
-     */
-    positionFixed?: boolean;
-    /**
-     * Lets you displace a popper element from its reference element.
-     * This can be useful if you need to apply some margin between them or if you need to fine tune the
-     * position according to some custom logic.
-     */
-    offset?: Offset;
-    /**
-     * Defines padding between the corner of the popup element and the arrow.
-     * Use to prevent the arrow from overlapping a rounded corner, for example.
-     */
-    arrowPadding?: number;
-    /**
-     * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.
-     * "all" enables this behavior for all axis.
-     */
-    unstable_disableTether?: boolean | 'all';
-    /**
-     * Disables automatic repositioning of the component; it will always be placed according to the values of `align` and
-     * `position` props, regardless of the size of the component, the reference element or the viewport.
-     */
-    unstable_pinned?: boolean;
-    /**
-     * Applies max-height and max-width on popper to fit it within the available space in viewport.
-     * true enables this for both width and height.
-     * 'height' applies only `max-height` and 'width' for `max-width`
-     */
-    autoSize?: 'height' | 'width' | boolean;
-}
-export interface PopperOptions extends PositioningProps {
-    /**
-     * If false, delays Popper's creation.
-     * @default true
-     */
-    enabled?: boolean;
-    /**
-     * Array of conditions to be met in order to trigger a subsequent render to reposition the elements.
-     */
-    positioningDependencies?: React.DependencyList;
-    onStateUpdate?: (state: Partial<PopperJs.State>) => void;
-}

package/lib-amd/types.js

@@ -1,5 +0,0 @@
-define(["require", "exports"], function (require, exports) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-});
-//# sourceMappingURL=types.js.map

package/lib-amd/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","sourceRoot":"../src/","sources":["types.ts"],"names":[],"mappings":"","sourcesContent":["import * as PopperJs from '@popperjs/core';\nimport * as React from 'react';\n\nexport type OffsetFunctionParam = {\n  popper: PopperJs.Rect;\n  reference: PopperJs.Rect;\n  placement: PopperJs.Placement;\n};\n\nexport type OffsetFunction = (param: OffsetFunctionParam) => [number | null | undefined, number | null | undefined];\n\nexport type Offset = OffsetFunction | [number | null | undefined, number | null | undefined];\n\nexport type Position = 'above' | 'below' | 'before' | 'after';\nexport type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';\n\nexport type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';\n\nexport type PopperRefHandle = { updatePosition: () => void };\n\nexport interface PositioningProps {\n  /**\n   * Alignment for the component.\n   */\n  align?: Alignment;\n\n  /** The element which will define the boundaries of the popper position for the flip behavior. */\n  flipBoundary?: Boundary;\n\n  /** The element which will define the boundaries of the popper position for the overflow behavior. */\n  overflowBoundary?: Boundary;\n\n  /** An imperative handle to Popper methods. */\n  containerRef?: React.Ref<PopperRefHandle>;\n\n  /**\n   * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')\n   * and align is also vertical ('top' | 'bottom') or if both position and align are horizontal ('before' | 'after'\n   * and 'start' | 'end' respectively),\n   * then provided value for 'align' will be ignored and 'center' will be used instead.\n   */\n  position?: Position;\n\n  /**\n   * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')\n   * @default false\n   */\n  positionFixed?: boolean;\n\n  /**\n   * Lets you displace a popper element from its reference element.\n   * This can be useful if you need to apply some margin between them or if you need to fine tune the\n   * position according to some custom logic.\n   */\n  offset?: Offset;\n\n  /**\n   * Defines padding between the corner of the popup element and the arrow.\n   * Use to prevent the arrow from overlapping a rounded corner, for example.\n   */\n  arrowPadding?: number;\n\n  /**\n   * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.\n   * \"all\" enables this behavior for all axis.\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  unstable_disableTether?: boolean | 'all';\n\n  /**\n   * Disables automatic repositioning of the component; it will always be placed according to the values of `align` and\n   * `position` props, regardless of the size of the component, the reference element or the viewport.\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  unstable_pinned?: boolean;\n\n  /**\n   * Applies max-height and max-width on popper to fit it within the available space in viewport.\n   * true enables this for both width and height.\n   * 'height' applies only `max-height` and 'width' for `max-width`\n   */\n  autoSize?: 'height' | 'width' | boolean;\n}\n\nexport interface PopperOptions extends PositioningProps {\n  /**\n   * If false, delays Popper's creation.\n   * @default true\n   */\n  enabled?: boolean;\n\n  /**\n   * Array of conditions to be met in order to trigger a subsequent render to reposition the elements.\n   */\n  positioningDependencies?: React.DependencyList;\n\n  onStateUpdate?: (state: Partial<PopperJs.State>) => void;\n}\n"]}

package/lib-amd/usePopper.d.ts

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { PopperOptions } from './types';
-/**
- * Exposes Popper positioning API via React hook. Contains few important differences between an official "react-popper"
- * package:
- * - style attributes are applied directly on DOM to avoid re-renders
- * - refs changes and resolution is handled properly without re-renders
- * - contains a specific to React fix related to initial positioning when containers have components with managed focus
- *   to avoid focus jumps
- */
-export declare function usePopper(options?: PopperOptions): {
-    targetRef: React.MutableRefObject<any>;
-    containerRef: React.MutableRefObject<any>;
-    arrowRef: React.MutableRefObject<any>;
-};