@fluentui/react-tabster 9.0.0-rc.9 → 9.0.0

package/lib-commonjs/focus/createCustomFocusIndicatorStyle.js

@@ -18,7 +18,7 @@ const constants_1 = /*#__PURE__*/require("./constants");
 const createCustomFocusIndicatorStyle = (style, {
   selector = constants_1.defaultOptions.selector
 } = constants_1.defaultOptions) => ({
-  ':focus-visible': {
+  ':focus': {
     outlineStyle: 'none'
   },
   [`${constants_1.KEYBOARD_NAV_SELECTOR} :${selector}`]: style

package/lib-commonjs/focus/createCustomFocusIndicatorStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["focus/createCustomFocusIndicatorStyle.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;AAOA;;;;;;AAMG;;;AACI,MAAM,+BAA+B,GAAG,CAC7C,KAD6C,EAE7C;AAAE,EAAA,QAAQ,GAAG,WAAA,CAAA,cAAA,CAAe;AAA5B,IAAiF,WAAA,CAAA,cAFpC,MAG3B;AAClB,oBAAkB;AAChB,IAAA,YAAY,EAAE;AADE,GADA;AAIlB,GAAC,GAAG,WAAA,CAAA,qBAAqB,KAAK,QAAQ,EAAtC,GAA2C;AAJzB,CAH2B,CAAxC;;AAAM,OAAA,CAAA,+BAAA,GAA+B,+BAA/B","sourcesContent":["import { KEYBOARD_NAV_SELECTOR, defaultOptions } from './constants';\nimport type { GriffelStyle } from '@griffel/react';\n\nexport interface CreateCustomFocusIndicatorStyleOptions {\n  selector?: 'focus' | 'focus-within';\n}\n\n/**\n * Creates a style for @see makeStyles that includes the necessary selectors for focus.\n * Should be used only when @see createFocusOutlineStyle does not fit requirements\n *\n * @param style - styling applied on focus, defaults to @see getDefaultFocusOutlineStyes\n * @param options - Configure the style of the focus outline\n */\nexport const createCustomFocusIndicatorStyle = (\n  style: GriffelStyle,\n  { selector = defaultOptions.selector }: CreateCustomFocusIndicatorStyleOptions = defaultOptions,\n): GriffelStyle => ({\n  ':focus-visible': {\n    outlineStyle: 'none',\n  },\n  [`${KEYBOARD_NAV_SELECTOR} :${selector}`]: style,\n});\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["focus/createCustomFocusIndicatorStyle.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;AAOA;;;;;;AAMG;;;AACI,MAAM,+BAA+B,GAAG,CAC7C,KAD6C,EAE7C;EAAE,QAAQ,GAAG,WAAA,CAAA,cAAA,CAAe;AAA5B,IAAiF,WAAA,CAAA,cAFpC,MAG3B;EAClB,UAAU;IACR,YAAY,EAAE;EADN,CADQ;EAIlB,CAAC,GAAG,WAAA,CAAA,qBAAqB,KAAK,QAAQ,EAAtC,GAA2C;AAJzB,CAH2B,CAAxC;;AAAM,OAAA,CAAA,+BAAA,GAA+B,+BAA/B","sourcesContent":["import { KEYBOARD_NAV_SELECTOR, defaultOptions } from './constants';\nimport type { GriffelStyle } from '@griffel/react';\n\nexport interface CreateCustomFocusIndicatorStyleOptions {\n  selector?: 'focus' | 'focus-within';\n}\n\n/**\n * Creates a style for @see makeStyles that includes the necessary selectors for focus.\n * Should be used only when @see createFocusOutlineStyle does not fit requirements\n *\n * @param style - styling applied on focus, defaults to @see getDefaultFocusOutlineStyes\n * @param options - Configure the style of the focus outline\n */\nexport const createCustomFocusIndicatorStyle = (\n  style: GriffelStyle,\n  { selector = defaultOptions.selector }: CreateCustomFocusIndicatorStyleOptions = defaultOptions,\n): GriffelStyle => ({\n  ':focus': {\n    outlineStyle: 'none',\n  },\n  [`${KEYBOARD_NAV_SELECTOR} :${selector}`]: style,\n});\n"],"sourceRoot":"../src/"}

package/lib-commonjs/focus/createFocusOutlineStyle.js

@@ -35,7 +35,7 @@ const getFocusOutlineStyles = options => {
   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 { ...react_1.shorthands.borderColor('transparent'),
-    ':after': {
+    '::after': {
       content: '""',
       position: 'absolute',
       pointerEvents: 'none',

package/lib-commonjs/focus/createFocusOutlineStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["focus/createFocusOutlineStyle.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAEA,MAAA,iCAAA,gBAAA,OAAA,CAAA,mCAAA,CAAA;;AAIA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;AAiBA;;;;;;AAMG;;;AACH,MAAM,qBAAqB,GAAI,OAAD,IAAoD;;;AAChF,QAAM;AAAE,IAAA,aAAF;AAAiB,IAAA,YAAjB;AAA+B,IAAA,aAA/B;AAA8C,IAAA;AAA9C,MAA+D,OAArE;AAEA,QAAM,gBAAgB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,GAAvC,KAA8C,aAAvE;AACA,QAAM,mBAAmB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,MAAvC,KAAiD,aAA7E;AACA,QAAM,iBAAiB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,IAAvC,KAA+C,aAAzE;AACA,QAAM,kBAAkB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,KAAvC,KAAgD,aAA3E;AAEA,SAAO,EACL,GAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,aAAvB,CADE;AAEL,cAAU;AACR,MAAA,OAAO,EAAE,IADD;AAER,MAAA,QAAQ,EAAE,UAFF;AAGR,MAAA,aAAa,EAAE,MAHP;AAIR,MAAA,MAAM,EAAE,CAJA;AAMR,SAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,OAAvB,CANK;AAOR,SAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,YAAvB,CAPK;AAQR,SAAG,OAAA,CAAA,UAAA,CAAW,YAAX,CAAwB,aAAxB,CARK;AASR,SAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,YAAvB,CATK;AAWR,MAAA,GAAG,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,gBAAgB,GAXnF;AAYR,MAAA,MAAM,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,mBAAmB,GAZzF;AAaR,MAAA,IAAI,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,iBAAiB,GAbrF;AAcR,MAAA,KAAK,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,kBAAkB;AAdvF;AAFL,GAAP;AAmBD,CA3BD;AA6BA;;;;;;AAMG;;;AACI,MAAM,uBAAuB,GAAG,CAAC;AACtC,EAAA,QAAQ,GAAG,WAAA,CAAA,cAAA,CAAe,QADY;AAEtC,EAAA,KAAK,GAAG,WAAA,CAAA,cAAA,CAAe;AAFe,IAGJ,WAAA,CAAA,cAHG,KAIrC,iCAAA,CAAA,+BAAA,CACE,qBAAqB,CAAC;AACpB,EAAA,YAAY,EAAE,aAAA,CAAA,MAAA,CAAO,iBADD;AAEpB,EAAA,aAAa,EAAE,aAAA,CAAA,MAAA,CAAO,kBAFF;AAGpB;AACA,EAAA,YAAY,EAAE,KAJM;AAKpB,KAAG;AALiB,CAAD,CADvB,EAQE;AAAE,EAAA;AAAF,CARF,CAJK;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { shorthands } from '@griffel/react';\nimport type { GriffelStyle } from '@griffel/react';\nimport {\n  createCustomFocusIndicatorStyle,\n  CreateCustomFocusIndicatorStyleOptions,\n} from './createCustomFocusIndicatorStyle';\nimport { defaultOptions } from './constants';\n\nexport type FocusOutlineOffset = Record<'top' | 'bottom' | 'left' | 'right', string>;\nexport type FocusOutlineStyleOptions = {\n  /**\n   * Only property not supported by the native CSS `outline`, if this is no longer needed\n   * we can just go native instead\n   */\n  outlineRadius: string;\n  outlineColor: string;\n  outlineWidth: string;\n  outlineOffset?: string | FocusOutlineOffset;\n};\nexport interface CreateFocusOutlineStyleOptions extends CreateCustomFocusIndicatorStyleOptions {\n  style?: Partial<FocusOutlineStyleOptions>;\n}\n\n/**\n * NOTE: the element with the focus outline needs to have `position: relative` so that the\n * pseudo element can be properly positioned.\n *\n * @param options - Configures the style of the focus outline\n * @returns focus outline styles object\n */\nconst getFocusOutlineStyles = (options: FocusOutlineStyleOptions): GriffelStyle => {\n  const { outlineRadius, outlineColor, outlineOffset, outlineWidth } = options;\n\n  const outlineOffsetTop = (outlineOffset as FocusOutlineOffset)?.top || outlineOffset;\n  const outlineOffsetBottom = (outlineOffset as FocusOutlineOffset)?.bottom || outlineOffset;\n  const outlineOffsetLeft = (outlineOffset as FocusOutlineOffset)?.left || outlineOffset;\n  const outlineOffsetRight = (outlineOffset as FocusOutlineOffset)?.right || outlineOffset;\n\n  return {\n    ...shorthands.borderColor('transparent'),\n    ':after': {\n      content: '\"\"',\n      position: 'absolute',\n      pointerEvents: 'none',\n      zIndex: 1,\n\n      ...shorthands.borderStyle('solid'),\n      ...shorthands.borderWidth(outlineWidth),\n      ...shorthands.borderRadius(outlineRadius),\n      ...shorthands.borderColor(outlineColor),\n\n      top: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetTop})`,\n      bottom: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetBottom})`,\n      left: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetLeft})`,\n      right: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetRight})`,\n    },\n  };\n};\n\n/**\n * NOTE: The element with the focus outline needs to have `position: relative` so that the\n * pseudo element can be properly positioned.\n *\n * @param options - Configure the style of the focus outline\n * @returns focus outline styles object for @see makeStyles\n */\nexport const createFocusOutlineStyle = ({\n  selector = defaultOptions.selector,\n  style = defaultOptions.style,\n}: CreateFocusOutlineStyleOptions = defaultOptions): GriffelStyle =>\n  createCustomFocusIndicatorStyle(\n    getFocusOutlineStyles({\n      outlineColor: tokens.colorStrokeFocus2,\n      outlineRadius: tokens.borderRadiusMedium,\n      // FIXME: tokens.strokeWidthThick causes some weird bugs\n      outlineWidth: '2px',\n      ...style,\n    }),\n    { selector },\n  );\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["focus/createFocusOutlineStyle.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAEA,MAAA,iCAAA,gBAAA,OAAA,CAAA,mCAAA,CAAA;;AAIA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;AAiBA;;;;;;AAMG;;;AACH,MAAM,qBAAqB,GAAI,OAAD,IAAoD;;;EAChF,MAAM;IAAE,aAAF;IAAiB,YAAjB;IAA+B,aAA/B;IAA8C;EAA9C,IAA+D,OAArE;EAEA,MAAM,gBAAgB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,GAAvC,KAA8C,aAAvE;EACA,MAAM,mBAAmB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,MAAvC,KAAiD,aAA7E;EACA,MAAM,iBAAiB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,IAAvC,KAA+C,aAAzE;EACA,MAAM,kBAAkB,GAAG,CAAA,CAAA,EAAA,GAAC,aAAD,MAAqC,IAArC,IAAqC,EAAA,KAAA,KAAA,CAArC,GAAqC,KAAA,CAArC,GAAqC,EAAA,CAAE,KAAvC,KAAgD,aAA3E;EAEA,OAAO,EACL,GAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,aAAvB,CADE;IAEL,WAAW;MACT,OAAO,EAAE,IADA;MAET,QAAQ,EAAE,UAFD;MAGT,aAAa,EAAE,MAHN;MAIT,MAAM,EAAE,CAJC;MAMT,GAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,OAAvB,CANM;MAOT,GAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,YAAvB,CAPM;MAQT,GAAG,OAAA,CAAA,UAAA,CAAW,YAAX,CAAwB,aAAxB,CARM;MAST,GAAG,OAAA,CAAA,UAAA,CAAW,WAAX,CAAuB,YAAvB,CATM;MAWT,GAAG,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,gBAAgB,GAXlF;MAYT,MAAM,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,mBAAmB,GAZxF;MAaT,IAAI,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,iBAAiB,GAbpF;MAcT,KAAK,EAAE,CAAC,aAAD,GAAiB,IAAI,YAAY,EAAjC,GAAsC,cAAc,YAAY,MAAM,kBAAkB;IAdtF;EAFN,CAAP;AAmBD,CA3BD;AA6BA;;;;;;AAMG;;;AACI,MAAM,uBAAuB,GAAG,CAAC;EACtC,QAAQ,GAAG,WAAA,CAAA,cAAA,CAAe,QADY;EAEtC,KAAK,GAAG,WAAA,CAAA,cAAA,CAAe;AAFe,IAGJ,WAAA,CAAA,cAHG,KAIrC,iCAAA,CAAA,+BAAA,CACE,qBAAqB,CAAC;EACpB,YAAY,EAAE,aAAA,CAAA,MAAA,CAAO,iBADD;EAEpB,aAAa,EAAE,aAAA,CAAA,MAAA,CAAO,kBAFF;EAGpB;EACA,YAAY,EAAE,KAJM;EAKpB,GAAG;AALiB,CAAD,CADvB,EAQE;EAAE;AAAF,CARF,CAJK;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { shorthands } from '@griffel/react';\nimport type { GriffelStyle } from '@griffel/react';\nimport {\n  createCustomFocusIndicatorStyle,\n  CreateCustomFocusIndicatorStyleOptions,\n} from './createCustomFocusIndicatorStyle';\nimport { defaultOptions } from './constants';\n\nexport type FocusOutlineOffset = Record<'top' | 'bottom' | 'left' | 'right', string>;\nexport type FocusOutlineStyleOptions = {\n  /**\n   * Only property not supported by the native CSS `outline`, if this is no longer needed\n   * we can just go native instead\n   */\n  outlineRadius: string;\n  outlineColor: string;\n  outlineWidth: string;\n  outlineOffset?: string | FocusOutlineOffset;\n};\nexport interface CreateFocusOutlineStyleOptions extends CreateCustomFocusIndicatorStyleOptions {\n  style?: Partial<FocusOutlineStyleOptions>;\n}\n\n/**\n * NOTE: the element with the focus outline needs to have `position: relative` so that the\n * pseudo element can be properly positioned.\n *\n * @param options - Configures the style of the focus outline\n * @returns focus outline styles object\n */\nconst getFocusOutlineStyles = (options: FocusOutlineStyleOptions): GriffelStyle => {\n  const { outlineRadius, outlineColor, outlineOffset, outlineWidth } = options;\n\n  const outlineOffsetTop = (outlineOffset as FocusOutlineOffset)?.top || outlineOffset;\n  const outlineOffsetBottom = (outlineOffset as FocusOutlineOffset)?.bottom || outlineOffset;\n  const outlineOffsetLeft = (outlineOffset as FocusOutlineOffset)?.left || outlineOffset;\n  const outlineOffsetRight = (outlineOffset as FocusOutlineOffset)?.right || outlineOffset;\n\n  return {\n    ...shorthands.borderColor('transparent'),\n    '::after': {\n      content: '\"\"',\n      position: 'absolute',\n      pointerEvents: 'none',\n      zIndex: 1,\n\n      ...shorthands.borderStyle('solid'),\n      ...shorthands.borderWidth(outlineWidth),\n      ...shorthands.borderRadius(outlineRadius),\n      ...shorthands.borderColor(outlineColor),\n\n      top: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetTop})`,\n      bottom: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetBottom})`,\n      left: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetLeft})`,\n      right: !outlineOffset ? `-${outlineWidth}` : `calc(0px - ${outlineWidth} - ${outlineOffsetRight})`,\n    },\n  };\n};\n\n/**\n * NOTE: The element with the focus outline needs to have `position: relative` so that the\n * pseudo element can be properly positioned.\n *\n * @param options - Configure the style of the focus outline\n * @returns focus outline styles object for @see makeStyles\n */\nexport const createFocusOutlineStyle = ({\n  selector = defaultOptions.selector,\n  style = defaultOptions.style,\n}: CreateFocusOutlineStyleOptions = defaultOptions): GriffelStyle =>\n  createCustomFocusIndicatorStyle(\n    getFocusOutlineStyles({\n      outlineColor: tokens.colorStrokeFocus2,\n      outlineRadius: tokens.borderRadiusMedium,\n      // FIXME: tokens.strokeWidthThick causes some weird bugs\n      outlineWidth: '2px',\n      ...style,\n    }),\n    { selector },\n  );\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useArrowNavigationGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useArrowNavigationGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAuBA;;;AAGG;;;AACI,MAAM,uBAAuB,GAAI,OAAD,IAAwE;;;AAC7G,QAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB;;AAEA,MAAI,OAAJ,EAAa;AACX,IAAA,SAAA,CAAA,QAAA,CAAS,OAAT;AACD;;AAED,SAAO,sBAAA,CAAA,oBAAA,CAAqB;AAC1B,IAAA,KAAK,EAAE;AACL,MAAA,MAAM,EAAE,CAAC,EAAC,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,QAAV,CADJ;AAEL,MAAA,SAAS,EAAE,oBAAoB,CAAC,CAAA,EAAA,GAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,IAAT,MAAa,IAAb,IAAa,EAAA,KAAA,KAAA,CAAb,GAAa,EAAb,GAAiB,UAAlB,CAF1B;AAGL,MAAA,eAAe,EAAE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,eAHrB;AAIL,MAAA,QAAQ,EAAE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE;AAJd;AADmB,GAArB,CAAP;AAQD,CAfM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB;;AAiBb,SAAS,oBAAT,CAA8B,IAA9B,EAA0E;AACxE,UAAQ,IAAR;AACE,SAAK,YAAL;AACE,aAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,UAA7B;;AACF,SAAK,MAAL;AACE,aAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,IAA7B;;AAEF,SAAK,UAAL;AACA;AACE,aAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,QAA7B;AARJ;AAUD","sourcesContent":["import { Types, getMover } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { useTabster } from './useTabster';\n\nexport interface UseArrowNavigationGroupOptions {\n  /**\n   * Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally\n   * @defaultValue vertical\n   */\n  axis?: 'vertical' | 'horizontal' | 'grid';\n  /**\n   * Focus will cycle to the first/last elements of the group without stopping\n   */\n  circular?: boolean;\n  /**\n   * Last focused element in the group will be remembered and focused (if still\n   * available) when tabbing from outside of the group\n   */\n  memorizeCurrent?: boolean;\n  /**\n   * Allow tabbing within the arrow navigation group items.\n   */\n  tabbable?: boolean;\n}\n\n/**\n * A hook that returns the necessary tabster attributes to support arrow key navigation\n * @param options - Options to configure keyboard navigation\n */\nexport const useArrowNavigationGroup = (options?: UseArrowNavigationGroupOptions): Types.TabsterDOMAttribute => {\n  const tabster = useTabster();\n\n  if (tabster) {\n    getMover(tabster);\n  }\n\n  return useTabsterAttributes({\n    mover: {\n      cyclic: !!options?.circular,\n      direction: axisToMoverDirection(options?.axis ?? 'vertical'),\n      memorizeCurrent: options?.memorizeCurrent,\n      tabbable: options?.tabbable,\n    },\n  });\n};\n\nfunction axisToMoverDirection(axis: UseArrowNavigationGroupOptions['axis']): Types.MoverDirection {\n  switch (axis) {\n    case 'horizontal':\n      return Types.MoverDirections.Horizontal;\n    case 'grid':\n      return Types.MoverDirections.Grid;\n\n    case 'vertical':\n    default:\n      return Types.MoverDirections.Vertical;\n  }\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useArrowNavigationGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAuBA;;;AAGG;;;AACI,MAAM,uBAAuB,GAAI,OAAD,IAAwE;;;EAC7G,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB;;EAEA,IAAI,OAAJ,EAAa;IACX,SAAA,CAAA,QAAA,CAAS,OAAT;EACD;;EAED,OAAO,sBAAA,CAAA,oBAAA,CAAqB;IAC1B,KAAK,EAAE;MACL,MAAM,EAAE,CAAC,EAAC,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,QAAV,CADJ;MAEL,SAAS,EAAE,oBAAoB,CAAC,CAAA,EAAA,GAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,IAAT,MAAa,IAAb,IAAa,EAAA,KAAA,KAAA,CAAb,GAAa,EAAb,GAAiB,UAAlB,CAF1B;MAGL,eAAe,EAAE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,eAHrB;MAIL,QAAQ,EAAE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE;IAJd;EADmB,CAArB,CAAP;AAQD,CAfM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB;;AAiBb,SAAS,oBAAT,CAA8B,IAA9B,EAA0E;EACxE,QAAQ,IAAR;IACE,KAAK,YAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,UAA7B;;IACF,KAAK,MAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,IAA7B;;IAEF,KAAK,UAAL;IACA;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,QAA7B;EARJ;AAUD","sourcesContent":["import { Types, getMover } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { useTabster } from './useTabster';\n\nexport interface UseArrowNavigationGroupOptions {\n  /**\n   * Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally\n   * @defaultValue vertical\n   */\n  axis?: 'vertical' | 'horizontal' | 'grid';\n  /**\n   * Focus will cycle to the first/last elements of the group without stopping\n   */\n  circular?: boolean;\n  /**\n   * Last focused element in the group will be remembered and focused (if still\n   * available) when tabbing from outside of the group\n   */\n  memorizeCurrent?: boolean;\n  /**\n   * Allow tabbing within the arrow navigation group items.\n   */\n  tabbable?: boolean;\n}\n\n/**\n * A hook that returns the necessary tabster attributes to support arrow key navigation\n * @param options - Options to configure keyboard navigation\n */\nexport const useArrowNavigationGroup = (options?: UseArrowNavigationGroupOptions): Types.TabsterDOMAttribute => {\n  const tabster = useTabster();\n\n  if (tabster) {\n    getMover(tabster);\n  }\n\n  return useTabsterAttributes({\n    mover: {\n      cyclic: !!options?.circular,\n      direction: axisToMoverDirection(options?.axis ?? 'vertical'),\n      memorizeCurrent: options?.memorizeCurrent,\n      tabbable: options?.tabbable,\n    },\n  });\n};\n\nfunction axisToMoverDirection(axis: UseArrowNavigationGroupOptions['axis']): Types.MoverDirection {\n  switch (axis) {\n    case 'horizontal':\n      return Types.MoverDirections.Horizontal;\n    case 'grid':\n      return Types.MoverDirections.Grid;\n\n    case 'vertical':\n    default:\n      return Types.MoverDirections.Vertical;\n  }\n}\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useFocusFinders.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useFocusFinders.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,eAAe,GAAG,MAAK;AAClC,QAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB,CADkC,CAGlC;;AACA,QAAM,gBAAgB,GAAG,KAAK,CAAC,WAAN,CACvB,CAAC,SAAD,EAAyB,eAAzB,KACE,CAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,OAAnB,CAA2B;AAAE,IAAA,SAAF;AAAa,IAAA;AAAb,GAA3B,CAAA,KAA8D,EAFzC,EAGvB,CAAC,OAAD,CAHuB,CAAzB;AAMA,QAAM,kBAAkB,GAAG,KAAK,CAAC,WAAN,CACxB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,SAAnB,CAA6B;AAAE,IAAA;AAAF,GAA7B,CADH,EAEzB,CAAC,OAAD,CAFyB,CAA3B;AAKA,QAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CAAmB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;AAAE,IAAA;AAAF,GAA5B,CAA9C,EAA0F,CAClH,OADkH,CAA1F,CAA1B;AAIA,QAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;AAAE,IAAA,cAAF;AAAkB,OAAG;AAArB,GAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;AAMA,QAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;AAAE,IAAA,cAAF;AAAkB,OAAG;AAArB,GAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;AAMA,SAAO;AACL,IAAA,gBADK;AAEL,IAAA,kBAFK;AAGL,IAAA,iBAHK;AAIL,IAAA,iBAJK;AAKL,IAAA;AALK,GAAP;AAOD,CAtCM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element\n */\nexport const useFocusFinders = () => {\n  const tabster = useTabster();\n\n  // Narrow props for now and let need dictate additional props in the future\n  const findAllFocusable = React.useCallback(\n    (container: HTMLElement, acceptCondition: (el: HTMLElement) => boolean) =>\n      tabster?.focusable.findAll({ container, acceptCondition }) || [],\n    [tabster],\n  );\n\n  const findFirstFocusable = React.useCallback(\n    (container: HTMLElement) => tabster?.focusable.findFirst({ container }),\n    [tabster],\n  );\n\n  const findLastFocusable = React.useCallback((container: HTMLElement) => tabster?.focusable.findLast({ container }), [\n    tabster,\n  ]);\n\n  const findNextFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n      tabster?.focusable.findNext({ currentElement, ...options }),\n    [tabster],\n  );\n\n  const findPrevFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n      tabster?.focusable.findPrev({ currentElement, ...options }),\n    [tabster],\n  );\n\n  return {\n    findAllFocusable,\n    findFirstFocusable,\n    findLastFocusable,\n    findNextFocusable,\n    findPrevFocusable,\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useFocusFinders.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,eAAe,GAAG,MAAK;EAClC,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB,CADkC,CAGlC;;EACA,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAN,CACvB,CAAC,SAAD,EAAyB,eAAzB,KACE,CAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,OAAnB,CAA2B;IAAE,SAAF;IAAa;EAAb,CAA3B,CAAA,KAA8D,EAFzC,EAGvB,CAAC,OAAD,CAHuB,CAAzB;EAMA,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAN,CACxB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,SAAnB,CAA6B;IAAE;EAAF,CAA7B,CADH,EAEzB,CAAC,OAAD,CAFyB,CAA3B;EAKA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CAAmB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE;EAAF,CAA5B,CAA9C,EAA0F,CAClH,OADkH,CAA1F,CAA1B;EAIA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,OAAO;IACL,gBADK;IAEL,kBAFK;IAGL,iBAHK;IAIL,iBAJK;IAKL;EALK,CAAP;AAOD,CAtCM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element\n */\nexport const useFocusFinders = () => {\n  const tabster = useTabster();\n\n  // Narrow props for now and let need dictate additional props in the future\n  const findAllFocusable = React.useCallback(\n    (container: HTMLElement, acceptCondition: (el: HTMLElement) => boolean) =>\n      tabster?.focusable.findAll({ container, acceptCondition }) || [],\n    [tabster],\n  );\n\n  const findFirstFocusable = React.useCallback(\n    (container: HTMLElement) => tabster?.focusable.findFirst({ container }),\n    [tabster],\n  );\n\n  const findLastFocusable = React.useCallback((container: HTMLElement) => tabster?.focusable.findLast({ container }), [\n    tabster,\n  ]);\n\n  const findNextFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n      tabster?.focusable.findNext({ currentElement, ...options }),\n    [tabster],\n  );\n\n  const findPrevFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n      tabster?.focusable.findPrev({ currentElement, ...options }),\n    [tabster],\n  );\n\n  return {\n    findAllFocusable,\n    findFirstFocusable,\n    findLastFocusable,\n    findNextFocusable,\n    findPrevFocusable,\n  };\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useFocusableGroup.js

@@ -40,7 +40,7 @@ const getTabbability = tabBehavior => {
     case 'limited':
       return tabster_1.Types.GroupperTabbabilities.Limited;
 
-    case 'limitedTrapFocus':
+    case 'limited-trap-focus':
       return tabster_1.Types.GroupperTabbabilities.LimitedTrapFocus;
 
     default:

package/lib-commonjs/hooks/useFocusableGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useFocusableGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AASA;;;AAGG;;;AACI,MAAM,iBAAiB,GAAI,OAAD,IAAkE;AACjG,QAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB;;AAEA,MAAI,OAAJ,EAAa;AACX,IAAA,SAAA,CAAA,WAAA,CAAY,OAAZ;AACD;;AAED,SAAO,sBAAA,CAAA,oBAAA,CAAqB;AAC1B,IAAA,QAAQ,EAAE;AACR,MAAA,WAAW,EAAE,cAAc,CAAC,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,WAAV;AADnB;AADgB,GAArB,CAAP;AAKD,CAZM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB;;AAcb,MAAM,cAAc,GAClB,WADqB,IAEoB;AACzC,UAAQ,WAAR;AACE,SAAK,WAAL;AACE,aAAO,SAAA,CAAA,KAAA,CAAM,qBAAN,CAA4B,SAAnC;;AACF,SAAK,SAAL;AACE,aAAO,SAAA,CAAA,KAAA,CAAM,qBAAN,CAA4B,OAAnC;;AACF,SAAK,kBAAL;AACE,aAAO,SAAA,CAAA,KAAA,CAAM,qBAAN,CAA4B,gBAAnC;;AACF;AACE,aAAO,SAAP;AARJ;AAUD,CAbD","sourcesContent":["import { Types, getGroupper } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { useTabster } from './useTabster';\n\nexport interface UseFocusableGroupOptions {\n  /**\n   * Behavior for the Tab key.\n   */\n  tabBehavior?: 'unlimited' | 'limited' | 'limitedTrapFocus';\n}\n\n/**\n * A hook that returns the necessary tabster attributes to support groupping.\n * @param options - Options to configure keyboard navigation\n */\nexport const useFocusableGroup = (options?: UseFocusableGroupOptions): Types.TabsterDOMAttribute => {\n  const tabster = useTabster();\n\n  if (tabster) {\n    getGroupper(tabster);\n  }\n\n  return useTabsterAttributes({\n    groupper: {\n      tabbability: getTabbability(options?.tabBehavior),\n    },\n  });\n};\n\nconst getTabbability = (\n  tabBehavior?: UseFocusableGroupOptions['tabBehavior'],\n): Types.GroupperTabbability | undefined => {\n  switch (tabBehavior) {\n    case 'unlimited':\n      return Types.GroupperTabbabilities.Unlimited;\n    case 'limited':\n      return Types.GroupperTabbabilities.Limited;\n    case 'limitedTrapFocus':\n      return Types.GroupperTabbabilities.LimitedTrapFocus;\n    default:\n      return undefined;\n  }\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useFocusableGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AASA;;;AAGG;;;AACI,MAAM,iBAAiB,GAAI,OAAD,IAAkE;EACjG,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB;;EAEA,IAAI,OAAJ,EAAa;IACX,SAAA,CAAA,WAAA,CAAY,OAAZ;EACD;;EAED,OAAO,sBAAA,CAAA,oBAAA,CAAqB;IAC1B,QAAQ,EAAE;MACR,WAAW,EAAE,cAAc,CAAC,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,WAAV;IADnB;EADgB,CAArB,CAAP;AAKD,CAZM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB;;AAcb,MAAM,cAAc,GAClB,WADqB,IAEoB;EACzC,QAAQ,WAAR;IACE,KAAK,WAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,qBAAN,CAA4B,SAAnC;;IACF,KAAK,SAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,qBAAN,CAA4B,OAAnC;;IACF,KAAK,oBAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,qBAAN,CAA4B,gBAAnC;;IACF;MACE,OAAO,SAAP;EARJ;AAUD,CAbD","sourcesContent":["import { Types, getGroupper } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { useTabster } from './useTabster';\n\nexport interface UseFocusableGroupOptions {\n  /**\n   * Behavior for the Tab key.\n   */\n  tabBehavior?: 'unlimited' | 'limited' | 'limited-trap-focus';\n}\n\n/**\n * A hook that returns the necessary tabster attributes to support groupping.\n * @param options - Options to configure keyboard navigation\n */\nexport const useFocusableGroup = (options?: UseFocusableGroupOptions): Types.TabsterDOMAttribute => {\n  const tabster = useTabster();\n\n  if (tabster) {\n    getGroupper(tabster);\n  }\n\n  return useTabsterAttributes({\n    groupper: {\n      tabbability: getTabbability(options?.tabBehavior),\n    },\n  });\n};\n\nconst getTabbability = (\n  tabBehavior?: UseFocusableGroupOptions['tabBehavior'],\n): Types.GroupperTabbability | undefined => {\n  switch (tabBehavior) {\n    case 'unlimited':\n      return Types.GroupperTabbabilities.Unlimited;\n    case 'limited':\n      return Types.GroupperTabbabilities.Limited;\n    case 'limited-trap-focus':\n      return Types.GroupperTabbabilities.LimitedTrapFocus;\n    default:\n      return undefined;\n  }\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useKeyboardNavAttribute.js

@@ -13,14 +13,16 @@ const constants_1 = /*#__PURE__*/require("../focus/constants");
 
 const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 /**
- * instantiates keyborg and add attribute to ensure focus indicator synced to keyborg logic
+ * Instantiates [keyborg](https://github.com/microsoft/keyborg) and adds `data-keyboard-nav`
+ * attribute to a referenced element to ensure keyboard navigation awareness
+ * synced to keyborg logic without having to cause a re-render on react tree.
  */
 
 
 function useKeyboardNavAttribute() {
   const {
     targetDocument
-  } = react_shared_contexts_1.useFluent();
+  } = react_shared_contexts_1.useFluent_unstable();
   const keyborg = react_1.useMemo(() => targetDocument && keyborg_1.createKeyborg(targetDocument.defaultView), [targetDocument]);
   const ref = react_1.useRef(null);
   react_1.useEffect(() => {

package/lib-commonjs/hooks/useKeyboardNavAttribute.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useKeyboardNavAttribute.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;AAIA;;AAEG;;;AACH,SAAgB,uBAAhB,GAAuC;AACrC,QAAM;AAAE,IAAA;AAAF,MAAqB,uBAAA,CAAA,SAAA,EAA3B;AACA,QAAM,OAAO,GAAG,OAAA,CAAA,OAAA,CAAQ,MAAM,cAAc,IAAI,SAAA,CAAA,aAAA,CAAc,cAAc,CAAC,WAA7B,CAAhC,EAA4E,CAAC,cAAD,CAA5E,CAAhB;AACA,QAAM,GAAG,GAAG,OAAA,CAAA,MAAA,CAAU,IAAV,CAAZ;AACA,EAAA,OAAA,CAAA,SAAA,CAAU,MAAK;AACb,QAAI,OAAJ,EAAa;AACX,MAAA,mBAAmB,CAAC,GAAD,EAAM,WAAA,CAAA,sBAAN,EAA8B,OAAO,CAAC,wBAAR,EAA9B,CAAnB;;AACA,YAAM,EAAE,GAAoB,IAAI,IAAG;AACjC,QAAA,mBAAmB,CAAC,GAAD,EAAM,WAAA,CAAA,sBAAN,EAA8B,IAA9B,CAAnB;AACD,OAFD;;AAGA,MAAA,OAAO,CAAC,SAAR,CAAkB,EAAlB;AACA,aAAO,MAAM,OAAO,CAAC,WAAR,CAAoB,EAApB,CAAb;AACD;AACF,GATD,EASG,CAAC,OAAD,CATH;AAUA,SAAO,GAAP;AACD;;AAfD,OAAA,CAAA,uBAAA,GAAA,uBAAA;;AAiBA,SAAS,mBAAT,CAA6B,UAA7B,EAAiE,SAAjE,EAAoF,KAApF,EAAkG;AAChG,MAAI,CAAC,UAAU,CAAC,OAAhB,EAAyB;AACvB;AACD;;AACD,MAAI,KAAJ,EAAW;AACT,IAAA,UAAU,CAAC,OAAX,CAAmB,YAAnB,CAAgC,SAAhC,EAA2C,EAA3C;AACD,GAFD,MAEO;AACL,IAAA,UAAU,CAAC,OAAX,CAAmB,eAAnB,CAAmC,SAAnC;AACD;AACF","sourcesContent":["import { createKeyborg } from 'keyborg';\nimport { useEffect, useMemo, useRef } from 'react';\nimport { KEYBOARD_NAV_ATTRIBUTE } from '../focus/constants';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport type { KeyborgCallback } from 'keyborg/dist/Keyborg';\nimport type { RefObject } from 'react';\n\n/**\n * instantiates keyborg and add attribute to ensure focus indicator synced to keyborg logic\n */\nexport function useKeyboardNavAttribute<E extends HTMLElement>() {\n  const { targetDocument } = useFluent();\n  const keyborg = useMemo(() => targetDocument && createKeyborg(targetDocument.defaultView!), [targetDocument]);\n  const ref = useRef<E>(null);\n  useEffect(() => {\n    if (keyborg) {\n      setBooleanAttribute(ref, KEYBOARD_NAV_ATTRIBUTE, keyborg.isNavigatingWithKeyboard());\n      const cb: KeyborgCallback = next => {\n        setBooleanAttribute(ref, KEYBOARD_NAV_ATTRIBUTE, next);\n      };\n      keyborg.subscribe(cb);\n      return () => keyborg.unsubscribe(cb);\n    }\n  }, [keyborg]);\n  return ref;\n}\n\nfunction setBooleanAttribute(elementRef: RefObject<HTMLElement>, attribute: string, value: boolean) {\n  if (!elementRef.current) {\n    return;\n  }\n  if (value) {\n    elementRef.current.setAttribute(attribute, '');\n  } else {\n    elementRef.current.removeAttribute(attribute);\n  }\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useKeyboardNavAttribute.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;AAIA;;;;AAIG;;;AACH,SAAgB,uBAAhB,GAAuC;EACrC,MAAM;IAAE;EAAF,IAAqB,uBAAA,CAAA,kBAAA,EAA3B;EACA,MAAM,OAAO,GAAG,OAAA,CAAA,OAAA,CAAQ,MAAM,cAAc,IAAI,SAAA,CAAA,aAAA,CAAc,cAAc,CAAC,WAA7B,CAAhC,EAA4E,CAAC,cAAD,CAA5E,CAAhB;EACA,MAAM,GAAG,GAAG,OAAA,CAAA,MAAA,CAAU,IAAV,CAAZ;EACA,OAAA,CAAA,SAAA,CAAU,MAAK;IACb,IAAI,OAAJ,EAAa;MACX,mBAAmB,CAAC,GAAD,EAAM,WAAA,CAAA,sBAAN,EAA8B,OAAO,CAAC,wBAAR,EAA9B,CAAnB;;MACA,MAAM,EAAE,GAAoB,IAAI,IAAG;QACjC,mBAAmB,CAAC,GAAD,EAAM,WAAA,CAAA,sBAAN,EAA8B,IAA9B,CAAnB;MACD,CAFD;;MAGA,OAAO,CAAC,SAAR,CAAkB,EAAlB;MACA,OAAO,MAAM,OAAO,CAAC,WAAR,CAAoB,EAApB,CAAb;IACD;EACF,CATD,EASG,CAAC,OAAD,CATH;EAUA,OAAO,GAAP;AACD;;AAfD,OAAA,CAAA,uBAAA,GAAA,uBAAA;;AAiBA,SAAS,mBAAT,CAA6B,UAA7B,EAAiE,SAAjE,EAAoF,KAApF,EAAkG;EAChG,IAAI,CAAC,UAAU,CAAC,OAAhB,EAAyB;IACvB;EACD;;EACD,IAAI,KAAJ,EAAW;IACT,UAAU,CAAC,OAAX,CAAmB,YAAnB,CAAgC,SAAhC,EAA2C,EAA3C;EACD,CAFD,MAEO;IACL,UAAU,CAAC,OAAX,CAAmB,eAAnB,CAAmC,SAAnC;EACD;AACF","sourcesContent":["import { createKeyborg } from 'keyborg';\nimport { useEffect, useMemo, useRef } from 'react';\nimport { KEYBOARD_NAV_ATTRIBUTE } from '../focus/constants';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { KeyborgCallback } from 'keyborg/dist/Keyborg';\nimport type { RefObject } from 'react';\n\n/**\n * Instantiates [keyborg](https://github.com/microsoft/keyborg) and adds `data-keyboard-nav`\n * attribute to a referenced element to ensure keyboard navigation awareness\n * synced to keyborg logic without having to cause a re-render on react tree.\n */\nexport function useKeyboardNavAttribute<E extends HTMLElement>() {\n  const { targetDocument } = useFluent();\n  const keyborg = useMemo(() => targetDocument && createKeyborg(targetDocument.defaultView!), [targetDocument]);\n  const ref = useRef<E>(null);\n  useEffect(() => {\n    if (keyborg) {\n      setBooleanAttribute(ref, KEYBOARD_NAV_ATTRIBUTE, keyborg.isNavigatingWithKeyboard());\n      const cb: KeyborgCallback = next => {\n        setBooleanAttribute(ref, KEYBOARD_NAV_ATTRIBUTE, next);\n      };\n      keyborg.subscribe(cb);\n      return () => keyborg.unsubscribe(cb);\n    }\n  }, [keyborg]);\n  return ref;\n}\n\nfunction setBooleanAttribute(elementRef: RefObject<HTMLElement>, attribute: string, value: boolean) {\n  if (!elementRef.current) {\n    return;\n  }\n  if (value) {\n    elementRef.current.setAttribute(attribute, '');\n  } else {\n    elementRef.current.removeAttribute(attribute);\n  }\n}\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useModalAttributes.js

@@ -24,7 +24,8 @@ const useTabster_1 = /*#__PURE__*/require("./useTabster");
 const useModalAttributes = (options = {}) => {
   const {
     trapFocus,
-    alwaysFocusable
+    alwaysFocusable,
+    legacyTrapFocus
   } = options;
   const tabster = useTabster_1.useTabster(); // Initializes the modalizer and deloser APIs
 
@@ -39,7 +40,8 @@ const useModalAttributes = (options = {}) => {
     modalizer: {
       id,
       isOthersAccessible: !trapFocus,
-      isAlwaysAccessible: alwaysFocusable
+      isAlwaysAccessible: alwaysFocusable,
+      isTrapped: legacyTrapFocus
     }
   });
   const triggerAttributes = useTabsterAttributes_1.useTabsterAttributes({

package/lib-commonjs/hooks/useModalAttributes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useModalAttributes.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAcA;;;;;;AAMG;;;AACI,MAAM,kBAAkB,GAAG,CAChC,OAAA,GAAqC,EADL,KAE8E;AAC9G,QAAM;AAAE,IAAA,SAAF;AAAa,IAAA;AAAb,MAAiC,OAAvC;AACA,QAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB,CAF8G,CAG9G;;AACA,MAAI,OAAJ,EAAa;AACX,IAAA,SAAA,CAAA,YAAA,CAAa,OAAb;AACA,IAAA,SAAA,CAAA,UAAA,CAAW,OAAX;AACD;;AAED,QAAM,EAAE,GAAG,iBAAA,CAAA,KAAA,CAAM,QAAN,CAAX;AACA,QAAM,eAAe,GAAG,sBAAA,CAAA,oBAAA,CAAqB;AAC3C,IAAA,OAAO,EAAE,EADkC;AAE3C,IAAA,SAAS,EAAE;AAAE,MAAA,EAAF;AAAM,MAAA,kBAAkB,EAAE,CAAC,SAA3B;AAAsC,MAAA,kBAAkB,EAAE;AAA1D;AAFgC,GAArB,CAAxB;AAKA,QAAM,iBAAiB,GAAG,sBAAA,CAAA,oBAAA,CAAqB;AAC7C,IAAA,OAAO,EAAE;AADoC,GAArB,CAA1B;AAIA,SAAO;AAAE,IAAA,eAAF;AAAmB,IAAA;AAAnB,GAAP;AACD,CAtBM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourcesContent":["import { useId } from '@fluentui/react-utilities';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { getDeloser, getModalizer, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\nexport interface UseModalAttributesOptions {\n  /**\n   * Traps focus inside the elements the attributes are applied\n   */\n  trapFocus?: boolean;\n\n  /**\n   * Always reachabled in Tab order\n   */\n  alwaysFocusable?: boolean;\n}\n\n/**\n * Applies modal dialog behaviour through DOM attributes\n * Modal element will focus trap and hide other content on the page\n * The trigger element will be focused if focus is lost after the modal element is removed\n *\n * @returns DOM attributes to apply to the modal element and its trigger\n */\nexport const useModalAttributes = (\n  options: UseModalAttributesOptions = {},\n): { modalAttributes: TabsterTypes.TabsterDOMAttribute; triggerAttributes: TabsterTypes.TabsterDOMAttribute } => {\n  const { trapFocus, alwaysFocusable } = options;\n  const tabster = useTabster();\n  // Initializes the modalizer and deloser APIs\n  if (tabster) {\n    getModalizer(tabster);\n    getDeloser(tabster);\n  }\n\n  const id = useId('modal-');\n  const modalAttributes = useTabsterAttributes({\n    deloser: {},\n    modalizer: { id, isOthersAccessible: !trapFocus, isAlwaysAccessible: alwaysFocusable },\n  });\n\n  const triggerAttributes = useTabsterAttributes({\n    deloser: {},\n  });\n\n  return { modalAttributes, triggerAttributes };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useModalAttributes.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAyBA;;;;;;AAMG;;;AACI,MAAM,kBAAkB,GAAG,CAChC,OAAA,GAAqC,EADL,KAE8E;EAC9G,MAAM;IAAE,SAAF;IAAa,eAAb;IAA8B;EAA9B,IAAkD,OAAxD;EACA,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB,CAF8G,CAG9G;;EACA,IAAI,OAAJ,EAAa;IACX,SAAA,CAAA,YAAA,CAAa,OAAb;IACA,SAAA,CAAA,UAAA,CAAW,OAAX;EACD;;EAED,MAAM,EAAE,GAAG,iBAAA,CAAA,KAAA,CAAM,QAAN,CAAX;EACA,MAAM,eAAe,GAAG,sBAAA,CAAA,oBAAA,CAAqB;IAC3C,OAAO,EAAE,EADkC;IAE3C,SAAS,EAAE;MACT,EADS;MAET,kBAAkB,EAAE,CAAC,SAFZ;MAGT,kBAAkB,EAAE,eAHX;MAIT,SAAS,EAAE;IAJF;EAFgC,CAArB,CAAxB;EAUA,MAAM,iBAAiB,GAAG,sBAAA,CAAA,oBAAA,CAAqB;IAC7C,OAAO,EAAE;EADoC,CAArB,CAA1B;EAIA,OAAO;IAAE,eAAF;IAAmB;EAAnB,CAAP;AACD,CA3BM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourcesContent":["import { useId } from '@fluentui/react-utilities';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { getDeloser, getModalizer, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\nexport interface UseModalAttributesOptions {\n  /**\n   * Traps focus inside the elements the attributes are applied.\n   * Prefer this to `legacyTrapFocus`\n   * it forbids users to tab out of the focus trap into the actual browser.\n   */\n  trapFocus?: boolean;\n\n  /**\n   * Traps focus inside the elements the attributes are applied.\n   * This prop enables legacy behavior to match previous versions of Fluent and is not\n   * recommended for general use.\n   * Enabling `legacyTrapFocus` prevents users from tabbing out of the focus trap and into\n   * the actual browser. Prefer using `trapFocus` instead of this prop.\n   */\n  legacyTrapFocus?: boolean;\n\n  /**\n   * Always reachabled in Tab order\n   */\n  alwaysFocusable?: boolean;\n}\n\n/**\n * Applies modal dialog behaviour through DOM attributes\n * Modal element will focus trap and hide other content on the page\n * The trigger element will be focused if focus is lost after the modal element is removed\n *\n * @returns DOM attributes to apply to the modal element and its trigger\n */\nexport const useModalAttributes = (\n  options: UseModalAttributesOptions = {},\n): { modalAttributes: TabsterTypes.TabsterDOMAttribute; triggerAttributes: TabsterTypes.TabsterDOMAttribute } => {\n  const { trapFocus, alwaysFocusable, legacyTrapFocus } = options;\n  const tabster = useTabster();\n  // Initializes the modalizer and deloser APIs\n  if (tabster) {\n    getModalizer(tabster);\n    getDeloser(tabster);\n  }\n\n  const id = useId('modal-');\n  const modalAttributes = useTabsterAttributes({\n    deloser: {},\n    modalizer: {\n      id,\n      isOthersAccessible: !trapFocus,\n      isAlwaysAccessible: alwaysFocusable,\n      isTrapped: legacyTrapFocus,\n    },\n  });\n\n  const triggerAttributes = useTabsterAttributes({\n    deloser: {},\n  });\n\n  return { modalAttributes, triggerAttributes };\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useTabster.js

@@ -22,7 +22,7 @@ const useTabster = () => {
 
   const {
     targetDocument
-  } = react_shared_contexts_1.useFluent();
+  } = react_shared_contexts_1.useFluent_unstable();
   const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
   const tabsterOptions = {
     autoRoot: {},

package/lib-commonjs/hooks/useTabster.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useTabster.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;AAEA;;;;;;AAMG;;;AACI,MAAM,UAAU,GAAG,MAAsC;;;AAC9D,QAAM;AAAE,IAAA;AAAF,MAAqB,uBAAA,CAAA,SAAA,EAA3B;AAEA,QAAM,WAAW,GAAG,CAAA,cAAc,KAAA,IAAd,IAAA,cAAc,KAAA,KAAA,CAAd,GAAc,KAAA,CAAd,GAAA,cAAc,CAAE,WAAhB,KAA+B,SAAnD;AACA,QAAM,cAAc,GAAkC;AAAE,IAAA,QAAQ,EAAE,EAAZ;AAAgB,IAAA,UAAU,EAAE;AAA5B,GAAtD;;AAEA,MAAI,CAAC,WAAL,EAAkB;AAChB,WAAO,IAAP;AACD,GAR6D,CAU9D;;;AACA,SAAO,CAAA,EAAA,GAAA,SAAA,CAAA,iBAAA,CAAkB,WAAlB,CAAA,MAA8B,IAA9B,IAA8B,EAAA,KAAA,KAAA,CAA9B,GAA8B,EAA9B,GAAkC,SAAA,CAAA,aAAA,CAAc,WAAd,EAA2B,cAA3B,CAAzC;AACD,CAZM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourcesContent":["import { useFluent } from '@fluentui/react-shared-contexts';\nimport { getCurrentTabster, createTabster, Types as TabsterTypes } from 'tabster';\n\n/**\n * Tries to get a tabster instance on the current window or creates a new one\n * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary\n *\n * @internal\n * @returns Tabster core instance\n */\nexport const useTabster = (): TabsterTypes.TabsterCore | null => {\n  const { targetDocument } = useFluent();\n\n  const defaultView = targetDocument?.defaultView || undefined;\n  const tabsterOptions: TabsterTypes.TabsterCoreProps = { autoRoot: {}, controlTab: false };\n\n  if (!defaultView) {\n    return null;\n  }\n\n  // TODO: worth memoizing once more tabster options are used\n  return getCurrentTabster(defaultView) ?? createTabster(defaultView, tabsterOptions);\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useTabster.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;AAEA;;;;;;AAMG;;;AACI,MAAM,UAAU,GAAG,MAAsC;;;EAC9D,MAAM;IAAE;EAAF,IAAqB,uBAAA,CAAA,kBAAA,EAA3B;EAEA,MAAM,WAAW,GAAG,CAAA,cAAc,KAAA,IAAd,IAAA,cAAc,KAAA,KAAA,CAAd,GAAc,KAAA,CAAd,GAAA,cAAc,CAAE,WAAhB,KAA+B,SAAnD;EACA,MAAM,cAAc,GAAkC;IAAE,QAAQ,EAAE,EAAZ;IAAgB,UAAU,EAAE;EAA5B,CAAtD;;EAEA,IAAI,CAAC,WAAL,EAAkB;IAChB,OAAO,IAAP;EACD,CAR6D,CAU9D;;;EACA,OAAO,CAAA,EAAA,GAAA,SAAA,CAAA,iBAAA,CAAkB,WAAlB,CAAA,MAA8B,IAA9B,IAA8B,EAAA,KAAA,KAAA,CAA9B,GAA8B,EAA9B,GAAkC,SAAA,CAAA,aAAA,CAAc,WAAd,EAA2B,cAA3B,CAAzC;AACD,CAZM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourcesContent":["import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { getCurrentTabster, createTabster, Types as TabsterTypes } from 'tabster';\n\n/**\n * Tries to get a tabster instance on the current window or creates a new one\n * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary\n *\n * @internal\n * @returns Tabster core instance\n */\nexport const useTabster = (): TabsterTypes.TabsterCore | null => {\n  const { targetDocument } = useFluent();\n\n  const defaultView = targetDocument?.defaultView || undefined;\n  const tabsterOptions: TabsterTypes.TabsterCoreProps = { autoRoot: {}, controlTab: false };\n\n  if (!defaultView) {\n    return null;\n  }\n\n  // TODO: worth memoizing once more tabster options are used\n  return getCurrentTabster(defaultView) ?? createTabster(defaultView, tabsterOptions);\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useTabsterAttributes.js

@@ -9,6 +9,7 @@ const tabster_1 = /*#__PURE__*/require("tabster");
 
 const useTabster_1 = /*#__PURE__*/require("./useTabster");
 /**
+ * @internal
  * Hook that returns tabster attributes while ensuring tabster exists
  */
 

package/lib-commonjs/hooks/useTabsterAttributes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["hooks/useTabsterAttributes.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,oBAAoB,GAAI,KAAD,IAAgF;AAClH;AACA;AACA,EAAA,YAAA,CAAA,UAAA;AAEA,SAAO,SAAA,CAAA,mBAAA,CAAoB,KAApB,CAAP;AACD,CANM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import { getTabsterAttribute, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Hook that returns tabster attributes while ensuring tabster exists\n */\nexport const useTabsterAttributes = (props: TabsterTypes.TabsterAttributeProps): TabsterTypes.TabsterDOMAttribute => {\n  // A tabster instance is not necessary to generate tabster attributes\n  // but calling the hook will ensure that a tabster instance exists internally and avoids consumers doing the same\n  useTabster();\n\n  return getTabsterAttribute(props);\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["hooks/useTabsterAttributes.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;;AAGG;;;AACI,MAAM,oBAAoB,GAAI,KAAD,IAAgF;EAClH;EACA;EACA,YAAA,CAAA,UAAA;EAEA,OAAO,SAAA,CAAA,mBAAA,CAAoB,KAApB,CAAP;AACD,CANM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import { getTabsterAttribute, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * @internal\n * Hook that returns tabster attributes while ensuring tabster exists\n */\nexport const useTabsterAttributes = (props: TabsterTypes.TabsterAttributeProps): TabsterTypes.TabsterDOMAttribute => {\n  // A tabster instance is not necessary to generate tabster attributes\n  // but calling the hook will ensure that a tabster instance exists internally and avoids consumers doing the same\n  useTabster();\n\n  return getTabsterAttribute(props);\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,uBAAA;AAAuB;AAAvB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,iBAAA;AAAiB;AAAjB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,eAAA;AAAe;AAAf,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,uBAAA;AAAuB;AAAvB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,oBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,kBAAA;AAAkB;AAAlB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,oBAAA;AAAoB;AAApB,CAAA;;AAQF,IAAA,OAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iCAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,+BAAA;AAA+B;AAA/B,CAAA;AAAiC,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,uBAAA;AAAuB;AAAvB,CAAA","sourcesContent":["export {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useFocusFinders,\n  useKeyboardNavAttribute,\n  useModalAttributes,\n  useTabsterAttributes,\n} from './hooks/index';\nexport type {\n  UseArrowNavigationGroupOptions,\n  UseFocusableGroupOptions,\n  UseModalAttributesOptions,\n} from './hooks/index';\n\nexport { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';\n\nexport type {\n  CreateCustomFocusIndicatorStyleOptions,\n  CreateFocusOutlineStyleOptions,\n  FocusOutlineOffset,\n  FocusOutlineStyleOptions,\n} from './focus/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,eAAA;EAAe;AAAf,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,oBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,kBAAA;EAAkB;AAAlB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;;AAQF,IAAA,OAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iCAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,+BAAA;EAA+B;AAA/B,CAAA;AAAiC,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA","sourcesContent":["export {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useFocusFinders,\n  useKeyboardNavAttribute,\n  useModalAttributes,\n  useTabsterAttributes,\n} from './hooks/index';\nexport type {\n  UseArrowNavigationGroupOptions,\n  UseFocusableGroupOptions,\n  UseModalAttributesOptions,\n} from './hooks/index';\n\nexport { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';\n\nexport type {\n  CreateCustomFocusIndicatorStyleOptions,\n  CreateFocusOutlineStyleOptions,\n  FocusOutlineOffset,\n  FocusOutlineStyleOptions,\n} from './focus/index';\n"],"sourceRoot":"../src/"}

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@fluentui/react-tabster",
-  "version": "9.0.0-rc.9",
+  "version": "9.0.0",
   "description": "Utilities for focus management and facade for tabster",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "typings": "dist/index.d.ts",
   "sideEffects": false,
   "repository": {
     "type": "git",
@@ -15,7 +15,8 @@
     "build": "just-scripts build",
     "clean": "just-scripts clean",
     "code-style": "just-scripts code-style",
-    "e2e": "e2e",
+    "e2e": "yarn cypress run --component",
+    "e2e:local": "yarn cypress open --component",
     "just": "just-scripts",
     "lint": "just-scripts lint",
     "storybook": "node ../../../scripts/storybook/runner",
@@ -30,12 +31,12 @@
     "@fluentui/scripts": "^1.0.0"
   },
   "dependencies": {
-    "@griffel/react": "1.0.3",
-    "@fluentui/react-shared-contexts": "9.0.0-rc.7",
-    "@fluentui/react-theme": "9.0.0-rc.7",
-    "@fluentui/react-utilities": "9.0.0-rc.8",
+    "@griffel/react": "1.2.0",
+    "@fluentui/react-shared-contexts": "^9.0.0",
+    "@fluentui/react-theme": "^9.0.0",
+    "@fluentui/react-utilities": "^9.0.0",
     "keyborg": "^1.1.0",
-    "tabster": "^1.3.3",
+    "tabster": "^1.4.2",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {
@@ -46,9 +47,7 @@
   },
   "beachball": {
     "disallowedChangeTypes": [
-      "major",
-      "minor",
-      "patch"
+      "major"
     ]
   },
   "exports": {

package/lib/focus/constants.d.ts

@@ -1,6 +0,0 @@
-export declare const KEYBOARD_NAV_ATTRIBUTE: "data-keyboard-nav";
-export declare const KEYBOARD_NAV_SELECTOR: ":global([data-keyboard-nav])";
-export declare const defaultOptions: {
-    readonly style: {};
-    readonly selector: "focus";
-};

package/lib/focus/createCustomFocusIndicatorStyle.d.ts

@@ -1,12 +0,0 @@
-import type { GriffelStyle } from '@griffel/react';
-export interface CreateCustomFocusIndicatorStyleOptions {
-    selector?: 'focus' | 'focus-within';
-}
-/**
- * Creates a style for @see makeStyles that includes the necessary selectors for focus.
- * Should be used only when @see createFocusOutlineStyle does not fit requirements
- *
- * @param style - styling applied on focus, defaults to @see getDefaultFocusOutlineStyes
- * @param options - Configure the style of the focus outline
- */
-export declare const createCustomFocusIndicatorStyle: (style: GriffelStyle, { selector }?: CreateCustomFocusIndicatorStyleOptions) => GriffelStyle;

package/lib/focus/createFocusOutlineStyle.d.ts

@@ -1,24 +0,0 @@
-import type { GriffelStyle } from '@griffel/react';
-import { CreateCustomFocusIndicatorStyleOptions } from './createCustomFocusIndicatorStyle';
-export declare type FocusOutlineOffset = Record<'top' | 'bottom' | 'left' | 'right', string>;
-export declare type FocusOutlineStyleOptions = {
-    /**
-     * Only property not supported by the native CSS `outline`, if this is no longer needed
-     * we can just go native instead
-     */
-    outlineRadius: string;
-    outlineColor: string;
-    outlineWidth: string;
-    outlineOffset?: string | FocusOutlineOffset;
-};
-export interface CreateFocusOutlineStyleOptions extends CreateCustomFocusIndicatorStyleOptions {
-    style?: Partial<FocusOutlineStyleOptions>;
-}
-/**
- * NOTE: The element with the focus outline needs to have `position: relative` so that the
- * pseudo element can be properly positioned.
- *
- * @param options - Configure the style of the focus outline
- * @returns focus outline styles object for @see makeStyles
- */
-export declare const createFocusOutlineStyle: ({ selector, style, }?: CreateFocusOutlineStyleOptions) => GriffelStyle;

package/lib/focus/index.d.ts

@@ -1,2 +0,0 @@
-export * from './createCustomFocusIndicatorStyle';
-export * from './createFocusOutlineStyle';

package/lib/hooks/index.d.ts

@@ -1,6 +0,0 @@
-export * from './useArrowNavigationGroup';
-export * from './useFocusableGroup';
-export * from './useFocusFinders';
-export * from './useKeyboardNavAttribute';
-export * from './useModalAttributes';
-export * from './useTabsterAttributes';

package/lib/hooks/useArrowNavigationGroup.d.ts

@@ -1,26 +0,0 @@
-import { Types } from 'tabster';
-export interface UseArrowNavigationGroupOptions {
-    /**
-     * Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally
-     * @defaultValue vertical
-     */
-    axis?: 'vertical' | 'horizontal' | 'grid';
-    /**
-     * Focus will cycle to the first/last elements of the group without stopping
-     */
-    circular?: boolean;
-    /**
-     * Last focused element in the group will be remembered and focused (if still
-     * available) when tabbing from outside of the group
-     */
-    memorizeCurrent?: boolean;
-    /**
-     * Allow tabbing within the arrow navigation group items.
-     */
-    tabbable?: boolean;
-}
-/**
- * A hook that returns the necessary tabster attributes to support arrow key navigation
- * @param options - Options to configure keyboard navigation
- */
-export declare const useArrowNavigationGroup: (options?: UseArrowNavigationGroupOptions | undefined) => Types.TabsterDOMAttribute;

package/lib/hooks/useFocusFinders.d.ts

@@ -1,11 +0,0 @@
-import { Types as TabsterTypes } from 'tabster';
-/**
- * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element
- */
-export declare const useFocusFinders: () => {
-    findAllFocusable: (container: HTMLElement, acceptCondition: (el: HTMLElement) => boolean) => HTMLElement[];
-    findFirstFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
-    findLastFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
-    findNextFocusable: (currentElement: HTMLElement, options?: Pick<TabsterTypes.FindNextProps, 'container'>) => HTMLElement | null | undefined;
-    findPrevFocusable: (currentElement: HTMLElement, options?: Pick<TabsterTypes.FindNextProps, 'container'>) => HTMLElement | null | undefined;
-};

package/lib/hooks/useFocusableGroup.d.ts

@@ -1,12 +0,0 @@
-import { Types } from 'tabster';
-export interface UseFocusableGroupOptions {
-    /**
-     * Behavior for the Tab key.
-     */
-    tabBehavior?: 'unlimited' | 'limited' | 'limitedTrapFocus';
-}
-/**
- * A hook that returns the necessary tabster attributes to support groupping.
- * @param options - Options to configure keyboard navigation
- */
-export declare const useFocusableGroup: (options?: UseFocusableGroupOptions | undefined) => Types.TabsterDOMAttribute;

package/lib/hooks/useKeyboardNavAttribute.d.ts

@@ -1,5 +0,0 @@
-import type { RefObject } from 'react';
-/**
- * instantiates keyborg and add attribute to ensure focus indicator synced to keyborg logic
- */
-export declare function useKeyboardNavAttribute<E extends HTMLElement>(): RefObject<E>;

package/lib/hooks/useModalAttributes.d.ts

@@ -1,22 +0,0 @@
-import { Types as TabsterTypes } from 'tabster';
-export interface UseModalAttributesOptions {
-    /**
-     * Traps focus inside the elements the attributes are applied
-     */
-    trapFocus?: boolean;
-    /**
-     * Always reachabled in Tab order
-     */
-    alwaysFocusable?: boolean;
-}
-/**
- * Applies modal dialog behaviour through DOM attributes
- * Modal element will focus trap and hide other content on the page
- * The trigger element will be focused if focus is lost after the modal element is removed
- *
- * @returns DOM attributes to apply to the modal element and its trigger
- */
-export declare const useModalAttributes: (options?: UseModalAttributesOptions) => {
-    modalAttributes: TabsterTypes.TabsterDOMAttribute;
-    triggerAttributes: TabsterTypes.TabsterDOMAttribute;
-};

package/lib/hooks/useTabster.d.ts

@@ -1,9 +0,0 @@
-import { Types as TabsterTypes } from 'tabster';
-/**
- * Tries to get a tabster instance on the current window or creates a new one
- * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary
- *
- * @internal
- * @returns Tabster core instance
- */
-export declare const useTabster: () => TabsterTypes.TabsterCore | null;

package/lib/hooks/useTabsterAttributes.d.ts

@@ -1,5 +0,0 @@
-import { Types as TabsterTypes } from 'tabster';
-/**
- * Hook that returns tabster attributes while ensuring tabster exists
- */
-export declare const useTabsterAttributes: (props: TabsterTypes.TabsterAttributeProps) => TabsterTypes.TabsterDOMAttribute;

package/lib/index.d.ts

@@ -1,4 +0,0 @@
-export { useArrowNavigationGroup, useFocusableGroup, useFocusFinders, useKeyboardNavAttribute, useModalAttributes, useTabsterAttributes, } from './hooks/index';
-export type { UseArrowNavigationGroupOptions, UseFocusableGroupOptions, UseModalAttributesOptions, } from './hooks/index';
-export { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';
-export type { CreateCustomFocusIndicatorStyleOptions, CreateFocusOutlineStyleOptions, FocusOutlineOffset, FocusOutlineStyleOptions, } from './focus/index';

package/lib-commonjs/focus/constants.d.ts

@@ -1,6 +0,0 @@
-export declare const KEYBOARD_NAV_ATTRIBUTE: "data-keyboard-nav";
-export declare const KEYBOARD_NAV_SELECTOR: ":global([data-keyboard-nav])";
-export declare const defaultOptions: {
-    readonly style: {};
-    readonly selector: "focus";
-};

package/lib-commonjs/focus/createCustomFocusIndicatorStyle.d.ts

@@ -1,12 +0,0 @@
-import type { GriffelStyle } from '@griffel/react';
-export interface CreateCustomFocusIndicatorStyleOptions {
-    selector?: 'focus' | 'focus-within';
-}
-/**
- * Creates a style for @see makeStyles that includes the necessary selectors for focus.
- * Should be used only when @see createFocusOutlineStyle does not fit requirements
- *
- * @param style - styling applied on focus, defaults to @see getDefaultFocusOutlineStyes
- * @param options - Configure the style of the focus outline
- */
-export declare const createCustomFocusIndicatorStyle: (style: GriffelStyle, { selector }?: CreateCustomFocusIndicatorStyleOptions) => GriffelStyle;

package/lib-commonjs/focus/createFocusOutlineStyle.d.ts

@@ -1,24 +0,0 @@
-import type { GriffelStyle } from '@griffel/react';
-import { CreateCustomFocusIndicatorStyleOptions } from './createCustomFocusIndicatorStyle';
-export declare type FocusOutlineOffset = Record<'top' | 'bottom' | 'left' | 'right', string>;
-export declare type FocusOutlineStyleOptions = {
-    /**
-     * Only property not supported by the native CSS `outline`, if this is no longer needed
-     * we can just go native instead
-     */
-    outlineRadius: string;
-    outlineColor: string;
-    outlineWidth: string;
-    outlineOffset?: string | FocusOutlineOffset;
-};
-export interface CreateFocusOutlineStyleOptions extends CreateCustomFocusIndicatorStyleOptions {
-    style?: Partial<FocusOutlineStyleOptions>;
-}
-/**
- * NOTE: The element with the focus outline needs to have `position: relative` so that the
- * pseudo element can be properly positioned.
- *
- * @param options - Configure the style of the focus outline
- * @returns focus outline styles object for @see makeStyles
- */
-export declare const createFocusOutlineStyle: ({ selector, style, }?: CreateFocusOutlineStyleOptions) => GriffelStyle;

package/lib-commonjs/focus/index.d.ts

@@ -1,2 +0,0 @@
-export * from './createCustomFocusIndicatorStyle';
-export * from './createFocusOutlineStyle';

package/lib-commonjs/hooks/index.d.ts

@@ -1,6 +0,0 @@
-export * from './useArrowNavigationGroup';
-export * from './useFocusableGroup';
-export * from './useFocusFinders';
-export * from './useKeyboardNavAttribute';
-export * from './useModalAttributes';
-export * from './useTabsterAttributes';

package/lib-commonjs/hooks/useArrowNavigationGroup.d.ts

@@ -1,26 +0,0 @@
-import { Types } from 'tabster';
-export interface UseArrowNavigationGroupOptions {
-    /**
-     * Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally
-     * @defaultValue vertical
-     */
-    axis?: 'vertical' | 'horizontal' | 'grid';
-    /**
-     * Focus will cycle to the first/last elements of the group without stopping
-     */
-    circular?: boolean;
-    /**
-     * Last focused element in the group will be remembered and focused (if still
-     * available) when tabbing from outside of the group
-     */
-    memorizeCurrent?: boolean;
-    /**
-     * Allow tabbing within the arrow navigation group items.
-     */
-    tabbable?: boolean;
-}
-/**
- * A hook that returns the necessary tabster attributes to support arrow key navigation
- * @param options - Options to configure keyboard navigation
- */
-export declare const useArrowNavigationGroup: (options?: UseArrowNavigationGroupOptions | undefined) => Types.TabsterDOMAttribute;

package/lib-commonjs/hooks/useFocusFinders.d.ts

@@ -1,11 +0,0 @@
-import { Types as TabsterTypes } from 'tabster';
-/**
- * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element
- */
-export declare const useFocusFinders: () => {
-    findAllFocusable: (container: HTMLElement, acceptCondition: (el: HTMLElement) => boolean) => HTMLElement[];
-    findFirstFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
-    findLastFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
-    findNextFocusable: (currentElement: HTMLElement, options?: Pick<TabsterTypes.FindNextProps, 'container'>) => HTMLElement | null | undefined;
-    findPrevFocusable: (currentElement: HTMLElement, options?: Pick<TabsterTypes.FindNextProps, 'container'>) => HTMLElement | null | undefined;
-};

package/lib-commonjs/hooks/useFocusableGroup.d.ts

@@ -1,12 +0,0 @@
-import { Types } from 'tabster';
-export interface UseFocusableGroupOptions {
-    /**
-     * Behavior for the Tab key.
-     */
-    tabBehavior?: 'unlimited' | 'limited' | 'limitedTrapFocus';
-}
-/**
- * A hook that returns the necessary tabster attributes to support groupping.
- * @param options - Options to configure keyboard navigation
- */
-export declare const useFocusableGroup: (options?: UseFocusableGroupOptions | undefined) => Types.TabsterDOMAttribute;

package/lib-commonjs/hooks/useKeyboardNavAttribute.d.ts

@@ -1,5 +0,0 @@
-import type { RefObject } from 'react';
-/**
- * instantiates keyborg and add attribute to ensure focus indicator synced to keyborg logic
- */
-export declare function useKeyboardNavAttribute<E extends HTMLElement>(): RefObject<E>;