@fluentui/react-tabster - npm Package Compare versions

Comparing version 0.0.0-nightlya372ad979820211103.1 to 0.0.0-nightlya54302c0b220211124.1

CHANGELOG.json

@@ -5,12 +5,12 @@ {
     {
-      "date": "Wed, 03 Nov 2021 08:24:06 GMT",
-      "tag": "@fluentui/react-tabster_v0.0.0-nightlya372ad979820211103.1",
-      "version": "0.0.0-nightlya372ad979820211103.1",
+      "date": "Wed, 24 Nov 2021 04:12:46 GMT",
+      "tag": "@fluentui/react-tabster_v0.0.0-nightlya54302c0b220211124.1",
+      "version": "0.0.0-nightlya54302c0b220211124.1",
       "comments": {
         "prerelease": [
           {
-            "author": "email not defined",
+            "author": "beachball",
             "package": "@fluentui/react-tabster",
-            "commit": "ff9c0a60767a2dbd1afdc71659a5daee5f2068dd",
-            "comment": "Release nightly v9"
+            "comment": "Bump @fluentui/make-styles to v0.0.0-nightlya54302c0b220211124.1",
+            "commit": "e3c1bd15060ac276670338660c7965b877e333f4"
           },
@@ -20,4 +20,4 @@ {
             "package": "@fluentui/react-tabster",
-            "comment": "Bump @fluentui/make-styles to v0.0.0-nightlya372ad979820211103.1",
-            "commit": "ff9c0a60767a2dbd1afdc71659a5daee5f2068dd"
+            "comment": "Bump @fluentui/react-make-styles to v0.0.0-nightlya54302c0b220211124.1",
+            "commit": "e3c1bd15060ac276670338660c7965b877e333f4"
           },
@@ -27,10 +27,43 @@ {
             "package": "@fluentui/react-tabster",
-            "comment": "Bump @fluentui/react-make-styles to v0.0.0-nightlya372ad979820211103.1",
-            "commit": "ff9c0a60767a2dbd1afdc71659a5daee5f2068dd"
+            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightlya54302c0b220211124.1",
+            "commit": "e3c1bd15060ac276670338660c7965b877e333f4"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Fri, 12 Nov 2021 13:25:07 GMT",
+      "tag": "@fluentui/react-tabster_v9.0.0-beta.4",
+      "version": "9.0.0-beta.4",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "[e-mail]",
+            "package": "@fluentui/react-tabster",
+            "commit": "bdd19e2bb827fc1d8eb329e6ed48cd0542048358",
+            "comment": "Add useFocusableGroup hook"
           },
           {
+            "author": "[e-mail]",
+            "package": "@fluentui/react-tabster",
+            "commit": "ed2d7c8d638535c89e24e3c3de3534c4fae30172",
+            "comment": "Use uncontrolled tabbing by default"
+          },
+          {
+            "author": "[e-mail]",
+            "package": "@fluentui/react-tabster",
+            "commit": "c9bd5b5a02ae94a8239ce1b56cac2f0d0dbd3586",
+            "comment": "Updated beta and RC components to ES2019"
+          },
+          {
+            "author": "[e-mail]",
+            "package": "@fluentui/react-tabster",
+            "commit": "da10ba8b6cca0c4cf921dc176bb9b7ea57fde9fa",
+            "comment": "Bump tabster and keyborg to 1.0.7"
+          },
+          {
             "author": "beachball",
             "package": "@fluentui/react-tabster",
-            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightlya372ad979820211103.1",
-            "commit": "ff9c0a60767a2dbd1afdc71659a5daee5f2068dd"
+            "comment": "Bump @fluentui/react-make-styles to v9.0.0-beta.3",
+            "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
           },
@@ -40,5 +73,19 @@ {
             "package": "@fluentui/react-tabster",
-            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightlya372ad979820211103.1",
-            "commit": "ff9c0a60767a2dbd1afdc71659a5daee5f2068dd"
+            "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.3",
+            "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabster",
+            "comment": "Bump @fluentui/react-utilities to v9.0.0-beta.3",
+            "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
           }
+        ],
+        "none": [
+          {
+            "author": "[e-mail]",
+            "package": "@fluentui/react-tabster",
+            "commit": "00f70581480b536e723fb69edf0ae617beac4807",
+            "comment": "Remove beta release tag"
+          }
         ]
@@ -45,0 +92,0 @@ }

CHANGELOG.md

 # Change Log - @fluentui/react-tabster
 
-This log was last generated on Wed, 03 Nov 2021 08:24:06 GMT and should not be manually modified.
+This log was last generated on Wed, 24 Nov 2021 04:12:46 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightlya372ad979820211103.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v0.0.0-nightlya372ad979820211103.1)
+## [0.0.0-nightlya54302c0b220211124.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v0.0.0-nightlya54302c0b220211124.1)
 
-Wed, 03 Nov 2021 08:24:06 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.0.0-beta.3..@fluentui/react-tabster_v0.0.0-nightlya372ad979820211103.1)
+Wed, 24 Nov 2021 04:12:46 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.0.0-beta.4..@fluentui/react-tabster_v0.0.0-nightlya54302c0b220211124.1)
 
 ### Changes
 
-- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/ff9c0a60767a2dbd1afdc71659a5daee5f2068dd) by email not defined)
-- Bump @fluentui/make-styles to v0.0.0-nightlya372ad979820211103.1 ([commit](https://github.com/microsoft/fluentui/commit/ff9c0a60767a2dbd1afdc71659a5daee5f2068dd) by beachball)
-- Bump @fluentui/react-make-styles to v0.0.0-nightlya372ad979820211103.1 ([commit](https://github.com/microsoft/fluentui/commit/ff9c0a60767a2dbd1afdc71659a5daee5f2068dd) by beachball)
-- Bump @fluentui/react-shared-contexts to v0.0.0-nightlya372ad979820211103.1 ([commit](https://github.com/microsoft/fluentui/commit/ff9c0a60767a2dbd1afdc71659a5daee5f2068dd) by beachball)
-- Bump @fluentui/react-utilities to v0.0.0-nightlya372ad979820211103.1 ([commit](https://github.com/microsoft/fluentui/commit/ff9c0a60767a2dbd1afdc71659a5daee5f2068dd) by beachball)
+- Bump @fluentui/make-styles to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
+- Bump @fluentui/react-make-styles to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
+- Bump @fluentui/react-shared-contexts to v0.0.0-nightlya54302c0b220211124.1 ([commit](https://github.com/microsoft/fluentui/commit/e3c1bd15060ac276670338660c7965b877e333f4) by beachball)
 
+## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.0.0-beta.4)
+
+Fri, 12 Nov 2021 13:25:07 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.0.0-beta.3..@fluentui/react-tabster_v9.0.0-beta.4)
+
+### Changes
+
+- Add useFocusableGroup hook ([PR #20132](https://github.com/microsoft/fluentui/pull/20132) by [e-mail])
+- Use uncontrolled tabbing by default ([PR #20571](https://github.com/microsoft/fluentui/pull/20571) by [e-mail])
+- Updated beta and RC components to ES2019 ([PR #20405](https://github.com/microsoft/fluentui/pull/20405) by [e-mail])
+- Bump tabster and keyborg to 1.0.7 ([PR #20593](https://github.com/microsoft/fluentui/pull/20593) by [e-mail])
+- Bump @fluentui/react-make-styles to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
+- Bump @fluentui/react-utilities to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
+
 ## [9.0.0-beta.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.0.0-beta.3)
@@ -21,0 +34,0 @@

dist/react-tabster.d.ts

@@ -31,17 +31,2 @@ import type { MakeStyles } from '@fluentui/make-styles';
 
-export declare enum FocusableGroupTabBehavior {
-    /**
-     * Tab will cycle into and out of the groupper content.
-     */
-    Unlimited,
-    /**
-     * Tab will cycle out of the container, but not into it.
-     */
-    Limited,
-    /**
-     * Tab only cycles the inner elements.
-     */
-    LimitedTrapFocus
-}
-
 export declare type FocusOutlineOffset = Record<'top' | 'bottom' | 'left' | 'right', string>;
@@ -91,5 +76,5 @@
     /**
-     * Type of TAB key interaction.
+     * Behavior for the Tab key.
      */
-    tabBehavior?: FocusableGroupTabBehavior;
+    tabBehavior?: 'unlimited' | 'limited' | 'limitedTrapFocus';
 }
@@ -96,0 +81,0 @@

lib-commonjs/hooks/index.js

@@ -7,3 +7,3 @@ "use strict";
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
@@ -10,0 +10,0 @@ tslib_1.__exportStar(require("./useArrowNavigationGroup"), exports);

lib-commonjs/hooks/useArrowNavigationGroup.js

@@ -8,7 +8,7 @@ "use strict";
 
-var tabster_1 = /*#__PURE__*/require("tabster");
+const tabster_1 = /*#__PURE__*/require("tabster");
 
-var useTabsterAttributes_1 = /*#__PURE__*/require("./useTabsterAttributes");
+const useTabsterAttributes_1 = /*#__PURE__*/require("./useTabsterAttributes");
 
-var useTabster_1 = /*#__PURE__*/require("./useTabster");
+const useTabster_1 = /*#__PURE__*/require("./useTabster");
 /**
@@ -20,6 +20,6 @@ * A hook that returns the necessary tabster attributes to support arrow key navigation
 
-var useArrowNavigationGroup = function (options) {
+const useArrowNavigationGroup = options => {
   var _a;
 
-  var tabster = useTabster_1.useTabster();
+  const tabster = useTabster_1.useTabster();
 
@@ -26,0 +26,0 @@ if (tabster) {

lib-commonjs/hooks/useFocusableGroup.d.ts

 import { Types } from 'tabster';
-export declare enum FocusableGroupTabBehavior {
-    /**
-     * Tab will cycle into and out of the groupper content.
-     */
-    Unlimited,
-    /**
-     * Tab will cycle out of the container, but not into it.
-     */
-    Limited,
-    /**
-     * Tab only cycles the inner elements.
-     */
-    LimitedTrapFocus
-}
 export interface UseFocusableGroupOptions {
     /**
-     * Type of TAB key interaction.
+     * Behavior for the Tab key.
      */
-    tabBehavior?: FocusableGroupTabBehavior;
+    tabBehavior?: 'unlimited' | 'limited' | 'limitedTrapFocus';
 }
@@ -22,0 +8,0 @@ /**

lib-commonjs/hooks/useFocusableGroup.js

@@ -6,28 +6,9 @@ "use strict";
 });
-exports.useFocusableGroup = exports.FocusableGroupTabBehavior = void 0;
+exports.useFocusableGroup = void 0;
 
-var tabster_1 = /*#__PURE__*/require("tabster");
+const tabster_1 = /*#__PURE__*/require("tabster");
 
-var useTabsterAttributes_1 = /*#__PURE__*/require("./useTabsterAttributes");
+const useTabsterAttributes_1 = /*#__PURE__*/require("./useTabsterAttributes");
 
-var useTabster_1 = /*#__PURE__*/require("./useTabster");
-
-var FocusableGroupTabBehavior;
-
-(function (FocusableGroupTabBehavior) {
-  /**
-   * Tab will cycle into and out of the groupper content.
-   */
-  FocusableGroupTabBehavior[FocusableGroupTabBehavior["Unlimited"] = tabster_1.Types.GroupperTabbabilities.Unlimited] = "Unlimited";
-  /**
-   * Tab will cycle out of the container, but not into it.
-   */
-
-  FocusableGroupTabBehavior[FocusableGroupTabBehavior["Limited"] = tabster_1.Types.GroupperTabbabilities.Limited] = "Limited";
-  /**
-   * Tab only cycles the inner elements.
-   */
-
-  FocusableGroupTabBehavior[FocusableGroupTabBehavior["LimitedTrapFocus"] = tabster_1.Types.GroupperTabbabilities.LimitedTrapFocus] = "LimitedTrapFocus";
-})(FocusableGroupTabBehavior = exports.FocusableGroupTabBehavior || (exports.FocusableGroupTabBehavior = {}));
+const useTabster_1 = /*#__PURE__*/require("./useTabster");
 /**
@@ -39,4 +20,4 @@ * A hook that returns the necessary tabster attributes to support groupping.
 
-var useFocusableGroup = function (options) {
-  var tabster = useTabster_1.useTabster();
+const useFocusableGroup = options => {
+  const tabster = useTabster_1.useTabster();
 
@@ -49,3 +30,3 @@ if (tabster) {
     groupper: {
-      tabbability: options === null || options === void 0 ? void 0 : options.tabBehavior
+      tabbability: getTabbability(options === null || options === void 0 ? void 0 : options.tabBehavior)
     }
@@ -56,2 +37,18 @@ });
 exports.useFocusableGroup = useFocusableGroup;
+
+const getTabbability = tabBehavior => {
+  switch (tabBehavior) {
+    case 'unlimited':
+      return tabster_1.Types.GroupperTabbabilities.Unlimited;
+
+    case 'limited':
+      return tabster_1.Types.GroupperTabbabilities.Limited;
+
+    case 'limitedTrapFocus':
+      return tabster_1.Types.GroupperTabbabilities.LimitedTrapFocus;
+
+    default:
+      return undefined;
+  }
+};
 //# sourceMappingURL=useFocusableGroup.js.map

lib-commonjs/hooks/useFocusFinders.js

@@ -8,5 +8,5 @@ "use strict";
 
-var React = /*#__PURE__*/require("react");
+const React = /*#__PURE__*/require("react");
 
-var useTabster_1 = /*#__PURE__*/require("./useTabster");
+const useTabster_1 = /*#__PURE__*/require("./useTabster");
 /**
@@ -17,37 +17,27 @@ * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element
 
-var useFocusFinders = function () {
-  var tabster = useTabster_1.useTabster(); // Narrow props for now and let need dictate additional props in the future
+const useFocusFinders = () => {
+  const tabster = useTabster_1.useTabster(); // Narrow props for now and let need dictate additional props in the future
 
-  var findAllFocusable = React.useCallback(function (container, acceptCondition) {
-    return (tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findAll({
-      container: container,
-      acceptCondition: acceptCondition
-    })) || [];
-  }, [tabster]);
-  var findFirstFocusable = React.useCallback(function (container) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findFirst({
-      container: container
-    });
-  }, [tabster]);
-  var findLastFocusable = React.useCallback(function (container) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findLast({
-      container: container
-    });
-  }, [tabster]);
-  var findNextFocusable = React.useCallback(function (currentElement) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findNext({
-      currentElement: currentElement
-    });
-  }, [tabster]);
-  var findPrevFocusable = React.useCallback(function (currentElement) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findPrev({
-      currentElement: currentElement
-    });
-  }, [tabster]);
+  const findAllFocusable = React.useCallback((container, acceptCondition) => (tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findAll({
+    container,
+    acceptCondition
+  })) || [], [tabster]);
+  const findFirstFocusable = React.useCallback(container => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findFirst({
+    container
+  }), [tabster]);
+  const findLastFocusable = React.useCallback(container => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findLast({
+    container
+  }), [tabster]);
+  const findNextFocusable = React.useCallback(currentElement => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findNext({
+    currentElement
+  }), [tabster]);
+  const findPrevFocusable = React.useCallback(currentElement => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findPrev({
+    currentElement
+  }), [tabster]);
   return {
-    findAllFocusable: findAllFocusable,
-    findFirstFocusable: findFirstFocusable,
-    findLastFocusable: findLastFocusable,
-    findNextFocusable: findNextFocusable,
-    findPrevFocusable: findPrevFocusable
+    findAllFocusable,
+    findFirstFocusable,
+    findLastFocusable,
+    findNextFocusable,
+    findPrevFocusable
   };
@@ -54,0 +44,0 @@ };

lib-commonjs/hooks/useFocusIndicatorStyle.js

@@ -8,5 +8,3 @@ "use strict";
 
-var tslib_1 = /*#__PURE__*/require("tslib");
-
-var symbols_1 = /*#__PURE__*/require("../symbols");
+const symbols_1 = /*#__PURE__*/require("../symbols");
 /**
@@ -21,13 +19,15 @@ * NOTE: the element with the focus outline needs to have `position: relative` so that the
 
-var getFocusOutlineStyles = function (options) {
+const getFocusOutlineStyles = options => {
   var _a, _b, _c, _d;
 
-  var outlineRadius = options.outlineRadius,
-      outlineColor = options.outlineColor,
-      outlineOffset = options.outlineOffset,
-      outlineWidth = options.outlineWidth;
-  var outlineOffsetTop = ((_a = outlineOffset) === null || _a === void 0 ? void 0 : _a.top) || outlineOffset;
-  var outlineOffsetBottom = ((_b = outlineOffset) === null || _b === void 0 ? void 0 : _b.bottom) || outlineOffset;
-  var outlineOffsetLeft = ((_c = outlineOffset) === null || _c === void 0 ? void 0 : _c.left) || outlineOffset;
-  var outlineOffsetRight = ((_d = outlineOffset) === null || _d === void 0 ? void 0 : _d.right) || outlineOffset;
+  const {
+    outlineRadius,
+    outlineColor,
+    outlineOffset,
+    outlineWidth
+  } = options;
+  const outlineOffsetTop = ((_a = outlineOffset) === null || _a === void 0 ? void 0 : _a.top) || outlineOffset;
+  const outlineOffsetBottom = ((_b = outlineOffset) === null || _b === void 0 ? void 0 : _b.bottom) || outlineOffset;
+  const outlineOffsetLeft = ((_c = outlineOffset) === null || _c === void 0 ? void 0 : _c.left) || outlineOffset;
+  const outlineOffsetRight = ((_d = outlineOffset) === null || _d === void 0 ? void 0 : _d.right) || outlineOffset;
   return {
@@ -45,6 +45,6 @@ borderColor: 'transparent',
       borderColor: outlineColor,
-      top: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetTop + ")",
-      bottom: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetBottom + ")",
-      left: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetLeft + ")",
-      right: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetRight + ")"
+      top: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetTop})`,
+      bottom: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetBottom})`,
+      left: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetLeft})`,
+      right: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetRight})`
     }
@@ -54,3 +54,3 @@ };
 
-var defaultOptions = {
+const defaultOptions = {
   selector: 'focus'
@@ -67,22 +67,17 @@ };
 
-var createFocusOutlineStyle = function (theme, options) {
-  var _a;
-
-  if (options === void 0) {
-    options = tslib_1.__assign({
-      style: {}
-    }, defaultOptions);
-  }
-
-  return _a = {
-    ':focus-visible': {
-      outline: 'none'
-    }
-  }, _a[symbols_1.KEYBOARD_NAV_SELECTOR + " :" + (options.selector || defaultOptions.selector)] = getFocusOutlineStyles(tslib_1.__assign({
+const createFocusOutlineStyle = (theme, options = {
+  style: {},
+  ...defaultOptions
+}) => ({
+  ':focus-visible': {
+    outline: 'none'
+  },
+  [`${symbols_1.KEYBOARD_NAV_SELECTOR} :${options.selector || defaultOptions.selector}`]: getFocusOutlineStyles({
     outlineColor: theme.colorStrokeFocus2,
     outlineRadius: theme.borderRadiusMedium,
     // FIXME: theme.global.strokeWidth.thick causes some weird bugs
-    outlineWidth: '2px'
-  }, options.style)), _a;
-};
+    outlineWidth: '2px',
+    ...options.style
+  })
+});
 
@@ -97,19 +92,10 @@ exports.createFocusOutlineStyle = createFocusOutlineStyle;
 
-var createCustomFocusIndicatorStyle = function (rule, options) {
-  if (options === void 0) {
-    options = defaultOptions;
-  }
+const createCustomFocusIndicatorStyle = (rule, options = defaultOptions) => theme => ({
+  ':focus-visible': {
+    outline: 'none'
+  },
+  [`${symbols_1.KEYBOARD_NAV_SELECTOR} :${options.selector || defaultOptions.selector}`]: typeof rule === 'function' ? rule(theme) : rule
+});
 
-  return function (theme) {
-    var _a;
-
-    return _a = {
-      ':focus-visible': {
-        outline: 'none'
-      }
-    }, _a[symbols_1.KEYBOARD_NAV_SELECTOR + " :" + (options.selector || defaultOptions.selector)] = typeof rule === 'function' ? rule(theme) : rule, _a;
-  };
-};
-
 exports.createCustomFocusIndicatorStyle = createCustomFocusIndicatorStyle;
 //# sourceMappingURL=useFocusIndicatorStyle.js.map

lib-commonjs/hooks/useKeyboardNavAttribute.js

@@ -8,9 +8,9 @@ "use strict";
 
-var keyborg_1 = /*#__PURE__*/require("keyborg");
+const keyborg_1 = /*#__PURE__*/require("keyborg");
 
-var react_1 = /*#__PURE__*/require("react");
+const react_1 = /*#__PURE__*/require("react");
 
-var symbols_1 = /*#__PURE__*/require("../symbols");
+const symbols_1 = /*#__PURE__*/require("../symbols");
 
-var react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 /**
@@ -22,19 +22,17 @@ * instantiates keyborg and add attribute to ensure focus indicator synced to keyborg logic
 function useKeyboardNavAttribute() {
-  var targetDocument = react_shared_contexts_1.useFluent().targetDocument;
-  var keyborg = react_1.useMemo(function () {
-    return targetDocument && keyborg_1.createKeyborg(targetDocument.defaultView);
-  }, [targetDocument]);
-  var ref = react_1.useRef(null);
-  react_1.useEffect(function () {
+  const {
+    targetDocument
+  } = react_shared_contexts_1.useFluent();
+  const keyborg = react_1.useMemo(() => targetDocument && keyborg_1.createKeyborg(targetDocument.defaultView), [targetDocument]);
+  const ref = react_1.useRef(null);
+  react_1.useEffect(() => {
     if (keyborg) {
       setBooleanAttribute(ref, symbols_1.KEYBOARD_NAV_ATTRIBUTE, keyborg.isNavigatingWithKeyboard());
 
-      var cb_1 = function (next) {
+      const cb = next => {
         setBooleanAttribute(ref, symbols_1.KEYBOARD_NAV_ATTRIBUTE, next);
       };
 
-      keyborg.subscribe(cb_1);
-      return function () {
-        return keyborg.unsubscribe(cb_1);
-      };
+      keyborg.subscribe(cb);
+      return () => keyborg.unsubscribe(cb);
     }
@@ -41,0 +39,0 @@ }, [keyborg]);

lib-commonjs/hooks/useModalAttributes.js

@@ -8,9 +8,9 @@ "use strict";
 
-var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 
-var useTabsterAttributes_1 = /*#__PURE__*/require("./useTabsterAttributes");
+const useTabsterAttributes_1 = /*#__PURE__*/require("./useTabsterAttributes");
 
-var tabster_1 = /*#__PURE__*/require("tabster");
+const tabster_1 = /*#__PURE__*/require("tabster");
 
-var useTabster_1 = /*#__PURE__*/require("./useTabster");
+const useTabster_1 = /*#__PURE__*/require("./useTabster");
 /**
@@ -25,11 +25,9 @@ * Applies modal dialog behaviour through DOM attributes
 
-var useModalAttributes = function (options) {
-  if (options === void 0) {
-    options = {};
-  }
+const useModalAttributes = (options = {}) => {
+  const {
+    trapFocus,
+    alwaysFocusable
+  } = options;
+  const tabster = useTabster_1.useTabster(); // Initializes the modalizer and deloser APIs
 
-  var trapFocus = options.trapFocus,
-      alwaysFocusable = options.alwaysFocusable;
-  var tabster = useTabster_1.useTabster(); // Initializes the modalizer and deloser APIs
-
   if (tabster) {
@@ -40,7 +38,7 @@ tabster_1.getModalizer(tabster);
 
-  var id = react_utilities_1.useId('modal-');
-  var modalAttributes = useTabsterAttributes_1.useTabsterAttributes({
+  const id = react_utilities_1.useId('modal-');
+  const modalAttributes = useTabsterAttributes_1.useTabsterAttributes({
     deloser: {},
     modalizer: {
-      id: id,
+      id,
       isOthersAccessible: !trapFocus,
@@ -50,8 +48,8 @@ isAlwaysAccessible: alwaysFocusable
   });
-  var triggerAttributes = useTabsterAttributes_1.useTabsterAttributes({
+  const triggerAttributes = useTabsterAttributes_1.useTabsterAttributes({
     deloser: {}
   });
   return {
-    modalAttributes: modalAttributes,
-    triggerAttributes: triggerAttributes
+    modalAttributes,
+    triggerAttributes
   };
@@ -58,0 +56,0 @@ };

lib-commonjs/hooks/useTabster.js

@@ -8,5 +8,5 @@ "use strict";
 
-var react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 
-var tabster_1 = /*#__PURE__*/require("tabster");
+const tabster_1 = /*#__PURE__*/require("tabster");
 /**
@@ -21,9 +21,12 @@ * Tries to get a tabster instance on the current window or creates a new one
 
-var useTabster = function () {
+const useTabster = () => {
   var _a;
 
-  var targetDocument = react_shared_contexts_1.useFluent().targetDocument;
-  var defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
-  var tabsterOptions = {
-    autoRoot: {}
+  const {
+    targetDocument
+  } = react_shared_contexts_1.useFluent();
+  const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
+  const tabsterOptions = {
+    autoRoot: {},
+    controlTab: false
   };
@@ -30,0 +33,0 @@

lib-commonjs/hooks/useTabsterAttributes.js

@@ -8,5 +8,5 @@ "use strict";
 
-var tabster_1 = /*#__PURE__*/require("tabster");
+const tabster_1 = /*#__PURE__*/require("tabster");
 
-var useTabster_1 = /*#__PURE__*/require("./useTabster");
+const useTabster_1 = /*#__PURE__*/require("./useTabster");
 /**
@@ -17,3 +17,3 @@ * Hook that returns tabster attributes while ensuring tabster exists
 
-var useTabsterAttributes = function (props) {
+const useTabsterAttributes = props => {
   // A tabster instance is not necessary to generate tabster attributes
@@ -20,0 +20,0 @@ // but calling the hook will ensure that a tabster instance exists internally and avoids consumers doing the same

lib-commonjs/index.js

@@ -7,5 +7,5 @@ "use strict";
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./hooks/index"), exports);
 //# sourceMappingURL=index.js.map

lib-commonjs/symbols.js

@@ -8,3 +8,3 @@ "use strict";
 exports.KEYBOARD_NAV_ATTRIBUTE = 'data-keyboard-nav';
-exports.KEYBOARD_NAV_SELECTOR = ":global([" + exports.KEYBOARD_NAV_ATTRIBUTE + "])";
+exports.KEYBOARD_NAV_SELECTOR = `:global([${exports.KEYBOARD_NAV_ATTRIBUTE}])`;
 //# sourceMappingURL=symbols.js.map

lib/hooks/useArrowNavigationGroup.js

@@ -9,6 +9,6 @@ import { Types, getMover } from 'tabster';
 
-export var useArrowNavigationGroup = function (options) {
+export const useArrowNavigationGroup = options => {
   var _a;
 
-  var tabster = useTabster();
+  const tabster = useTabster();
 
@@ -15,0 +15,0 @@ if (tabster) {

lib/hooks/useFocusableGroup.d.ts

 import { Types } from 'tabster';
-export declare enum FocusableGroupTabBehavior {
-    /**
-     * Tab will cycle into and out of the groupper content.
-     */
-    Unlimited,
-    /**
-     * Tab will cycle out of the container, but not into it.
-     */
-    Limited,
-    /**
-     * Tab only cycles the inner elements.
-     */
-    LimitedTrapFocus
-}
 export interface UseFocusableGroupOptions {
     /**
-     * Type of TAB key interaction.
+     * Behavior for the Tab key.
      */
-    tabBehavior?: FocusableGroupTabBehavior;
+    tabBehavior?: 'unlimited' | 'limited' | 'limitedTrapFocus';
 }
@@ -22,0 +8,0 @@ /**

lib/hooks/useFocusableGroup.js

 import { Types, getGroupper } from 'tabster';
 import { useTabsterAttributes } from './useTabsterAttributes';
 import { useTabster } from './useTabster';
-export var FocusableGroupTabBehavior;
-
-(function (FocusableGroupTabBehavior) {
-  /**
-   * Tab will cycle into and out of the groupper content.
-   */
-  FocusableGroupTabBehavior[FocusableGroupTabBehavior["Unlimited"] = Types.GroupperTabbabilities.Unlimited] = "Unlimited";
-  /**
-   * Tab will cycle out of the container, but not into it.
-   */
-
-  FocusableGroupTabBehavior[FocusableGroupTabBehavior["Limited"] = Types.GroupperTabbabilities.Limited] = "Limited";
-  /**
-   * Tab only cycles the inner elements.
-   */
-
-  FocusableGroupTabBehavior[FocusableGroupTabBehavior["LimitedTrapFocus"] = Types.GroupperTabbabilities.LimitedTrapFocus] = "LimitedTrapFocus";
-})(FocusableGroupTabBehavior || (FocusableGroupTabBehavior = {}));
 /**
@@ -27,6 +9,5 @@ * A hook that returns the necessary tabster attributes to support groupping.
 
+export const useFocusableGroup = options => {
+  const tabster = useTabster();
 
-export var useFocusableGroup = function (options) {
-  var tabster = useTabster();
-
   if (tabster) {
@@ -38,6 +19,22 @@ getGroupper(tabster);
     groupper: {
-      tabbability: options === null || options === void 0 ? void 0 : options.tabBehavior
+      tabbability: getTabbability(options === null || options === void 0 ? void 0 : options.tabBehavior)
     }
   });
 };
+
+const getTabbability = tabBehavior => {
+  switch (tabBehavior) {
+    case 'unlimited':
+      return Types.GroupperTabbabilities.Unlimited;
+
+    case 'limited':
+      return Types.GroupperTabbabilities.Limited;
+
+    case 'limitedTrapFocus':
+      return Types.GroupperTabbabilities.LimitedTrapFocus;
+
+    default:
+      return undefined;
+  }
+};
 //# sourceMappingURL=useFocusableGroup.js.map

lib/hooks/useFocusFinders.js

@@ -7,39 +7,29 @@ import * as React from 'react';
 
-export var useFocusFinders = function () {
-  var tabster = useTabster(); // Narrow props for now and let need dictate additional props in the future
+export const useFocusFinders = () => {
+  const tabster = useTabster(); // Narrow props for now and let need dictate additional props in the future
 
-  var findAllFocusable = React.useCallback(function (container, acceptCondition) {
-    return (tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findAll({
-      container: container,
-      acceptCondition: acceptCondition
-    })) || [];
-  }, [tabster]);
-  var findFirstFocusable = React.useCallback(function (container) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findFirst({
-      container: container
-    });
-  }, [tabster]);
-  var findLastFocusable = React.useCallback(function (container) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findLast({
-      container: container
-    });
-  }, [tabster]);
-  var findNextFocusable = React.useCallback(function (currentElement) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findNext({
-      currentElement: currentElement
-    });
-  }, [tabster]);
-  var findPrevFocusable = React.useCallback(function (currentElement) {
-    return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findPrev({
-      currentElement: currentElement
-    });
-  }, [tabster]);
+  const findAllFocusable = React.useCallback((container, acceptCondition) => (tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findAll({
+    container,
+    acceptCondition
+  })) || [], [tabster]);
+  const findFirstFocusable = React.useCallback(container => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findFirst({
+    container
+  }), [tabster]);
+  const findLastFocusable = React.useCallback(container => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findLast({
+    container
+  }), [tabster]);
+  const findNextFocusable = React.useCallback(currentElement => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findNext({
+    currentElement
+  }), [tabster]);
+  const findPrevFocusable = React.useCallback(currentElement => tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findPrev({
+    currentElement
+  }), [tabster]);
   return {
-    findAllFocusable: findAllFocusable,
-    findFirstFocusable: findFirstFocusable,
-    findLastFocusable: findLastFocusable,
-    findNextFocusable: findNextFocusable,
-    findPrevFocusable: findPrevFocusable
+    findAllFocusable,
+    findFirstFocusable,
+    findLastFocusable,
+    findNextFocusable,
+    findPrevFocusable
   };
 };
 //# sourceMappingURL=useFocusFinders.js.map

lib/hooks/useFocusIndicatorStyle.js

@@ -1,2 +0,1 @@
-import { __assign } from "tslib";
 import { KEYBOARD_NAV_SELECTOR } from '../symbols';
@@ -11,13 +10,15 @@ /**
 
-var getFocusOutlineStyles = function (options) {
+const getFocusOutlineStyles = options => {
   var _a, _b, _c, _d;
 
-  var outlineRadius = options.outlineRadius,
-      outlineColor = options.outlineColor,
-      outlineOffset = options.outlineOffset,
-      outlineWidth = options.outlineWidth;
-  var outlineOffsetTop = ((_a = outlineOffset) === null || _a === void 0 ? void 0 : _a.top) || outlineOffset;
-  var outlineOffsetBottom = ((_b = outlineOffset) === null || _b === void 0 ? void 0 : _b.bottom) || outlineOffset;
-  var outlineOffsetLeft = ((_c = outlineOffset) === null || _c === void 0 ? void 0 : _c.left) || outlineOffset;
-  var outlineOffsetRight = ((_d = outlineOffset) === null || _d === void 0 ? void 0 : _d.right) || outlineOffset;
+  const {
+    outlineRadius,
+    outlineColor,
+    outlineOffset,
+    outlineWidth
+  } = options;
+  const outlineOffsetTop = ((_a = outlineOffset) === null || _a === void 0 ? void 0 : _a.top) || outlineOffset;
+  const outlineOffsetBottom = ((_b = outlineOffset) === null || _b === void 0 ? void 0 : _b.bottom) || outlineOffset;
+  const outlineOffsetLeft = ((_c = outlineOffset) === null || _c === void 0 ? void 0 : _c.left) || outlineOffset;
+  const outlineOffsetRight = ((_d = outlineOffset) === null || _d === void 0 ? void 0 : _d.right) || outlineOffset;
   return {
@@ -35,6 +36,6 @@ borderColor: 'transparent',
       borderColor: outlineColor,
-      top: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetTop + ")",
-      bottom: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetBottom + ")",
-      left: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetLeft + ")",
-      right: !outlineOffset ? "-" + outlineWidth : "calc(0px - " + outlineWidth + " - " + outlineOffsetRight + ")"
+      top: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetTop})`,
+      bottom: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetBottom})`,
+      left: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetLeft})`,
+      right: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetRight})`
     }
@@ -44,3 +45,3 @@ };
 
-var defaultOptions = {
+const defaultOptions = {
   selector: 'focus'
@@ -57,22 +58,17 @@ };
 
-export var createFocusOutlineStyle = function (theme, options) {
-  var _a;
-
-  if (options === void 0) {
-    options = __assign({
-      style: {}
-    }, defaultOptions);
-  }
-
-  return _a = {
-    ':focus-visible': {
-      outline: 'none'
-    }
-  }, _a[KEYBOARD_NAV_SELECTOR + " :" + (options.selector || defaultOptions.selector)] = getFocusOutlineStyles(__assign({
+export const createFocusOutlineStyle = (theme, options = {
+  style: {},
+  ...defaultOptions
+}) => ({
+  ':focus-visible': {
+    outline: 'none'
+  },
+  [`${KEYBOARD_NAV_SELECTOR} :${options.selector || defaultOptions.selector}`]: getFocusOutlineStyles({
     outlineColor: theme.colorStrokeFocus2,
     outlineRadius: theme.borderRadiusMedium,
     // FIXME: theme.global.strokeWidth.thick causes some weird bugs
-    outlineWidth: '2px'
-  }, options.style)), _a;
-};
+    outlineWidth: '2px',
+    ...options.style
+  })
+});
 /**
@@ -85,17 +81,8 @@ * Creates a style rule for @see makeStyles that includes the necessary selectors for focus.
 
-export var createCustomFocusIndicatorStyle = function (rule, options) {
-  if (options === void 0) {
-    options = defaultOptions;
-  }
-
-  return function (theme) {
-    var _a;
-
-    return _a = {
-      ':focus-visible': {
-        outline: 'none'
-      }
-    }, _a[KEYBOARD_NAV_SELECTOR + " :" + (options.selector || defaultOptions.selector)] = typeof rule === 'function' ? rule(theme) : rule, _a;
-  };
-};
+export const createCustomFocusIndicatorStyle = (rule, options = defaultOptions) => theme => ({
+  ':focus-visible': {
+    outline: 'none'
+  },
+  [`${KEYBOARD_NAV_SELECTOR} :${options.selector || defaultOptions.selector}`]: typeof rule === 'function' ? rule(theme) : rule
+});
 //# sourceMappingURL=useFocusIndicatorStyle.js.map

lib/hooks/useKeyboardNavAttribute.js

@@ -10,19 +10,17 @@ import { createKeyborg } from 'keyborg';
 export function useKeyboardNavAttribute() {
-  var targetDocument = useFluent().targetDocument;
-  var keyborg = useMemo(function () {
-    return targetDocument && createKeyborg(targetDocument.defaultView);
-  }, [targetDocument]);
-  var ref = useRef(null);
-  useEffect(function () {
+  const {
+    targetDocument
+  } = useFluent();
+  const keyborg = useMemo(() => targetDocument && createKeyborg(targetDocument.defaultView), [targetDocument]);
+  const ref = useRef(null);
+  useEffect(() => {
     if (keyborg) {
       setBooleanAttribute(ref, KEYBOARD_NAV_ATTRIBUTE, keyborg.isNavigatingWithKeyboard());
 
-      var cb_1 = function (next) {
+      const cb = next => {
         setBooleanAttribute(ref, KEYBOARD_NAV_ATTRIBUTE, next);
       };
 
-      keyborg.subscribe(cb_1);
-      return function () {
-        return keyborg.unsubscribe(cb_1);
-      };
+      keyborg.subscribe(cb);
+      return () => keyborg.unsubscribe(cb);
     }
@@ -29,0 +27,0 @@ }, [keyborg]);

lib/hooks/useModalAttributes.js

@@ -13,11 +13,9 @@ import { useId } from '@fluentui/react-utilities';
 
-export var useModalAttributes = function (options) {
-  if (options === void 0) {
-    options = {};
-  }
+export const useModalAttributes = (options = {}) => {
+  const {
+    trapFocus,
+    alwaysFocusable
+  } = options;
+  const tabster = useTabster(); // Initializes the modalizer and deloser APIs
 
-  var trapFocus = options.trapFocus,
-      alwaysFocusable = options.alwaysFocusable;
-  var tabster = useTabster(); // Initializes the modalizer and deloser APIs
-
   if (tabster) {
@@ -28,7 +26,7 @@ getModalizer(tabster);
 
-  var id = useId('modal-');
-  var modalAttributes = useTabsterAttributes({
+  const id = useId('modal-');
+  const modalAttributes = useTabsterAttributes({
     deloser: {},
     modalizer: {
-      id: id,
+      id,
       isOthersAccessible: !trapFocus,
@@ -38,10 +36,10 @@ isAlwaysAccessible: alwaysFocusable
   });
-  var triggerAttributes = useTabsterAttributes({
+  const triggerAttributes = useTabsterAttributes({
     deloser: {}
   });
   return {
-    modalAttributes: modalAttributes,
-    triggerAttributes: triggerAttributes
+    modalAttributes,
+    triggerAttributes
   };
 };
 //# sourceMappingURL=useModalAttributes.js.map

lib/hooks/useTabster.js

@@ -11,9 +11,12 @@ import { useFluent } from '@fluentui/react-shared-contexts';
 
-export var useTabster = function () {
+export const useTabster = () => {
   var _a;
 
-  var targetDocument = useFluent().targetDocument;
-  var defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
-  var tabsterOptions = {
-    autoRoot: {}
+  const {
+    targetDocument
+  } = useFluent();
+  const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
+  const tabsterOptions = {
+    autoRoot: {},
+    controlTab: false
   };
@@ -20,0 +23,0 @@

lib/hooks/useTabsterAttributes.js

@@ -7,3 +7,3 @@ import { getTabsterAttribute } from 'tabster';
 
-export var useTabsterAttributes = function (props) {
+export const useTabsterAttributes = props => {
   // A tabster instance is not necessary to generate tabster attributes
@@ -10,0 +10,0 @@ // but calling the hook will ensure that a tabster instance exists internally and avoids consumers doing the same

lib/symbols.js

@@ -1,3 +0,3 @@
-export var KEYBOARD_NAV_ATTRIBUTE = 'data-keyboard-nav';
-export var KEYBOARD_NAV_SELECTOR = ":global([" + KEYBOARD_NAV_ATTRIBUTE + "])";
+export const KEYBOARD_NAV_ATTRIBUTE = 'data-keyboard-nav';
+export const KEYBOARD_NAV_SELECTOR = `:global([${KEYBOARD_NAV_ATTRIBUTE}])`;
 //# sourceMappingURL=symbols.js.map

package.json

 {
   "name": "@fluentui/react-tabster",
-  "version": "0.0.0-nightlya372ad979820211103.1",
+  "version": "0.0.0-nightlya54302c0b220211124.1",
   "description": "Utilities for focus management and facade for tabster",
@@ -37,8 +37,8 @@ "main": "lib-commonjs/index.js",
   "dependencies": {
-    "@fluentui/make-styles": "0.0.0-nightlya372ad979820211103.1",
-    "@fluentui/react-make-styles": "0.0.0-nightlya372ad979820211103.1",
-    "@fluentui/react-shared-contexts": "0.0.0-nightlya372ad979820211103.1",
-    "@fluentui/react-utilities": "0.0.0-nightlya372ad979820211103.1",
-    "keyborg": "^1.0.0",
-    "tabster": "^1.0.0",
+    "@fluentui/make-styles": "0.0.0-nightlya54302c0b220211124.1",
+    "@fluentui/react-make-styles": "0.0.0-nightlya54302c0b220211124.1",
+    "@fluentui/react-shared-contexts": "0.0.0-nightlya54302c0b220211124.1",
+    "@fluentui/react-utilities": "0.0.0-nightlya54302c0b220211124.0",
+    "keyborg": "^1.0.7",
+    "tabster": "^1.0.7",
     "tslib": "^2.1.0"
@@ -53,3 +53,2 @@ },
   "beachball": {
-    "tag": "beta",
     "disallowedChangeTypes": [
@@ -56,0 +55,0 @@ "major",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

165832

decreased by-1.67%

Lines of code

2807

decreased by-1.37%

Dependency changes

• + Added@fluentui/make-styles@0.0.0-nightlya54302c0b220211124.1(transitive)

• + Added@fluentui/react-make-styles@0.0.0-nightlya54302c0b220211124.1(transitive)

• + Added@fluentui/react-shared-contexts@0.0.0-nightlya54302c0b220211124.1(transitive)

• + Added@fluentui/react-theme@0.0.0-nightlya54302c0b220211124.1(transitive)

• - Removed@fluentui/keyboard-keys@0.0.0-nightlya372ad979820211103.1(transitive)

• - Removed@fluentui/make-styles@0.0.0-nightlya372ad979820211103.1(transitive)

• - Removed@fluentui/react-make-styles@0.0.0-nightlya372ad979820211103.1(transitive)

• - Removed@fluentui/react-shared-contexts@0.0.0-nightlya372ad979820211103.1(transitive)

• - Removed@fluentui/react-theme@0.0.0-nightlya372ad979820211103.1(transitive)

• - Removed@fluentui/react-utilities@0.0.0-nightlya372ad979820211103.1(transitive)

• Updated@fluentui/make-styles@0.0.0-nightlya54302c0b220211124.1

• Updated@fluentui/react-make-styles@0.0.0-nightlya54302c0b220211124.1

• Updated@fluentui/react-shared-contexts@0.0.0-nightlya54302c0b220211124.1

• Updated@fluentui/react-utilities@0.0.0-nightlya54302c0b220211124.0

• Updatedkeyborg@^1.0.7

• Updatedtabster@^1.0.7