@fluentui/react-tabster 9.12.5 → 9.12.7

package/CHANGELOG.json

@@ -2,7 +2,61 @@
   "name": "@fluentui/react-tabster",
   "entries": [
     {
-      "date": "Tue, 29 Aug 2023 12:53:36 GMT",
+      "date": "Tue, 05 Sep 2023 15:35:07 GMT",
+      "tag": "@fluentui/react-tabster_v9.12.7",
+      "version": "9.12.7",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabster",
+            "comment": "Bump @fluentui/react-utilities to v9.13.2",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 05 Sep 2023 13:29:06 GMT",
+      "tag": "@fluentui/react-tabster_v9.12.6",
+      "version": "9.12.6",
+      "comments": {
+        "patch": [
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-tabster",
+            "commit": "b93c2ac22355b6cb6f33dd509c6cd9c21f4fffc8",
+            "comment": "bumps @swc/helpers version to 0.5.1"
+          },
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-tabster",
+            "commit": "eea6d93a62249ba4fba3347fb291c67ee1a3fb24",
+            "comment": "bumps react peer dependencies to v16.14.0"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabster",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.7.3",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabster",
+            "comment": "Bump @fluentui/react-theme to v9.1.12",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabster",
+            "comment": "Bump @fluentui/react-utilities to v9.13.1",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 29 Aug 2023 12:57:36 GMT",
       "tag": "@fluentui/react-tabster_v9.12.5",
       "version": "9.12.5",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,34 @@
 # Change Log - @fluentui/react-tabster
 
-This log was last generated on Tue, 29 Aug 2023 12:53:36 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Sep 2023 15:35:07 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.12.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.12.7)
+
+Tue, 05 Sep 2023 15:35:07 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.12.6..@fluentui/react-tabster_v9.12.7)
+
+### Patches
+
+- Bump @fluentui/react-utilities to v9.13.2 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+
+## [9.12.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.12.6)
+
+Tue, 05 Sep 2023 13:29:06 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.12.5..@fluentui/react-tabster_v9.12.6)
+
+### Patches
+
+- bumps @swc/helpers version to 0.5.1 ([PR #28989](https://github.com/microsoft/fluentui/pull/28989) by bernardo.sunderhus@gmail.com)
+- bumps react peer dependencies to v16.14.0 ([PR #28959](https://github.com/microsoft/fluentui/pull/28959) by bernardo.sunderhus@gmail.com)
+- Bump @fluentui/react-shared-contexts to v9.7.3 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-theme to v9.1.12 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-utilities to v9.13.1 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+
 ## [9.12.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.12.5)
 
-Tue, 29 Aug 2023 12:53:36 GMT 
+Tue, 29 Aug 2023 12:57:36 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.12.4..@fluentui/react-tabster_v9.12.5)
 
 ### Patches

package/lib/focus/createCustomFocusIndicatorStyle.js

@@ -5,7 +5,7 @@ import { defaultOptions, FOCUS_VISIBLE_ATTR, FOCUS_WITHIN_ATTR } from './constan
  *
  * @param style - styling applied on focus, defaults to @see getDefaultFocusOutlineStyles
  * @param options - Configure the style of the focus outline
- */ export function createCustomFocusIndicatorStyle(style, { selector =defaultOptions.selector  } = defaultOptions) {
+ */ export function createCustomFocusIndicatorStyle(style, { selector = defaultOptions.selector } = defaultOptions) {
     return {
         ...selector === 'focus' && {
             [`&[${FOCUS_VISIBLE_ATTR}]`]: style

package/lib/focus/createCustomFocusIndicatorStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["createCustomFocusIndicatorStyle.ts"],"sourcesContent":["import { defaultOptions, FOCUS_VISIBLE_ATTR, FOCUS_WITHIN_ATTR } from './constants';\nimport { makeResetStyles } from '@griffel/react';\nimport type { GriffelStyle } from '@griffel/react';\n\n// TODO: Use the type directly from @griffel/react\n// https://github.com/microsoft/griffel/pull/278\ntype GriffelResetStyle = Parameters<typeof makeResetStyles>[0];\n\nexport interface CreateCustomFocusIndicatorStyleOptions {\n  /**\n   * Control if the indicator appears when the corresponding element is focused,\n   * or any child is focused within the corresponding element.\n   * @default 'focus'\n   */\n  selector?: 'focus' | 'focus-within';\n  /**\n   * Enables the browser default outline style\n   * @deprecated The custom focus indicator no longer affects outline styles. Outline is overridden\n   * in the default focus indicator function, `createFocusOutlineStyle`.\n   */\n  enableOutline?: boolean;\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 getDefaultFocusOutlineStyles\n * @param options - Configure the style of the focus outline\n */\nexport function createCustomFocusIndicatorStyle<TStyle extends GriffelStyle | GriffelResetStyle>(\n  style: TStyle,\n  { selector = defaultOptions.selector }: CreateCustomFocusIndicatorStyleOptions = defaultOptions,\n): TStyle extends GriffelStyle ? GriffelStyle : GriffelResetStyle {\n  return {\n    ...(selector === 'focus' && {\n      [`&[${FOCUS_VISIBLE_ATTR}]`]: style,\n    }),\n    ...(selector === 'focus-within' && {\n      [`&[${FOCUS_WITHIN_ATTR}]:${selector}`]: style,\n    }),\n  };\n}\n"],"names":["defaultOptions","FOCUS_VISIBLE_ATTR","FOCUS_WITHIN_ATTR","createCustomFocusIndicatorStyle","style","selector"],"mappings":"AAAA,SAASA,cAAc,EAAEC,kBAAkB,EAAEC,iBAAiB,QAAQ,cAAc;AAuBpF;;;;;;CAMC,GACD,OAAO,SAASC,gCACdC,KAAa,EACb,EAAEC,UAAWL,eAAeK,QAAQ,CAAA,EAA0C,GAAGL,cAAc,EAC/B;IAChE,OAAO;QACL,GAAIK,aAAa,WAAW;YAC1B,CAAC,CAAC,EAAE,EAAEJ,mBAAmB,CAAC,CAAC,CAAC,EAAEG;QAChC,CAAC;QACD,GAAIC,aAAa,kBAAkB;YACjC,CAAC,CAAC,EAAE,EAAEH,kBAAkB,EAAE,EAAEG,SAAS,CAAC,CAAC,EAAED;QAC3C,CAAC;IACH;AACF,CAAC"}
+{"version":3,"sources":["createCustomFocusIndicatorStyle.ts"],"sourcesContent":["import { defaultOptions, FOCUS_VISIBLE_ATTR, FOCUS_WITHIN_ATTR } from './constants';\nimport { makeResetStyles } from '@griffel/react';\nimport type { GriffelStyle } from '@griffel/react';\n\n// TODO: Use the type directly from @griffel/react\n// https://github.com/microsoft/griffel/pull/278\ntype GriffelResetStyle = Parameters<typeof makeResetStyles>[0];\n\nexport interface CreateCustomFocusIndicatorStyleOptions {\n  /**\n   * Control if the indicator appears when the corresponding element is focused,\n   * or any child is focused within the corresponding element.\n   * @default 'focus'\n   */\n  selector?: 'focus' | 'focus-within';\n  /**\n   * Enables the browser default outline style\n   * @deprecated The custom focus indicator no longer affects outline styles. Outline is overridden\n   * in the default focus indicator function, `createFocusOutlineStyle`.\n   */\n  enableOutline?: boolean;\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 getDefaultFocusOutlineStyles\n * @param options - Configure the style of the focus outline\n */\nexport function createCustomFocusIndicatorStyle<TStyle extends GriffelStyle | GriffelResetStyle>(\n  style: TStyle,\n  { selector = defaultOptions.selector }: CreateCustomFocusIndicatorStyleOptions = defaultOptions,\n): TStyle extends GriffelStyle ? GriffelStyle : GriffelResetStyle {\n  return {\n    ...(selector === 'focus' && {\n      [`&[${FOCUS_VISIBLE_ATTR}]`]: style,\n    }),\n    ...(selector === 'focus-within' && {\n      [`&[${FOCUS_WITHIN_ATTR}]:${selector}`]: style,\n    }),\n  };\n}\n"],"names":["defaultOptions","FOCUS_VISIBLE_ATTR","FOCUS_WITHIN_ATTR","createCustomFocusIndicatorStyle","style","selector"],"mappings":"AAAA,SAASA,cAAc,EAAEC,kBAAkB,EAAEC,iBAAiB,QAAQ,cAAc;AAuBpF;;;;;;CAMC,GACD,OAAO,SAASC,gCACdC,KAAa,EACb,EAAEC,WAAWL,eAAeK,QAAQ,EAA0C,GAAGL,cAAc;IAE/F,OAAO;QACL,GAAIK,aAAa,WAAW;YAC1B,CAAC,CAAC,EAAE,EAAEJ,mBAAmB,CAAC,CAAC,CAAC,EAAEG;QAChC,CAAC;QACD,GAAIC,aAAa,kBAAkB;YACjC,CAAC,CAAC,EAAE,EAAEH,kBAAkB,EAAE,EAAEG,SAAS,CAAC,CAAC,EAAED;QAC3C,CAAC;IACH;AACF"}

package/lib/focus/createFocusOutlineStyle.js

@@ -8,8 +8,9 @@ import { defaultOptions } from './constants';
  * @param options - Configures the style of the focus outline
  * @param position - The position of the focus outline
  * @returns CSS value for the position of the focus outline
- */ function getOutlinePosition({ outlineWidth , outlineOffset  }, position) {
-    const offsetValue = (outlineOffset === null || outlineOffset === void 0 ? void 0 : outlineOffset[position]) || outlineOffset;
+ */ function getOutlinePosition({ outlineWidth, outlineOffset }, position) {
+    var _outlineOffset;
+    const offsetValue = ((_outlineOffset = outlineOffset) === null || _outlineOffset === void 0 ? void 0 : _outlineOffset[position]) || outlineOffset;
     if (!outlineOffset) {
         return `calc(${outlineWidth} * -1)`;
     }
@@ -22,7 +23,7 @@ import { defaultOptions } from './constants';
  * @param options - Configures the style of the focus outline
  * @returns focus outline styles object
  */ const getFocusOutlineStyles = (options)=>{
-    const { outlineRadius , outlineColor , outlineWidth  } = options;
+    const { outlineRadius, outlineColor, outlineWidth } = options;
     return {
         ...shorthands.borderColor('transparent'),
         '::after': {
@@ -47,7 +48,7 @@ import { defaultOptions } from './constants';
  *
  * @param options - Configure the style of the focus outline
  * @returns focus outline styles object for @see makeStyles
- */ export const createFocusOutlineStyle = ({ enableOutline =false , selector =defaultOptions.selector , style =defaultOptions.style  } = defaultOptions)=>({
+ */ export const createFocusOutlineStyle = ({ enableOutline = false, selector = defaultOptions.selector, style = defaultOptions.style } = defaultOptions)=>({
         ':focus': {
             outlineStyle: enableOutline ? undefined : 'none'
         },

package/lib/focus/createFocusOutlineStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["createFocusOutlineStyle.ts"],"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 Omit<CreateCustomFocusIndicatorStyleOptions, 'enableOutline'> {\n  style?: Partial<FocusOutlineStyleOptions>;\n\n  /**\n   * Enables the browser default outline style\n   */\n  enableOutline?: boolean;\n}\n\n/**\n * Get the position of the focus outline\n *\n * @param options - Configures the style of the focus outline\n * @param position - The position of the focus outline\n * @returns CSS value for the position of the focus outline\n */\nfunction getOutlinePosition(\n  { outlineWidth, outlineOffset }: FocusOutlineStyleOptions,\n  position: 'top' | 'bottom' | 'left' | 'right',\n) {\n  const offsetValue = (outlineOffset as FocusOutlineOffset)?.[position] || outlineOffset;\n\n  if (!outlineOffset) {\n    return `calc(${outlineWidth} * -1)`;\n  }\n\n  return `calc(0px - ${outlineWidth} - ${offsetValue})`;\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, outlineWidth } = options;\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: getOutlinePosition(options, 'top'),\n      right: getOutlinePosition(options, 'right'),\n      bottom: getOutlinePosition(options, 'bottom'),\n      left: getOutlinePosition(options, 'left'),\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  enableOutline = false,\n  selector = defaultOptions.selector,\n  style = defaultOptions.style,\n}: CreateFocusOutlineStyleOptions = defaultOptions): GriffelStyle => ({\n  ':focus': {\n    outlineStyle: enableOutline ? undefined : 'none',\n  },\n  ':focus-visible': {\n    outlineStyle: enableOutline ? undefined : 'none',\n  },\n\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});\n"],"names":["tokens","shorthands","createCustomFocusIndicatorStyle","defaultOptions","getOutlinePosition","outlineWidth","outlineOffset","position","offsetValue","getFocusOutlineStyles","options","outlineRadius","outlineColor","borderColor","content","pointerEvents","zIndex","borderStyle","borderWidth","borderRadius","top","right","bottom","left","createFocusOutlineStyle","enableOutline","selector","style","outlineStyle","undefined","colorStrokeFocus2","borderRadiusMedium"],"mappings":"AAAA,SAASA,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,UAAU,QAAQ,iBAAiB;AAE5C,SACEC,+BAA+B,QAE1B,oCAAoC;AAC3C,SAASC,cAAc,QAAQ,cAAc;AAsB7C;;;;;;CAMC,GACD,SAASC,mBACP,EAAEC,aAAY,EAAEC,cAAa,EAA4B,EACzDC,QAA6C,EAC7C;IACA,MAAMC,cAAc,CAAA,AAACF,0BAAAA,2BAAD,KAAA,IAAA,AAACA,aAAsC,CAACC,SAAS,AAAD,KAAKD;IAEzE,IAAI,CAACA,eAAe;QAClB,OAAO,CAAC,KAAK,EAAED,aAAa,MAAM,CAAC;IACrC,CAAC;IAED,OAAO,CAAC,WAAW,EAAEA,aAAa,GAAG,EAAEG,YAAY,CAAC,CAAC;AACvD;AAEA;;;;;;CAMC,GACD,MAAMC,wBAAwB,CAACC,UAAoD;IACjF,MAAM,EAAEC,cAAa,EAAEC,aAAY,EAAEP,aAAY,EAAE,GAAGK;IAEtD,OAAO;QACL,GAAGT,WAAWY,WAAW,CAAC,cAAc;QACxC,WAAW;YACTC,SAAS;YACTP,UAAU;YACVQ,eAAe;YACfC,QAAQ;YAER,GAAGf,WAAWgB,WAAW,CAAC,QAAQ;YAClC,GAAGhB,WAAWiB,WAAW,CAACb,aAAa;YACvC,GAAGJ,WAAWkB,YAAY,CAACR,cAAc;YACzC,GAAGV,WAAWY,WAAW,CAACD,aAAa;YAEvCQ,KAAKhB,mBAAmBM,SAAS;YACjCW,OAAOjB,mBAAmBM,SAAS;YACnCY,QAAQlB,mBAAmBM,SAAS;YACpCa,MAAMnB,mBAAmBM,SAAS;QACpC;IACF;AACF;AAEA;;;;;;CAMC,GACD,OAAO,MAAMc,0BAA0B,CAAC,EACtCC,eAAgB,KAAK,CAAA,EACrBC,UAAWvB,eAAeuB,QAAQ,CAAA,EAClCC,OAAQxB,eAAewB,KAAK,CAAA,EACG,GAAGxB,cAAc,GAAoB,CAAA;QACpE,UAAU;YACRyB,cAAcH,gBAAgBI,YAAY,MAAM;QAClD;QACA,kBAAkB;YAChBD,cAAcH,gBAAgBI,YAAY,MAAM;QAClD;QAEA,GAAG3B,gCACDO,sBAAsB;YACpBG,cAAcZ,OAAO8B,iBAAiB;YACtCnB,eAAeX,OAAO+B,kBAAkB;YACxC,wDAAwD;YACxD1B,cAAc;YACd,GAAGsB,KAAK;QACV,IACA;YAAED;QAAS,EACZ;IACH,CAAA,EAAG"}
+{"version":3,"sources":["createFocusOutlineStyle.ts"],"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 Omit<CreateCustomFocusIndicatorStyleOptions, 'enableOutline'> {\n  style?: Partial<FocusOutlineStyleOptions>;\n\n  /**\n   * Enables the browser default outline style\n   */\n  enableOutline?: boolean;\n}\n\n/**\n * Get the position of the focus outline\n *\n * @param options - Configures the style of the focus outline\n * @param position - The position of the focus outline\n * @returns CSS value for the position of the focus outline\n */\nfunction getOutlinePosition(\n  { outlineWidth, outlineOffset }: FocusOutlineStyleOptions,\n  position: 'top' | 'bottom' | 'left' | 'right',\n) {\n  const offsetValue = (outlineOffset as FocusOutlineOffset)?.[position] || outlineOffset;\n\n  if (!outlineOffset) {\n    return `calc(${outlineWidth} * -1)`;\n  }\n\n  return `calc(0px - ${outlineWidth} - ${offsetValue})`;\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, outlineWidth } = options;\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: getOutlinePosition(options, 'top'),\n      right: getOutlinePosition(options, 'right'),\n      bottom: getOutlinePosition(options, 'bottom'),\n      left: getOutlinePosition(options, 'left'),\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  enableOutline = false,\n  selector = defaultOptions.selector,\n  style = defaultOptions.style,\n}: CreateFocusOutlineStyleOptions = defaultOptions): GriffelStyle => ({\n  ':focus': {\n    outlineStyle: enableOutline ? undefined : 'none',\n  },\n  ':focus-visible': {\n    outlineStyle: enableOutline ? undefined : 'none',\n  },\n\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});\n"],"names":["tokens","shorthands","createCustomFocusIndicatorStyle","defaultOptions","getOutlinePosition","outlineWidth","outlineOffset","position","offsetValue","getFocusOutlineStyles","options","outlineRadius","outlineColor","borderColor","content","pointerEvents","zIndex","borderStyle","borderWidth","borderRadius","top","right","bottom","left","createFocusOutlineStyle","enableOutline","selector","style","outlineStyle","undefined","colorStrokeFocus2","borderRadiusMedium"],"mappings":"AAAA,SAASA,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,UAAU,QAAQ,iBAAiB;AAE5C,SACEC,+BAA+B,QAE1B,oCAAoC;AAC3C,SAASC,cAAc,QAAQ,cAAc;AAsB7C;;;;;;CAMC,GACD,SAASC,mBACP,EAAEC,YAAY,EAAEC,aAAa,EAA4B,EACzDC,QAA6C;QAExBD;IAArB,MAAME,cAAc,EAACF,iBAAAA,2BAAAA,qCAAD,AAACA,cAAsC,CAACC,SAAS,KAAID;IAEzE,IAAI,CAACA,eAAe;QAClB,OAAO,CAAC,KAAK,EAAED,aAAa,MAAM,CAAC;IACrC;IAEA,OAAO,CAAC,WAAW,EAAEA,aAAa,GAAG,EAAEG,YAAY,CAAC,CAAC;AACvD;AAEA;;;;;;CAMC,GACD,MAAMC,wBAAwB,CAACC;IAC7B,MAAM,EAAEC,aAAa,EAAEC,YAAY,EAAEP,YAAY,EAAE,GAAGK;IAEtD,OAAO;QACL,GAAGT,WAAWY,WAAW,CAAC,cAAc;QACxC,WAAW;YACTC,SAAS;YACTP,UAAU;YACVQ,eAAe;YACfC,QAAQ;YAER,GAAGf,WAAWgB,WAAW,CAAC,QAAQ;YAClC,GAAGhB,WAAWiB,WAAW,CAACb,aAAa;YACvC,GAAGJ,WAAWkB,YAAY,CAACR,cAAc;YACzC,GAAGV,WAAWY,WAAW,CAACD,aAAa;YAEvCQ,KAAKhB,mBAAmBM,SAAS;YACjCW,OAAOjB,mBAAmBM,SAAS;YACnCY,QAAQlB,mBAAmBM,SAAS;YACpCa,MAAMnB,mBAAmBM,SAAS;QACpC;IACF;AACF;AAEA;;;;;;CAMC,GACD,OAAO,MAAMc,0BAA0B,CAAC,EACtCC,gBAAgB,KAAK,EACrBC,WAAWvB,eAAeuB,QAAQ,EAClCC,QAAQxB,eAAewB,KAAK,EACG,GAAGxB,cAAc,GAAoB,CAAA;QACpE,UAAU;YACRyB,cAAcH,gBAAgBI,YAAY;QAC5C;QACA,kBAAkB;YAChBD,cAAcH,gBAAgBI,YAAY;QAC5C;QAEA,GAAG3B,gCACDO,sBAAsB;YACpBG,cAAcZ,OAAO8B,iBAAiB;YACtCnB,eAAeX,OAAO+B,kBAAkB;YACxC,wDAAwD;YACxD1B,cAAc;YACd,GAAGsB,KAAK;QACV,IACA;YAAED;QAAS,EACZ;IACH,CAAA,EAAG"}

package/lib/focus/focusVisiblePolyfill.js

@@ -61,11 +61,12 @@ function removeFocusVisibleClass(el) {
     el.removeAttribute(FOCUS_VISIBLE_ATTR);
 }
 function alreadyInScope(el) {
+    var _el;
     if (!el) {
         return false;
     }
     if (el.focusVisible) {
         return true;
     }
-    return alreadyInScope(el === null || el === void 0 ? void 0 : el.parentElement);
+    return alreadyInScope((_el = el) === null || _el === void 0 ? void 0 : _el.parentElement);
 }

package/lib/focus/focusVisiblePolyfill.js.map

@@ -1 +1 @@
-{"version":3,"sources":["focusVisiblePolyfill.ts"],"sourcesContent":["import { isHTMLElement } from '@fluentui/react-utilities';\nimport { KEYBORG_FOCUSIN, KeyborgFocusInEvent, createKeyborg, disposeKeyborg } from 'keyborg';\n\nimport { FOCUS_VISIBLE_ATTR } from './constants';\n\n/**\n * Because `addEventListener` type override falls back to 2nd definition (evt name is unknown string literal)\n * evt is being typed as a base class of MouseEvent -> `Event`.\n * This type is used to override `listener` calls to make TS happy\n */\ntype ListenerOverride = (evt: Event) => void;\n\ntype FocusVisibleState = {\n  /**\n   * Current element with focus visible in state\n   */\n  current: HTMLElement | undefined;\n};\n\ntype HTMLElementWithFocusVisibleScope = {\n  focusVisible: boolean | undefined;\n} & HTMLElement;\n\n/**\n * @internal\n * @param scope - Applies the ponyfill to all DOM children\n * @param targetWindow - window\n */\nexport function applyFocusVisiblePolyfill(scope: HTMLElement, targetWindow: Window): () => void {\n  if (alreadyInScope(scope)) {\n    // Focus visible polyfill already applied at this scope\n    return () => undefined;\n  }\n\n  const state: FocusVisibleState = {\n    current: undefined,\n  };\n\n  const keyborg = createKeyborg(targetWindow);\n\n  // When navigation mode changes remove the focus-visible selector\n  keyborg.subscribe(isNavigatingWithKeyboard => {\n    if (!isNavigatingWithKeyboard && state.current) {\n      removeFocusVisibleClass(state.current);\n      state.current = undefined;\n    }\n  });\n\n  // Keyborg's focusin event is delegated so it's only registered once on the window\n  // and contains metadata about the focus event\n  const keyborgListener = (e: KeyborgFocusInEvent) => {\n    if (state.current) {\n      removeFocusVisibleClass(state.current);\n      state.current = undefined;\n    }\n\n    if (keyborg.isNavigatingWithKeyboard() && isHTMLElement(e.target) && e.target) {\n      // Griffel can't create chained global styles so use the parent element for now\n      state.current = e.target;\n      applyFocusVisibleClass(state.current);\n    }\n  };\n\n  // Make sure that when focus leaves the scope, the focus visible class is removed\n  const blurListener = (e: FocusEvent) => {\n    if (!e.relatedTarget || (isHTMLElement(e.relatedTarget) && !scope.contains(e.relatedTarget))) {\n      if (state.current) {\n        removeFocusVisibleClass(state.current);\n        state.current = undefined;\n      }\n    }\n  };\n\n  scope.addEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n  scope.addEventListener('focusout', blurListener);\n  (scope as HTMLElementWithFocusVisibleScope).focusVisible = true;\n\n  // Return disposer\n  return () => {\n    scope.removeEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n    scope.removeEventListener('focusout', blurListener);\n    delete (scope as HTMLElementWithFocusVisibleScope).focusVisible;\n    disposeKeyborg(keyborg);\n  };\n}\n\nfunction applyFocusVisibleClass(el: HTMLElement) {\n  el.setAttribute(FOCUS_VISIBLE_ATTR, '');\n}\n\nfunction removeFocusVisibleClass(el: HTMLElement) {\n  el.removeAttribute(FOCUS_VISIBLE_ATTR);\n}\n\nfunction alreadyInScope(el: HTMLElement | null | undefined): boolean {\n  if (!el) {\n    return false;\n  }\n\n  if ((el as HTMLElementWithFocusVisibleScope).focusVisible) {\n    return true;\n  }\n\n  return alreadyInScope(el?.parentElement);\n}\n"],"names":["isHTMLElement","KEYBORG_FOCUSIN","createKeyborg","disposeKeyborg","FOCUS_VISIBLE_ATTR","applyFocusVisiblePolyfill","scope","targetWindow","alreadyInScope","undefined","state","current","keyborg","subscribe","isNavigatingWithKeyboard","removeFocusVisibleClass","keyborgListener","e","target","applyFocusVisibleClass","blurListener","relatedTarget","contains","addEventListener","focusVisible","removeEventListener","el","setAttribute","removeAttribute","parentElement"],"mappings":"AAAA,SAASA,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,eAAe,EAAuBC,aAAa,EAAEC,cAAc,QAAQ,UAAU;AAE9F,SAASC,kBAAkB,QAAQ,cAAc;AAoBjD;;;;CAIC,GACD,OAAO,SAASC,0BAA0BC,KAAkB,EAAEC,YAAoB,EAAc;IAC9F,IAAIC,eAAeF,QAAQ;QACzB,uDAAuD;QACvD,OAAO,IAAMG;IACf,CAAC;IAED,MAAMC,QAA2B;QAC/BC,SAASF;IACX;IAEA,MAAMG,UAAUV,cAAcK;IAE9B,iEAAiE;IACjEK,QAAQC,SAAS,CAACC,CAAAA,2BAA4B;QAC5C,IAAI,CAACA,4BAA4BJ,MAAMC,OAAO,EAAE;YAC9CI,wBAAwBL,MAAMC,OAAO;YACrCD,MAAMC,OAAO,GAAGF;QAClB,CAAC;IACH;IAEA,kFAAkF;IAClF,8CAA8C;IAC9C,MAAMO,kBAAkB,CAACC,IAA2B;QAClD,IAAIP,MAAMC,OAAO,EAAE;YACjBI,wBAAwBL,MAAMC,OAAO;YACrCD,MAAMC,OAAO,GAAGF;QAClB,CAAC;QAED,IAAIG,QAAQE,wBAAwB,MAAMd,cAAciB,EAAEC,MAAM,KAAKD,EAAEC,MAAM,EAAE;YAC7E,+EAA+E;YAC/ER,MAAMC,OAAO,GAAGM,EAAEC,MAAM;YACxBC,uBAAuBT,MAAMC,OAAO;QACtC,CAAC;IACH;IAEA,iFAAiF;IACjF,MAAMS,eAAe,CAACH,IAAkB;QACtC,IAAI,CAACA,EAAEI,aAAa,IAAKrB,cAAciB,EAAEI,aAAa,KAAK,CAACf,MAAMgB,QAAQ,CAACL,EAAEI,aAAa,GAAI;YAC5F,IAAIX,MAAMC,OAAO,EAAE;gBACjBI,wBAAwBL,MAAMC,OAAO;gBACrCD,MAAMC,OAAO,GAAGF;YAClB,CAAC;QACH,CAAC;IACH;IAEAH,MAAMiB,gBAAgB,CAACtB,iBAAiBe;IACxCV,MAAMiB,gBAAgB,CAAC,YAAYH;IAClCd,MAA2CkB,YAAY,GAAG,IAAI;IAE/D,kBAAkB;IAClB,OAAO,IAAM;QACXlB,MAAMmB,mBAAmB,CAACxB,iBAAiBe;QAC3CV,MAAMmB,mBAAmB,CAAC,YAAYL;QACtC,OAAO,AAACd,MAA2CkB,YAAY;QAC/DrB,eAAeS;IACjB;AACF,CAAC;AAED,SAASO,uBAAuBO,EAAe,EAAE;IAC/CA,GAAGC,YAAY,CAACvB,oBAAoB;AACtC;AAEA,SAASW,wBAAwBW,EAAe,EAAE;IAChDA,GAAGE,eAAe,CAACxB;AACrB;AAEA,SAASI,eAAekB,EAAkC,EAAW;IACnE,IAAI,CAACA,IAAI;QACP,OAAO,KAAK;IACd,CAAC;IAED,IAAI,AAACA,GAAwCF,YAAY,EAAE;QACzD,OAAO,IAAI;IACb,CAAC;IAED,OAAOhB,eAAekB,eAAAA,gBAAAA,KAAAA,IAAAA,GAAIG,aAAa;AACzC"}
+{"version":3,"sources":["focusVisiblePolyfill.ts"],"sourcesContent":["import { isHTMLElement } from '@fluentui/react-utilities';\nimport { KEYBORG_FOCUSIN, KeyborgFocusInEvent, createKeyborg, disposeKeyborg } from 'keyborg';\n\nimport { FOCUS_VISIBLE_ATTR } from './constants';\n\n/**\n * Because `addEventListener` type override falls back to 2nd definition (evt name is unknown string literal)\n * evt is being typed as a base class of MouseEvent -> `Event`.\n * This type is used to override `listener` calls to make TS happy\n */\ntype ListenerOverride = (evt: Event) => void;\n\ntype FocusVisibleState = {\n  /**\n   * Current element with focus visible in state\n   */\n  current: HTMLElement | undefined;\n};\n\ntype HTMLElementWithFocusVisibleScope = {\n  focusVisible: boolean | undefined;\n} & HTMLElement;\n\n/**\n * @internal\n * @param scope - Applies the ponyfill to all DOM children\n * @param targetWindow - window\n */\nexport function applyFocusVisiblePolyfill(scope: HTMLElement, targetWindow: Window): () => void {\n  if (alreadyInScope(scope)) {\n    // Focus visible polyfill already applied at this scope\n    return () => undefined;\n  }\n\n  const state: FocusVisibleState = {\n    current: undefined,\n  };\n\n  const keyborg = createKeyborg(targetWindow);\n\n  // When navigation mode changes remove the focus-visible selector\n  keyborg.subscribe(isNavigatingWithKeyboard => {\n    if (!isNavigatingWithKeyboard && state.current) {\n      removeFocusVisibleClass(state.current);\n      state.current = undefined;\n    }\n  });\n\n  // Keyborg's focusin event is delegated so it's only registered once on the window\n  // and contains metadata about the focus event\n  const keyborgListener = (e: KeyborgFocusInEvent) => {\n    if (state.current) {\n      removeFocusVisibleClass(state.current);\n      state.current = undefined;\n    }\n\n    if (keyborg.isNavigatingWithKeyboard() && isHTMLElement(e.target) && e.target) {\n      // Griffel can't create chained global styles so use the parent element for now\n      state.current = e.target;\n      applyFocusVisibleClass(state.current);\n    }\n  };\n\n  // Make sure that when focus leaves the scope, the focus visible class is removed\n  const blurListener = (e: FocusEvent) => {\n    if (!e.relatedTarget || (isHTMLElement(e.relatedTarget) && !scope.contains(e.relatedTarget))) {\n      if (state.current) {\n        removeFocusVisibleClass(state.current);\n        state.current = undefined;\n      }\n    }\n  };\n\n  scope.addEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n  scope.addEventListener('focusout', blurListener);\n  (scope as HTMLElementWithFocusVisibleScope).focusVisible = true;\n\n  // Return disposer\n  return () => {\n    scope.removeEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n    scope.removeEventListener('focusout', blurListener);\n    delete (scope as HTMLElementWithFocusVisibleScope).focusVisible;\n    disposeKeyborg(keyborg);\n  };\n}\n\nfunction applyFocusVisibleClass(el: HTMLElement) {\n  el.setAttribute(FOCUS_VISIBLE_ATTR, '');\n}\n\nfunction removeFocusVisibleClass(el: HTMLElement) {\n  el.removeAttribute(FOCUS_VISIBLE_ATTR);\n}\n\nfunction alreadyInScope(el: HTMLElement | null | undefined): boolean {\n  if (!el) {\n    return false;\n  }\n\n  if ((el as HTMLElementWithFocusVisibleScope).focusVisible) {\n    return true;\n  }\n\n  return alreadyInScope(el?.parentElement);\n}\n"],"names":["isHTMLElement","KEYBORG_FOCUSIN","createKeyborg","disposeKeyborg","FOCUS_VISIBLE_ATTR","applyFocusVisiblePolyfill","scope","targetWindow","alreadyInScope","undefined","state","current","keyborg","subscribe","isNavigatingWithKeyboard","removeFocusVisibleClass","keyborgListener","e","target","applyFocusVisibleClass","blurListener","relatedTarget","contains","addEventListener","focusVisible","removeEventListener","el","setAttribute","removeAttribute","parentElement"],"mappings":"AAAA,SAASA,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,eAAe,EAAuBC,aAAa,EAAEC,cAAc,QAAQ,UAAU;AAE9F,SAASC,kBAAkB,QAAQ,cAAc;AAoBjD;;;;CAIC,GACD,OAAO,SAASC,0BAA0BC,KAAkB,EAAEC,YAAoB;IAChF,IAAIC,eAAeF,QAAQ;QACzB,uDAAuD;QACvD,OAAO,IAAMG;IACf;IAEA,MAAMC,QAA2B;QAC/BC,SAASF;IACX;IAEA,MAAMG,UAAUV,cAAcK;IAE9B,iEAAiE;IACjEK,QAAQC,SAAS,CAACC,CAAAA;QAChB,IAAI,CAACA,4BAA4BJ,MAAMC,OAAO,EAAE;YAC9CI,wBAAwBL,MAAMC,OAAO;YACrCD,MAAMC,OAAO,GAAGF;QAClB;IACF;IAEA,kFAAkF;IAClF,8CAA8C;IAC9C,MAAMO,kBAAkB,CAACC;QACvB,IAAIP,MAAMC,OAAO,EAAE;YACjBI,wBAAwBL,MAAMC,OAAO;YACrCD,MAAMC,OAAO,GAAGF;QAClB;QAEA,IAAIG,QAAQE,wBAAwB,MAAMd,cAAciB,EAAEC,MAAM,KAAKD,EAAEC,MAAM,EAAE;YAC7E,+EAA+E;YAC/ER,MAAMC,OAAO,GAAGM,EAAEC,MAAM;YACxBC,uBAAuBT,MAAMC,OAAO;QACtC;IACF;IAEA,iFAAiF;IACjF,MAAMS,eAAe,CAACH;QACpB,IAAI,CAACA,EAAEI,aAAa,IAAKrB,cAAciB,EAAEI,aAAa,KAAK,CAACf,MAAMgB,QAAQ,CAACL,EAAEI,aAAa,GAAI;YAC5F,IAAIX,MAAMC,OAAO,EAAE;gBACjBI,wBAAwBL,MAAMC,OAAO;gBACrCD,MAAMC,OAAO,GAAGF;YAClB;QACF;IACF;IAEAH,MAAMiB,gBAAgB,CAACtB,iBAAiBe;IACxCV,MAAMiB,gBAAgB,CAAC,YAAYH;IAClCd,MAA2CkB,YAAY,GAAG;IAE3D,kBAAkB;IAClB,OAAO;QACLlB,MAAMmB,mBAAmB,CAACxB,iBAAiBe;QAC3CV,MAAMmB,mBAAmB,CAAC,YAAYL;QACtC,OAAO,AAACd,MAA2CkB,YAAY;QAC/DrB,eAAeS;IACjB;AACF;AAEA,SAASO,uBAAuBO,EAAe;IAC7CA,GAAGC,YAAY,CAACvB,oBAAoB;AACtC;AAEA,SAASW,wBAAwBW,EAAe;IAC9CA,GAAGE,eAAe,CAACxB;AACrB;AAEA,SAASI,eAAekB,EAAkC;QASlCA;IARtB,IAAI,CAACA,IAAI;QACP,OAAO;IACT;IAEA,IAAI,AAACA,GAAwCF,YAAY,EAAE;QACzD,OAAO;IACT;IAEA,OAAOhB,gBAAekB,MAAAA,gBAAAA,0BAAAA,IAAIG,aAAa;AACzC"}

package/lib/focus/focusWithinPolyfill.js.map

@@ -1 +1 @@
-{"version":3,"sources":["focusWithinPolyfill.ts"],"sourcesContent":["import { KEYBORG_FOCUSIN, KeyborgFocusInEvent, createKeyborg, disposeKeyborg } from 'keyborg';\nimport { FOCUS_WITHIN_ATTR } from './constants';\n\n/**\n * Because `addEventListener` type override falls back to 2nd definition (evt name is unknown string literal)\n * evt is being typed as a base class of MouseEvent -> `Event`.\n * This type is used to override `listener` calls to make TS happy\n */\ntype ListenerOverride = (evt: Event) => void;\n\n/**\n * A ponyfill that allows `:focus-within` to support visibility based on keyboard/mouse navigation\n * like `:focus-visible` https://github.com/WICG/focus-visible/issues/151\n * @returns ref to the element that uses `:focus-within` styles\n */\nexport function applyFocusWithinPolyfill(element: HTMLElement, win: Window): () => void {\n  const keyborg = createKeyborg(win);\n\n  // When navigation mode changes to mouse, remove the focus-within selector\n  keyborg.subscribe(isNavigatingWithKeyboard => {\n    if (!isNavigatingWithKeyboard) {\n      removeFocusWithinClass(element);\n    }\n  });\n\n  // Keyborg's focusin event is delegated so it's only registered once on the window\n  // and contains metadata about the focus event\n  const keyborgListener = (e: KeyborgFocusInEvent) => {\n    if (keyborg.isNavigatingWithKeyboard() && isHTMLElement(e.target)) {\n      // Griffel can't create chained global styles so use the parent element for now\n      applyFocusWithinClass(element);\n    }\n  };\n\n  // Make sure that when focus leaves the scope, the focus within class is removed\n  const blurListener = (e: FocusEvent) => {\n    if (!e.relatedTarget || (isHTMLElement(e.relatedTarget) && !element.contains(e.relatedTarget))) {\n      removeFocusWithinClass(element);\n    }\n  };\n\n  element.addEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n  element.addEventListener('focusout', blurListener);\n\n  // Return disposer\n  return () => {\n    element.removeEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n    element.removeEventListener('focusout', blurListener);\n    disposeKeyborg(keyborg);\n  };\n}\n\nfunction applyFocusWithinClass(el: HTMLElement) {\n  el.setAttribute(FOCUS_WITHIN_ATTR, '');\n}\n\nfunction removeFocusWithinClass(el: HTMLElement) {\n  el.removeAttribute(FOCUS_WITHIN_ATTR);\n}\n\nfunction isHTMLElement(target: EventTarget | null): target is HTMLElement {\n  if (!target) {\n    return false;\n  }\n  return Boolean(target && typeof target === 'object' && 'classList' in target && 'contains' in target);\n}\n"],"names":["KEYBORG_FOCUSIN","createKeyborg","disposeKeyborg","FOCUS_WITHIN_ATTR","applyFocusWithinPolyfill","element","win","keyborg","subscribe","isNavigatingWithKeyboard","removeFocusWithinClass","keyborgListener","e","isHTMLElement","target","applyFocusWithinClass","blurListener","relatedTarget","contains","addEventListener","removeEventListener","el","setAttribute","removeAttribute","Boolean"],"mappings":"AAAA,SAASA,eAAe,EAAuBC,aAAa,EAAEC,cAAc,QAAQ,UAAU;AAC9F,SAASC,iBAAiB,QAAQ,cAAc;AAShD;;;;CAIC,GACD,OAAO,SAASC,yBAAyBC,OAAoB,EAAEC,GAAW,EAAc;IACtF,MAAMC,UAAUN,cAAcK;IAE9B,0EAA0E;IAC1EC,QAAQC,SAAS,CAACC,CAAAA,2BAA4B;QAC5C,IAAI,CAACA,0BAA0B;YAC7BC,uBAAuBL;QACzB,CAAC;IACH;IAEA,kFAAkF;IAClF,8CAA8C;IAC9C,MAAMM,kBAAkB,CAACC,IAA2B;QAClD,IAAIL,QAAQE,wBAAwB,MAAMI,cAAcD,EAAEE,MAAM,GAAG;YACjE,+EAA+E;YAC/EC,sBAAsBV;QACxB,CAAC;IACH;IAEA,gFAAgF;IAChF,MAAMW,eAAe,CAACJ,IAAkB;QACtC,IAAI,CAACA,EAAEK,aAAa,IAAKJ,cAAcD,EAAEK,aAAa,KAAK,CAACZ,QAAQa,QAAQ,CAACN,EAAEK,aAAa,GAAI;YAC9FP,uBAAuBL;QACzB,CAAC;IACH;IAEAA,QAAQc,gBAAgB,CAACnB,iBAAiBW;IAC1CN,QAAQc,gBAAgB,CAAC,YAAYH;IAErC,kBAAkB;IAClB,OAAO,IAAM;QACXX,QAAQe,mBAAmB,CAACpB,iBAAiBW;QAC7CN,QAAQe,mBAAmB,CAAC,YAAYJ;QACxCd,eAAeK;IACjB;AACF,CAAC;AAED,SAASQ,sBAAsBM,EAAe,EAAE;IAC9CA,GAAGC,YAAY,CAACnB,mBAAmB;AACrC;AAEA,SAASO,uBAAuBW,EAAe,EAAE;IAC/CA,GAAGE,eAAe,CAACpB;AACrB;AAEA,SAASU,cAAcC,MAA0B,EAAyB;IACxE,IAAI,CAACA,QAAQ;QACX,OAAO,KAAK;IACd,CAAC;IACD,OAAOU,QAAQV,UAAU,OAAOA,WAAW,YAAY,eAAeA,UAAU,cAAcA;AAChG"}
+{"version":3,"sources":["focusWithinPolyfill.ts"],"sourcesContent":["import { KEYBORG_FOCUSIN, KeyborgFocusInEvent, createKeyborg, disposeKeyborg } from 'keyborg';\nimport { FOCUS_WITHIN_ATTR } from './constants';\n\n/**\n * Because `addEventListener` type override falls back to 2nd definition (evt name is unknown string literal)\n * evt is being typed as a base class of MouseEvent -> `Event`.\n * This type is used to override `listener` calls to make TS happy\n */\ntype ListenerOverride = (evt: Event) => void;\n\n/**\n * A ponyfill that allows `:focus-within` to support visibility based on keyboard/mouse navigation\n * like `:focus-visible` https://github.com/WICG/focus-visible/issues/151\n * @returns ref to the element that uses `:focus-within` styles\n */\nexport function applyFocusWithinPolyfill(element: HTMLElement, win: Window): () => void {\n  const keyborg = createKeyborg(win);\n\n  // When navigation mode changes to mouse, remove the focus-within selector\n  keyborg.subscribe(isNavigatingWithKeyboard => {\n    if (!isNavigatingWithKeyboard) {\n      removeFocusWithinClass(element);\n    }\n  });\n\n  // Keyborg's focusin event is delegated so it's only registered once on the window\n  // and contains metadata about the focus event\n  const keyborgListener = (e: KeyborgFocusInEvent) => {\n    if (keyborg.isNavigatingWithKeyboard() && isHTMLElement(e.target)) {\n      // Griffel can't create chained global styles so use the parent element for now\n      applyFocusWithinClass(element);\n    }\n  };\n\n  // Make sure that when focus leaves the scope, the focus within class is removed\n  const blurListener = (e: FocusEvent) => {\n    if (!e.relatedTarget || (isHTMLElement(e.relatedTarget) && !element.contains(e.relatedTarget))) {\n      removeFocusWithinClass(element);\n    }\n  };\n\n  element.addEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n  element.addEventListener('focusout', blurListener);\n\n  // Return disposer\n  return () => {\n    element.removeEventListener(KEYBORG_FOCUSIN, keyborgListener as ListenerOverride);\n    element.removeEventListener('focusout', blurListener);\n    disposeKeyborg(keyborg);\n  };\n}\n\nfunction applyFocusWithinClass(el: HTMLElement) {\n  el.setAttribute(FOCUS_WITHIN_ATTR, '');\n}\n\nfunction removeFocusWithinClass(el: HTMLElement) {\n  el.removeAttribute(FOCUS_WITHIN_ATTR);\n}\n\nfunction isHTMLElement(target: EventTarget | null): target is HTMLElement {\n  if (!target) {\n    return false;\n  }\n  return Boolean(target && typeof target === 'object' && 'classList' in target && 'contains' in target);\n}\n"],"names":["KEYBORG_FOCUSIN","createKeyborg","disposeKeyborg","FOCUS_WITHIN_ATTR","applyFocusWithinPolyfill","element","win","keyborg","subscribe","isNavigatingWithKeyboard","removeFocusWithinClass","keyborgListener","e","isHTMLElement","target","applyFocusWithinClass","blurListener","relatedTarget","contains","addEventListener","removeEventListener","el","setAttribute","removeAttribute","Boolean"],"mappings":"AAAA,SAASA,eAAe,EAAuBC,aAAa,EAAEC,cAAc,QAAQ,UAAU;AAC9F,SAASC,iBAAiB,QAAQ,cAAc;AAShD;;;;CAIC,GACD,OAAO,SAASC,yBAAyBC,OAAoB,EAAEC,GAAW;IACxE,MAAMC,UAAUN,cAAcK;IAE9B,0EAA0E;IAC1EC,QAAQC,SAAS,CAACC,CAAAA;QAChB,IAAI,CAACA,0BAA0B;YAC7BC,uBAAuBL;QACzB;IACF;IAEA,kFAAkF;IAClF,8CAA8C;IAC9C,MAAMM,kBAAkB,CAACC;QACvB,IAAIL,QAAQE,wBAAwB,MAAMI,cAAcD,EAAEE,MAAM,GAAG;YACjE,+EAA+E;YAC/EC,sBAAsBV;QACxB;IACF;IAEA,gFAAgF;IAChF,MAAMW,eAAe,CAACJ;QACpB,IAAI,CAACA,EAAEK,aAAa,IAAKJ,cAAcD,EAAEK,aAAa,KAAK,CAACZ,QAAQa,QAAQ,CAACN,EAAEK,aAAa,GAAI;YAC9FP,uBAAuBL;QACzB;IACF;IAEAA,QAAQc,gBAAgB,CAACnB,iBAAiBW;IAC1CN,QAAQc,gBAAgB,CAAC,YAAYH;IAErC,kBAAkB;IAClB,OAAO;QACLX,QAAQe,mBAAmB,CAACpB,iBAAiBW;QAC7CN,QAAQe,mBAAmB,CAAC,YAAYJ;QACxCd,eAAeK;IACjB;AACF;AAEA,SAASQ,sBAAsBM,EAAe;IAC5CA,GAAGC,YAAY,CAACnB,mBAAmB;AACrC;AAEA,SAASO,uBAAuBW,EAAe;IAC7CA,GAAGE,eAAe,CAACpB;AACrB;AAEA,SAASU,cAAcC,MAA0B;IAC/C,IAAI,CAACA,QAAQ;QACX,OAAO;IACT;IACA,OAAOU,QAAQV,UAAU,OAAOA,WAAW,YAAY,eAAeA,UAAU,cAAcA;AAChG"}

package/lib/hooks/useArrowNavigationGroup.js

@@ -5,8 +5,8 @@ import { useTabster } from './useTabster';
  * A hook that returns the necessary tabster attributes to support arrow key navigation
  * @param options - Options to configure keyboard navigation
  */ export const useArrowNavigationGroup = (options = {})=>{
-    const { circular , axis , memorizeCurrent , tabbable , ignoreDefaultKeydown , // eslint-disable-next-line @typescript-eslint/naming-convention
-    unstable_hasDefault  } = options;
+    const { circular, axis, memorizeCurrent, tabbable, ignoreDefaultKeydown, // eslint-disable-next-line @typescript-eslint/naming-convention
+    unstable_hasDefault } = options;
     const tabster = useTabster();
     if (tabster) {
         getMover(tabster);

package/lib/hooks/useArrowNavigationGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useArrowNavigationGroup.ts"],"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' | 'grid-linear' | 'both';\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   * Tabster should ignore default handling of keydown events\n   */\n  ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];\n  /**\n   * The default focusable item in the group will be an element with Focusable.isDefault property.\n   * Note that there is no way in \\@fluentui/react-tabster to set default focusable element,\n   * and this option is currently for internal testing purposes only.\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  unstable_hasDefault?: 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 {\n    circular,\n    axis,\n    memorizeCurrent,\n    tabbable,\n    ignoreDefaultKeydown,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_hasDefault,\n  } = options;\n  const tabster = useTabster();\n\n  if (tabster) {\n    getMover(tabster);\n  }\n\n  return useTabsterAttributes({\n    mover: {\n      cyclic: !!circular,\n      direction: axisToMoverDirection(axis ?? 'vertical'),\n      memorizeCurrent,\n      tabbable,\n      hasDefault: unstable_hasDefault,\n    },\n    ...(ignoreDefaultKeydown && {\n      focusable: {\n        ignoreKeydown: ignoreDefaultKeydown,\n      },\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    case 'grid-linear':\n      return Types.MoverDirections.GridLinear;\n    case 'both':\n      return Types.MoverDirections.Both;\n\n    case 'vertical':\n    default:\n      return Types.MoverDirections.Vertical;\n  }\n}\n"],"names":["Types","getMover","useTabsterAttributes","useTabster","useArrowNavigationGroup","options","circular","axis","memorizeCurrent","tabbable","ignoreDefaultKeydown","unstable_hasDefault","tabster","mover","cyclic","direction","axisToMoverDirection","hasDefault","focusable","ignoreKeydown","MoverDirections","Horizontal","Grid","GridLinear","Both","Vertical"],"mappings":"AAAA,SAASA,KAAK,EAAEC,QAAQ,QAAQ,UAAU;AAC1C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,UAAU,QAAQ,eAAe;AAkC1C;;;CAGC,GACD,OAAO,MAAMC,0BAA0B,CAACC,UAA0C,CAAC,CAAC,GAAgC;IAClH,MAAM,EACJC,SAAQ,EACRC,KAAI,EACJC,gBAAe,EACfC,SAAQ,EACRC,qBAAoB,EACpB,gEAAgE;IAChEC,oBAAmB,EACpB,GAAGN;IACJ,MAAMO,UAAUT;IAEhB,IAAIS,SAAS;QACXX,SAASW;IACX,CAAC;IAED,OAAOV,qBAAqB;QAC1BW,OAAO;YACLC,QAAQ,CAAC,CAACR;YACVS,WAAWC,qBAAqBT,iBAAAA,kBAAAA,OAAQ,UAAU;YAClDC;YACAC;YACAQ,YAAYN;QACd;QACA,GAAID,wBAAwB;YAC1BQ,WAAW;gBACTC,eAAeT;YACjB;QACF,CAAC;IACH;AACF,EAAE;AAEF,SAASM,qBAAqBT,IAA4C,EAAwB;IAChG,OAAQA;QACN,KAAK;YACH,OAAOP,MAAMoB,eAAe,CAACC,UAAU;QACzC,KAAK;YACH,OAAOrB,MAAMoB,eAAe,CAACE,IAAI;QACnC,KAAK;YACH,OAAOtB,MAAMoB,eAAe,CAACG,UAAU;QACzC,KAAK;YACH,OAAOvB,MAAMoB,eAAe,CAACI,IAAI;QAEnC,KAAK;QACL;YACE,OAAOxB,MAAMoB,eAAe,CAACK,QAAQ;IACzC;AACF"}
+{"version":3,"sources":["useArrowNavigationGroup.ts"],"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' | 'grid-linear' | 'both';\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   * Tabster should ignore default handling of keydown events\n   */\n  ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];\n  /**\n   * The default focusable item in the group will be an element with Focusable.isDefault property.\n   * Note that there is no way in \\@fluentui/react-tabster to set default focusable element,\n   * and this option is currently for internal testing purposes only.\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  unstable_hasDefault?: 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 {\n    circular,\n    axis,\n    memorizeCurrent,\n    tabbable,\n    ignoreDefaultKeydown,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_hasDefault,\n  } = options;\n  const tabster = useTabster();\n\n  if (tabster) {\n    getMover(tabster);\n  }\n\n  return useTabsterAttributes({\n    mover: {\n      cyclic: !!circular,\n      direction: axisToMoverDirection(axis ?? 'vertical'),\n      memorizeCurrent,\n      tabbable,\n      hasDefault: unstable_hasDefault,\n    },\n    ...(ignoreDefaultKeydown && {\n      focusable: {\n        ignoreKeydown: ignoreDefaultKeydown,\n      },\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    case 'grid-linear':\n      return Types.MoverDirections.GridLinear;\n    case 'both':\n      return Types.MoverDirections.Both;\n\n    case 'vertical':\n    default:\n      return Types.MoverDirections.Vertical;\n  }\n}\n"],"names":["Types","getMover","useTabsterAttributes","useTabster","useArrowNavigationGroup","options","circular","axis","memorizeCurrent","tabbable","ignoreDefaultKeydown","unstable_hasDefault","tabster","mover","cyclic","direction","axisToMoverDirection","hasDefault","focusable","ignoreKeydown","MoverDirections","Horizontal","Grid","GridLinear","Both","Vertical"],"mappings":"AAAA,SAASA,KAAK,EAAEC,QAAQ,QAAQ,UAAU;AAC1C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,UAAU,QAAQ,eAAe;AAkC1C;;;CAGC,GACD,OAAO,MAAMC,0BAA0B,CAACC,UAA0C,CAAC,CAAC;IAClF,MAAM,EACJC,QAAQ,EACRC,IAAI,EACJC,eAAe,EACfC,QAAQ,EACRC,oBAAoB,EACpB,gEAAgE;IAChEC,mBAAmB,EACpB,GAAGN;IACJ,MAAMO,UAAUT;IAEhB,IAAIS,SAAS;QACXX,SAASW;IACX;IAEA,OAAOV,qBAAqB;QAC1BW,OAAO;YACLC,QAAQ,CAAC,CAACR;YACVS,WAAWC,qBAAqBT,iBAAAA,kBAAAA,OAAQ;YACxCC;YACAC;YACAQ,YAAYN;QACd;QACA,GAAID,wBAAwB;YAC1BQ,WAAW;gBACTC,eAAeT;YACjB;QACF,CAAC;IACH;AACF,EAAE;AAEF,SAASM,qBAAqBT,IAA4C;IACxE,OAAQA;QACN,KAAK;YACH,OAAOP,MAAMoB,eAAe,CAACC,UAAU;QACzC,KAAK;YACH,OAAOrB,MAAMoB,eAAe,CAACE,IAAI;QACnC,KAAK;YACH,OAAOtB,MAAMoB,eAAe,CAACG,UAAU;QACzC,KAAK;YACH,OAAOvB,MAAMoB,eAAe,CAACI,IAAI;QAEnC,KAAK;QACL;YACE,OAAOxB,MAAMoB,eAAe,CAACK,QAAQ;IACzC;AACF"}

package/lib/hooks/useFocusFinders.js

@@ -5,10 +5,11 @@ import { useTabster } from './useTabster';
  * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element
  */ export const useFocusFinders = ()=>{
     const tabster = useTabster();
-    const { targetDocument  } = useFluent();
+    const { targetDocument } = useFluent();
     // Narrow props for now and let need dictate additional props in the future
     const findAllFocusable = React.useCallback((container, acceptCondition)=>{
-        return (tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findAll({
+        var _tabster;
+        return ((_tabster = tabster) === null || _tabster === void 0 ? void 0 : _tabster.focusable.findAll({
             container,
             acceptCondition
         })) || [];
@@ -16,14 +17,16 @@ import { useTabster } from './useTabster';
         tabster
     ]);
     const findFirstFocusable = React.useCallback((container)=>{
-        return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findFirst({
+        var _tabster;
+        return (_tabster = tabster) === null || _tabster === void 0 ? void 0 : _tabster.focusable.findFirst({
             container
         });
     }, [
         tabster
     ]);
     const findLastFocusable = React.useCallback((container)=>{
-        return tabster === null || tabster === void 0 ? void 0 : tabster.focusable.findLast({
+        var _tabster;
+        return (_tabster = tabster) === null || _tabster === void 0 ? void 0 : _tabster.focusable.findLast({
             container
         });
     }, [
@@ -33,7 +36,7 @@ import { useTabster } from './useTabster';
         if (!tabster || !targetDocument) {
             return null;
         }
-        const { container =targetDocument.body  } = options;
+        const { container = targetDocument.body } = options;
         return tabster.focusable.findNext({
             currentElement,
             container
@@ -46,7 +49,7 @@ import { useTabster } from './useTabster';
         if (!tabster || !targetDocument) {
             return null;
         }
-        const { container =targetDocument.body  } = options;
+        const { container = targetDocument.body } = options;
         return tabster.focusable.findPrev({
             currentElement,
             container

package/lib/hooks/useFocusFinders.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFocusFinders.ts"],"sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\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  const { targetDocument } = useFluent();\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(\n    (container: HTMLElement) => tabster?.focusable.findLast({ container }),\n    [tabster],\n  );\n\n  const findNextFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<Partial<TabsterTypes.FindNextProps>, 'container'> = {}) => {\n      if (!tabster || !targetDocument) {\n        return null;\n      }\n\n      const { container = targetDocument.body } = options;\n\n      return tabster.focusable.findNext({ currentElement, container });\n    },\n    [tabster, targetDocument],\n  );\n\n  const findPrevFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<Partial<TabsterTypes.FindNextProps>, 'container'> = {}) => {\n      if (!tabster || !targetDocument) {\n        return null;\n      }\n\n      const { container = targetDocument.body } = options;\n\n      return tabster.focusable.findPrev({ currentElement, container });\n    },\n    [tabster, targetDocument],\n  );\n\n  return {\n    findAllFocusable,\n    findFirstFocusable,\n    findLastFocusable,\n    findNextFocusable,\n    findPrevFocusable,\n  };\n};\n"],"names":["React","useFluent_unstable","useFluent","useTabster","useFocusFinders","tabster","targetDocument","findAllFocusable","useCallback","container","acceptCondition","focusable","findAll","findFirstFocusable","findFirst","findLastFocusable","findLast","findNextFocusable","currentElement","options","body","findNext","findPrevFocusable","findPrev"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,UAAU,QAAQ,eAAe;AAE1C;;CAEC,GACD,OAAO,MAAMC,kBAAkB,IAAM;IACnC,MAAMC,UAAUF;IAChB,MAAM,EAAEG,eAAc,EAAE,GAAGJ;IAE3B,2EAA2E;IAC3E,MAAMK,mBAAmBP,MAAMQ,WAAW,CACxC,CAACC,WAAwBC;QACvBL,OAAAA,CAAAA,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASM,SAAS,CAACC,OAAO,CAAC;YAAEH;YAAWC;QAAgB,EAAE,AAAD,KAAK,EAAE;OAClE;QAACL;KAAQ;IAGX,MAAMQ,qBAAqBb,MAAMQ,WAAW,CAC1C,CAACC;QAA2BJ,OAAAA,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASM,SAAS,CAACG,SAAS,CAAC;YAAEL;QAAU,EAAE;OACvE;QAACJ;KAAQ;IAGX,MAAMU,oBAAoBf,MAAMQ,WAAW,CACzC,CAACC;QAA2BJ,OAAAA,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASM,SAAS,CAACK,QAAQ,CAAC;YAAEP;QAAU,EAAE;OACtE;QAACJ;KAAQ;IAGX,MAAMY,oBAAoBjB,MAAMQ,WAAW,CACzC,CAACU,gBAA6BC,UAAkE,CAAC,CAAC,GAAK;QACrG,IAAI,CAACd,WAAW,CAACC,gBAAgB;YAC/B,OAAO,IAAI;QACb,CAAC;QAED,MAAM,EAAEG,WAAYH,eAAec,IAAI,CAAA,EAAE,GAAGD;QAE5C,OAAOd,QAAQM,SAAS,CAACU,QAAQ,CAAC;YAAEH;YAAgBT;QAAU;IAChE,GACA;QAACJ;QAASC;KAAe;IAG3B,MAAMgB,oBAAoBtB,MAAMQ,WAAW,CACzC,CAACU,gBAA6BC,UAAkE,CAAC,CAAC,GAAK;QACrG,IAAI,CAACd,WAAW,CAACC,gBAAgB;YAC/B,OAAO,IAAI;QACb,CAAC;QAED,MAAM,EAAEG,WAAYH,eAAec,IAAI,CAAA,EAAE,GAAGD;QAE5C,OAAOd,QAAQM,SAAS,CAACY,QAAQ,CAAC;YAAEL;YAAgBT;QAAU;IAChE,GACA;QAACJ;QAASC;KAAe;IAG3B,OAAO;QACLC;QACAM;QACAE;QACAE;QACAK;IACF;AACF,EAAE"}
+{"version":3,"sources":["useFocusFinders.ts"],"sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\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  const { targetDocument } = useFluent();\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(\n    (container: HTMLElement) => tabster?.focusable.findLast({ container }),\n    [tabster],\n  );\n\n  const findNextFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<Partial<TabsterTypes.FindNextProps>, 'container'> = {}) => {\n      if (!tabster || !targetDocument) {\n        return null;\n      }\n\n      const { container = targetDocument.body } = options;\n\n      return tabster.focusable.findNext({ currentElement, container });\n    },\n    [tabster, targetDocument],\n  );\n\n  const findPrevFocusable = React.useCallback(\n    (currentElement: HTMLElement, options: Pick<Partial<TabsterTypes.FindNextProps>, 'container'> = {}) => {\n      if (!tabster || !targetDocument) {\n        return null;\n      }\n\n      const { container = targetDocument.body } = options;\n\n      return tabster.focusable.findPrev({ currentElement, container });\n    },\n    [tabster, targetDocument],\n  );\n\n  return {\n    findAllFocusable,\n    findFirstFocusable,\n    findLastFocusable,\n    findNextFocusable,\n    findPrevFocusable,\n  };\n};\n"],"names":["React","useFluent_unstable","useFluent","useTabster","useFocusFinders","tabster","targetDocument","findAllFocusable","useCallback","container","acceptCondition","focusable","findAll","findFirstFocusable","findFirst","findLastFocusable","findLast","findNextFocusable","currentElement","options","body","findNext","findPrevFocusable","findPrev"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,UAAU,QAAQ,eAAe;AAE1C;;CAEC,GACD,OAAO,MAAMC,kBAAkB;IAC7B,MAAMC,UAAUF;IAChB,MAAM,EAAEG,cAAc,EAAE,GAAGJ;IAE3B,2EAA2E;IAC3E,MAAMK,mBAAmBP,MAAMQ,WAAW,CACxC,CAACC,WAAwBC;YACvBL;eAAAA,EAAAA,WAAAA,qBAAAA,+BAAAA,SAASM,SAAS,CAACC,OAAO,CAAC;YAAEH;YAAWC;QAAgB,OAAM,EAAE;OAClE;QAACL;KAAQ;IAGX,MAAMQ,qBAAqBb,MAAMQ,WAAW,CAC1C,CAACC;YAA2BJ;gBAAAA,WAAAA,qBAAAA,+BAAAA,SAASM,SAAS,CAACG,SAAS,CAAC;YAAEL;QAAU;OACrE;QAACJ;KAAQ;IAGX,MAAMU,oBAAoBf,MAAMQ,WAAW,CACzC,CAACC;YAA2BJ;gBAAAA,WAAAA,qBAAAA,+BAAAA,SAASM,SAAS,CAACK,QAAQ,CAAC;YAAEP;QAAU;OACpE;QAACJ;KAAQ;IAGX,MAAMY,oBAAoBjB,MAAMQ,WAAW,CACzC,CAACU,gBAA6BC,UAAkE,CAAC,CAAC;QAChG,IAAI,CAACd,WAAW,CAACC,gBAAgB;YAC/B,OAAO;QACT;QAEA,MAAM,EAAEG,YAAYH,eAAec,IAAI,EAAE,GAAGD;QAE5C,OAAOd,QAAQM,SAAS,CAACU,QAAQ,CAAC;YAAEH;YAAgBT;QAAU;IAChE,GACA;QAACJ;QAASC;KAAe;IAG3B,MAAMgB,oBAAoBtB,MAAMQ,WAAW,CACzC,CAACU,gBAA6BC,UAAkE,CAAC,CAAC;QAChG,IAAI,CAACd,WAAW,CAACC,gBAAgB;YAC/B,OAAO;QACT;QAEA,MAAM,EAAEG,YAAYH,eAAec,IAAI,EAAE,GAAGD;QAE5C,OAAOd,QAAQM,SAAS,CAACY,QAAQ,CAAC;YAAEL;YAAgBT;QAAU;IAChE,GACA;QAACJ;QAASC;KAAe;IAG3B,OAAO;QACLC;QACAM;QACAE;QACAE;QACAK;IACF;AACF,EAAE"}

package/lib/hooks/useFocusObserved.js

@@ -6,7 +6,7 @@ import { useTabster } from './useTabster';
  * @param name - The observed element to focus
  * @returns Function that will focus the
  */ export function useFocusObserved(name, options = {}) {
-    const { timeout =1000  } = options;
+    const { timeout = 1000 } = options;
     const tabster = useTabster();
     const observedAPI = tabster ? getObservedElement(tabster) : null;
     return React.useCallback(()=>{

package/lib/hooks/useFocusObserved.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFocusObserved.ts"],"sourcesContent":["import * as React from 'react';\nimport { getObservedElement, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\ninterface UseFocusObservedOptions {\n  /**\n   * After timeout the focus attempt fails\n   */\n  timeout?: number;\n}\n\n/**\n *\n * @param name - The observed element to focus\n * @returns Function that will focus the\n */\nexport function useFocusObserved(\n  name: string,\n  options: UseFocusObservedOptions = {},\n): () => TabsterTypes.ObservedElementAsyncRequest<boolean> {\n  const { timeout = 1000 } = options;\n  const tabster = useTabster();\n\n  const observedAPI = tabster ? getObservedElement(tabster) : null;\n\n  return React.useCallback(() => {\n    if (observedAPI) {\n      return observedAPI.requestFocus(name, timeout);\n    }\n\n    return { result: Promise.resolve(false), cancel: () => null };\n  }, [observedAPI, name, timeout]);\n}\n"],"names":["React","getObservedElement","useTabster","useFocusObserved","name","options","timeout","tabster","observedAPI","useCallback","requestFocus","result","Promise","resolve","cancel"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAA+B,UAAU;AACpE,SAASC,UAAU,QAAQ,eAAe;AAS1C;;;;CAIC,GACD,OAAO,SAASC,iBACdC,IAAY,EACZC,UAAmC,CAAC,CAAC,EACoB;IACzD,MAAM,EAAEC,SAAU,KAAI,EAAE,GAAGD;IAC3B,MAAME,UAAUL;IAEhB,MAAMM,cAAcD,UAAUN,mBAAmBM,WAAW,IAAI;IAEhE,OAAOP,MAAMS,WAAW,CAAC,IAAM;QAC7B,IAAID,aAAa;YACf,OAAOA,YAAYE,YAAY,CAACN,MAAME;QACxC,CAAC;QAED,OAAO;YAAEK,QAAQC,QAAQC,OAAO,CAAC,KAAK;YAAGC,QAAQ,IAAM,IAAI;QAAC;IAC9D,GAAG;QAACN;QAAaJ;QAAME;KAAQ;AACjC,CAAC"}
+{"version":3,"sources":["useFocusObserved.ts"],"sourcesContent":["import * as React from 'react';\nimport { getObservedElement, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\ninterface UseFocusObservedOptions {\n  /**\n   * After timeout the focus attempt fails\n   */\n  timeout?: number;\n}\n\n/**\n *\n * @param name - The observed element to focus\n * @returns Function that will focus the\n */\nexport function useFocusObserved(\n  name: string,\n  options: UseFocusObservedOptions = {},\n): () => TabsterTypes.ObservedElementAsyncRequest<boolean> {\n  const { timeout = 1000 } = options;\n  const tabster = useTabster();\n\n  const observedAPI = tabster ? getObservedElement(tabster) : null;\n\n  return React.useCallback(() => {\n    if (observedAPI) {\n      return observedAPI.requestFocus(name, timeout);\n    }\n\n    return { result: Promise.resolve(false), cancel: () => null };\n  }, [observedAPI, name, timeout]);\n}\n"],"names":["React","getObservedElement","useTabster","useFocusObserved","name","options","timeout","tabster","observedAPI","useCallback","requestFocus","result","Promise","resolve","cancel"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAA+B,UAAU;AACpE,SAASC,UAAU,QAAQ,eAAe;AAS1C;;;;CAIC,GACD,OAAO,SAASC,iBACdC,IAAY,EACZC,UAAmC,CAAC,CAAC;IAErC,MAAM,EAAEC,UAAU,IAAI,EAAE,GAAGD;IAC3B,MAAME,UAAUL;IAEhB,MAAMM,cAAcD,UAAUN,mBAAmBM,WAAW;IAE5D,OAAOP,MAAMS,WAAW,CAAC;QACvB,IAAID,aAAa;YACf,OAAOA,YAAYE,YAAY,CAACN,MAAME;QACxC;QAEA,OAAO;YAAEK,QAAQC,QAAQC,OAAO,CAAC;YAAQC,QAAQ,IAAM;QAAK;IAC9D,GAAG;QAACN;QAAaJ;QAAME;KAAQ;AACjC"}

package/lib/hooks/useFocusVisible.js

@@ -7,7 +7,8 @@ export function useFocusVisible(options = {}) {
     var _options_targetDocument;
     const targetDocument = (_options_targetDocument = options.targetDocument) !== null && _options_targetDocument !== void 0 ? _options_targetDocument : contextValue.targetDocument;
     React.useEffect(()=>{
-        if ((targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) && scopeRef.current) {
+        var _targetDocument;
+        if (((_targetDocument = targetDocument) === null || _targetDocument === void 0 ? void 0 : _targetDocument.defaultView) && scopeRef.current) {
             return applyFocusVisiblePolyfill(scopeRef.current, targetDocument.defaultView);
         }
     }, [

package/lib/hooks/useFocusVisible.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFocusVisible.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\nimport { applyFocusVisiblePolyfill } from '../focus/focusVisiblePolyfill';\n\ntype UseFocusVisibleOptions = {\n  targetDocument?: Document;\n};\n\nexport function useFocusVisible<TElement extends HTMLElement = HTMLElement>(options: UseFocusVisibleOptions = {}) {\n  const contextValue = useFluent();\n  const scopeRef = React.useRef<TElement>(null);\n\n  const targetDocument = options.targetDocument ?? contextValue.targetDocument;\n\n  React.useEffect(() => {\n    if (targetDocument?.defaultView && scopeRef.current) {\n      return applyFocusVisiblePolyfill(scopeRef.current, targetDocument.defaultView);\n    }\n  }, [scopeRef, targetDocument]);\n\n  return scopeRef;\n}\n"],"names":["React","useFluent_unstable","useFluent","applyFocusVisiblePolyfill","useFocusVisible","options","contextValue","scopeRef","useRef","targetDocument","useEffect","defaultView","current"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,yBAAyB,QAAQ,gCAAgC;AAM1E,OAAO,SAASC,gBAA4DC,UAAkC,CAAC,CAAC,EAAE;IAChH,MAAMC,eAAeJ;IACrB,MAAMK,WAAWP,MAAMQ,MAAM,CAAW,IAAI;QAErBH;IAAvB,MAAMI,iBAAiBJ,CAAAA,0BAAAA,QAAQI,cAAc,cAAtBJ,qCAAAA,0BAA0BC,aAAaG,cAAc;IAE5ET,MAAMU,SAAS,CAAC,IAAM;QACpB,IAAID,CAAAA,2BAAAA,4BAAAA,KAAAA,IAAAA,eAAgBE,WAAW,AAAD,KAAKJ,SAASK,OAAO,EAAE;YACnD,OAAOT,0BAA0BI,SAASK,OAAO,EAAEH,eAAeE,WAAW;QAC/E,CAAC;IACH,GAAG;QAACJ;QAAUE;KAAe;IAE7B,OAAOF;AACT,CAAC"}
+{"version":3,"sources":["useFocusVisible.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\nimport { applyFocusVisiblePolyfill } from '../focus/focusVisiblePolyfill';\n\ntype UseFocusVisibleOptions = {\n  targetDocument?: Document;\n};\n\nexport function useFocusVisible<TElement extends HTMLElement = HTMLElement>(options: UseFocusVisibleOptions = {}) {\n  const contextValue = useFluent();\n  const scopeRef = React.useRef<TElement>(null);\n\n  const targetDocument = options.targetDocument ?? contextValue.targetDocument;\n\n  React.useEffect(() => {\n    if (targetDocument?.defaultView && scopeRef.current) {\n      return applyFocusVisiblePolyfill(scopeRef.current, targetDocument.defaultView);\n    }\n  }, [scopeRef, targetDocument]);\n\n  return scopeRef;\n}\n"],"names":["React","useFluent_unstable","useFluent","applyFocusVisiblePolyfill","useFocusVisible","options","contextValue","scopeRef","useRef","targetDocument","useEffect","defaultView","current"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,yBAAyB,QAAQ,gCAAgC;AAM1E,OAAO,SAASC,gBAA4DC,UAAkC,CAAC,CAAC;IAC9G,MAAMC,eAAeJ;IACrB,MAAMK,WAAWP,MAAMQ,MAAM,CAAW;QAEjBH;IAAvB,MAAMI,iBAAiBJ,CAAAA,0BAAAA,QAAQI,cAAc,cAAtBJ,qCAAAA,0BAA0BC,aAAaG,cAAc;IAE5ET,MAAMU,SAAS,CAAC;YACVD;QAAJ,IAAIA,EAAAA,kBAAAA,4BAAAA,sCAAAA,gBAAgBE,WAAW,KAAIJ,SAASK,OAAO,EAAE;YACnD,OAAOT,0BAA0BI,SAASK,OAAO,EAAEH,eAAeE,WAAW;QAC/E;IACF,GAAG;QAACJ;QAAUE;KAAe;IAE7B,OAAOF;AACT"}

package/lib/hooks/useFocusWithin.js

@@ -6,10 +6,11 @@ import { applyFocusWithinPolyfill } from '../focus/focusWithinPolyfill';
  * like `:focus-visible` https://github.com/WICG/focus-visible/issues/151
  * @returns ref to the element that uses `:focus-within` styles
  */ export function useFocusWithin() {
-    const { targetDocument  } = useFluent();
+    const { targetDocument } = useFluent();
     const elementRef = React.useRef(null);
     React.useEffect(()=>{
-        if ((targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) && elementRef.current) {
+        var _targetDocument;
+        if (((_targetDocument = targetDocument) === null || _targetDocument === void 0 ? void 0 : _targetDocument.defaultView) && elementRef.current) {
             return applyFocusWithinPolyfill(elementRef.current, targetDocument.defaultView);
         }
     }, [

package/lib/hooks/useFocusWithin.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFocusWithin.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { applyFocusWithinPolyfill } from '../focus/focusWithinPolyfill';\n\n/**\n * A ponyfill that allows `:focus-within` to support visibility based on keyboard/mouse navigation\n * like `:focus-visible` https://github.com/WICG/focus-visible/issues/151\n * @returns ref to the element that uses `:focus-within` styles\n */\nexport function useFocusWithin<TElement extends HTMLElement = HTMLElement>() {\n  const { targetDocument } = useFluent();\n  const elementRef = React.useRef<TElement>(null);\n\n  React.useEffect(() => {\n    if (targetDocument?.defaultView && elementRef.current) {\n      return applyFocusWithinPolyfill(elementRef.current, targetDocument.defaultView);\n    }\n  }, [elementRef, targetDocument]);\n\n  return elementRef;\n}\n"],"names":["React","useFluent_unstable","useFluent","applyFocusWithinPolyfill","useFocusWithin","targetDocument","elementRef","useRef","useEffect","defaultView","current"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,wBAAwB,QAAQ,+BAA+B;AAExE;;;;CAIC,GACD,OAAO,SAASC,iBAA6D;IAC3E,MAAM,EAAEC,eAAc,EAAE,GAAGH;IAC3B,MAAMI,aAAaN,MAAMO,MAAM,CAAW,IAAI;IAE9CP,MAAMQ,SAAS,CAAC,IAAM;QACpB,IAAIH,CAAAA,2BAAAA,4BAAAA,KAAAA,IAAAA,eAAgBI,WAAW,AAAD,KAAKH,WAAWI,OAAO,EAAE;YACrD,OAAOP,yBAAyBG,WAAWI,OAAO,EAAEL,eAAeI,WAAW;QAChF,CAAC;IACH,GAAG;QAACH;QAAYD;KAAe;IAE/B,OAAOC;AACT,CAAC"}
+{"version":3,"sources":["useFocusWithin.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { applyFocusWithinPolyfill } from '../focus/focusWithinPolyfill';\n\n/**\n * A ponyfill that allows `:focus-within` to support visibility based on keyboard/mouse navigation\n * like `:focus-visible` https://github.com/WICG/focus-visible/issues/151\n * @returns ref to the element that uses `:focus-within` styles\n */\nexport function useFocusWithin<TElement extends HTMLElement = HTMLElement>() {\n  const { targetDocument } = useFluent();\n  const elementRef = React.useRef<TElement>(null);\n\n  React.useEffect(() => {\n    if (targetDocument?.defaultView && elementRef.current) {\n      return applyFocusWithinPolyfill(elementRef.current, targetDocument.defaultView);\n    }\n  }, [elementRef, targetDocument]);\n\n  return elementRef;\n}\n"],"names":["React","useFluent_unstable","useFluent","applyFocusWithinPolyfill","useFocusWithin","targetDocument","elementRef","useRef","useEffect","defaultView","current"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,wBAAwB,QAAQ,+BAA+B;AAExE;;;;CAIC,GACD,OAAO,SAASC;IACd,MAAM,EAAEC,cAAc,EAAE,GAAGH;IAC3B,MAAMI,aAAaN,MAAMO,MAAM,CAAW;IAE1CP,MAAMQ,SAAS,CAAC;YACVH;QAAJ,IAAIA,EAAAA,kBAAAA,4BAAAA,sCAAAA,gBAAgBI,WAAW,KAAIH,WAAWI,OAAO,EAAE;YACrD,OAAOP,yBAAyBG,WAAWI,OAAO,EAAEL,eAAeI,WAAW;QAChF;IACF,GAAG;QAACH;QAAYD;KAAe;IAE/B,OAAOC;AACT"}

package/lib/hooks/useFocusableGroup.js

@@ -5,16 +5,17 @@ import { useTabster } from './useTabster';
  * A hook that returns the necessary tabster attributes to support groupping.
  * @param options - Options to configure keyboard navigation
  */ export const useFocusableGroup = (options)=>{
+    var _options, _options1;
     const tabster = useTabster();
     if (tabster) {
         getGroupper(tabster);
     }
     return useTabsterAttributes({
         groupper: {
-            tabbability: getTabbability(options === null || options === void 0 ? void 0 : options.tabBehavior)
+            tabbability: getTabbability((_options = options) === null || _options === void 0 ? void 0 : _options.tabBehavior)
         },
         focusable: {
-            ignoreKeydown: options === null || options === void 0 ? void 0 : options.ignoreDefaultKeydown
+            ignoreKeydown: (_options1 = options) === null || _options1 === void 0 ? void 0 : _options1.ignoreDefaultKeydown
         }
     });
 };

package/lib/hooks/useFocusableGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFocusableGroup.ts"],"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   * Tabster can ignore default handling of keydown events\n   */\n  ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];\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    focusable: {\n      ignoreKeydown: options?.ignoreDefaultKeydown,\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"],"names":["Types","getGroupper","useTabsterAttributes","useTabster","useFocusableGroup","options","tabster","groupper","tabbability","getTabbability","tabBehavior","focusable","ignoreKeydown","ignoreDefaultKeydown","GroupperTabbabilities","Unlimited","Limited","LimitedTrapFocus","undefined"],"mappings":"AAAA,SAASA,KAAK,EAAEC,WAAW,QAAQ,UAAU;AAC7C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,UAAU,QAAQ,eAAe;AAc1C;;;CAGC,GACD,OAAO,MAAMC,oBAAoB,CAACC,UAAkE;IAClG,MAAMC,UAAUH;IAEhB,IAAIG,SAAS;QACXL,YAAYK;IACd,CAAC;IAED,OAAOJ,qBAAqB;QAC1BK,UAAU;YACRC,aAAaC,eAAeJ,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASK,WAAW;QAClD;QACAC,WAAW;YACTC,eAAeP,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASQ,oBAAoB;QAC9C;IACF;AACF,EAAE;AAEF,MAAMJ,iBAAiB,CACrBC,cAC0C;IAC1C,OAAQA;QACN,KAAK;YACH,OAAOV,MAAMc,qBAAqB,CAACC,SAAS;QAC9C,KAAK;YACH,OAAOf,MAAMc,qBAAqB,CAACE,OAAO;QAC5C,KAAK;YACH,OAAOhB,MAAMc,qBAAqB,CAACG,gBAAgB;QACrD;YACE,OAAOC;IACX;AACF"}
+{"version":3,"sources":["useFocusableGroup.ts"],"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   * Tabster can ignore default handling of keydown events\n   */\n  ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];\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    focusable: {\n      ignoreKeydown: options?.ignoreDefaultKeydown,\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"],"names":["Types","getGroupper","useTabsterAttributes","useTabster","useFocusableGroup","options","tabster","groupper","tabbability","getTabbability","tabBehavior","focusable","ignoreKeydown","ignoreDefaultKeydown","GroupperTabbabilities","Unlimited","Limited","LimitedTrapFocus","undefined"],"mappings":"AAAA,SAASA,KAAK,EAAEC,WAAW,QAAQ,UAAU;AAC7C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,UAAU,QAAQ,eAAe;AAc1C;;;CAGC,GACD,OAAO,MAAMC,oBAAoB,CAACC;QASAA,UAGbA;IAXnB,MAAMC,UAAUH;IAEhB,IAAIG,SAAS;QACXL,YAAYK;IACd;IAEA,OAAOJ,qBAAqB;QAC1BK,UAAU;YACRC,aAAaC,gBAAeJ,WAAAA,qBAAAA,+BAAAA,SAASK,WAAW;QAClD;QACAC,WAAW;YACTC,aAAa,GAAEP,YAAAA,qBAAAA,gCAAAA,UAASQ,oBAAoB;QAC9C;IACF;AACF,EAAE;AAEF,MAAMJ,iBAAiB,CACrBC;IAEA,OAAQA;QACN,KAAK;YACH,OAAOV,MAAMc,qBAAqB,CAACC,SAAS;QAC9C,KAAK;YACH,OAAOf,MAAMc,qBAAqB,CAACE,OAAO;QAC5C,KAAK;YACH,OAAOhB,MAAMc,qBAAqB,CAACG,gBAAgB;QACrD;YACE,OAAOC;IACX;AACF"}

package/lib/hooks/useKeyboardNavAttribute.js

@@ -7,7 +7,7 @@ import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts
  * attribute to a referenced element to ensure keyboard navigation awareness
  * synced to keyborg logic without having to cause a re-render on react tree.
  */ export function useKeyboardNavAttribute() {
-    const { targetDocument  } = useFluent();
+    const { targetDocument } = useFluent();
     const keyborg = useMemo(()=>targetDocument && createKeyborg(targetDocument.defaultView), [
         targetDocument
     ]);

package/lib/hooks/useKeyboardNavAttribute.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useKeyboardNavAttribute.ts"],"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';\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"],"names":["createKeyborg","useEffect","useMemo","useRef","KEYBOARD_NAV_ATTRIBUTE","useFluent_unstable","useFluent","useKeyboardNavAttribute","targetDocument","keyborg","defaultView","ref","setBooleanAttribute","isNavigatingWithKeyboard","cb","next","subscribe","unsubscribe","elementRef","attribute","value","current","setAttribute","removeAttribute"],"mappings":"AAAA,SAASA,aAAa,QAAQ,UAAU;AACxC,SAASC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAQ;AACnD,SAASC,sBAAsB,QAAQ,qBAAqB;AAC5D,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAIlF;;;;CAIC,GACD,OAAO,SAASC,0BAAiD;IAC/D,MAAM,EAAEC,eAAc,EAAE,GAAGF;IAC3B,MAAMG,UAAUP,QAAQ,IAAMM,kBAAkBR,cAAcQ,eAAeE,WAAW,GAAI;QAACF;KAAe;IAC5G,MAAMG,MAAMR,OAAU,IAAI;IAC1BF,UAAU,IAAM;QACd,IAAIQ,SAAS;YACXG,oBAAoBD,KAAKP,wBAAwBK,QAAQI,wBAAwB;YACjF,MAAMC,KAAsBC,CAAAA,OAAQ;gBAClCH,oBAAoBD,KAAKP,wBAAwBW;YACnD;YACAN,QAAQO,SAAS,CAACF;YAClB,OAAO,IAAML,QAAQQ,WAAW,CAACH;QACnC,CAAC;IACH,GAAG;QAACL;KAAQ;IACZ,OAAOE;AACT,CAAC;AAED,SAASC,oBAAoBM,UAAkC,EAAEC,SAAiB,EAAEC,KAAc,EAAE;IAClG,IAAI,CAACF,WAAWG,OAAO,EAAE;QACvB;IACF,CAAC;IACD,IAAID,OAAO;QACTF,WAAWG,OAAO,CAACC,YAAY,CAACH,WAAW;IAC7C,OAAO;QACLD,WAAWG,OAAO,CAACE,eAAe,CAACJ;IACrC,CAAC;AACH"}
+{"version":3,"sources":["useKeyboardNavAttribute.ts"],"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';\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"],"names":["createKeyborg","useEffect","useMemo","useRef","KEYBOARD_NAV_ATTRIBUTE","useFluent_unstable","useFluent","useKeyboardNavAttribute","targetDocument","keyborg","defaultView","ref","setBooleanAttribute","isNavigatingWithKeyboard","cb","next","subscribe","unsubscribe","elementRef","attribute","value","current","setAttribute","removeAttribute"],"mappings":"AAAA,SAASA,aAAa,QAAQ,UAAU;AACxC,SAASC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAQ;AACnD,SAASC,sBAAsB,QAAQ,qBAAqB;AAC5D,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAIlF;;;;CAIC,GACD,OAAO,SAASC;IACd,MAAM,EAAEC,cAAc,EAAE,GAAGF;IAC3B,MAAMG,UAAUP,QAAQ,IAAMM,kBAAkBR,cAAcQ,eAAeE,WAAW,GAAI;QAACF;KAAe;IAC5G,MAAMG,MAAMR,OAAU;IACtBF,UAAU;QACR,IAAIQ,SAAS;YACXG,oBAAoBD,KAAKP,wBAAwBK,QAAQI,wBAAwB;YACjF,MAAMC,KAAsBC,CAAAA;gBAC1BH,oBAAoBD,KAAKP,wBAAwBW;YACnD;YACAN,QAAQO,SAAS,CAACF;YAClB,OAAO,IAAML,QAAQQ,WAAW,CAACH;QACnC;IACF,GAAG;QAACL;KAAQ;IACZ,OAAOE;AACT;AAEA,SAASC,oBAAoBM,UAAkC,EAAEC,SAAiB,EAAEC,KAAc;IAChG,IAAI,CAACF,WAAWG,OAAO,EAAE;QACvB;IACF;IACA,IAAID,OAAO;QACTF,WAAWG,OAAO,CAACC,YAAY,CAACH,WAAW;IAC7C,OAAO;QACLD,WAAWG,OAAO,CAACE,eAAe,CAACJ;IACrC;AACF"}

package/lib/hooks/useMergeTabsterAttributes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useMergeTabsterAttributes.ts"],"sourcesContent":["import * as React from 'react';\nimport { Types } from 'tabster';\n\n/**\n * Merges a collection of tabster attributes.\n *\n * ⚠️The attributes passed as arguments to this  hook cannot change at runtime.\n * @internal\n * @param attributes - collection of tabster attributes from other react-tabster hooks\n * @returns single merged tabster attribute\n */\nexport const useMergedTabsterAttributes_unstable: (\n  ...attributes: Types.TabsterDOMAttribute[]\n) => Types.TabsterDOMAttribute = (...attributes) => {\n  const stringAttributes = attributes\n    .map(attribute => attribute[Types.TabsterAttributeName])\n    .filter(Boolean) as string[];\n\n  const mergedStrigAttribute = React.useMemo(() => {\n    let attribute = stringAttributes[0];\n    attributes.shift();\n\n    for (const attr of stringAttributes) {\n      attribute = mergeAttributes(attribute, attr);\n    }\n\n    return attribute;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, stringAttributes);\n\n  return { [Types.TabsterAttributeName]: mergedStrigAttribute };\n};\n\nfunction mergeAttributes(a: string, b?: string): string {\n  if (!b) {\n    return a;\n  }\n\n  let aParsed = {};\n  let bParsed = {};\n  if (a) {\n    try {\n      aParsed = JSON.parse(a);\n      // eslint-disable-next-line no-empty\n    } catch {}\n  }\n\n  if (b) {\n    try {\n      bParsed = JSON.parse(b);\n      // eslint-disable-next-line no-empty\n    } catch {}\n  }\n\n  return JSON.stringify({ ...aParsed, ...bParsed });\n}\n"],"names":["React","Types","useMergedTabsterAttributes_unstable","attributes","stringAttributes","map","attribute","TabsterAttributeName","filter","Boolean","mergedStrigAttribute","useMemo","shift","attr","mergeAttributes","a","b","aParsed","bParsed","JSON","parse","stringify"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,UAAU;AAEhC;;;;;;;CAOC,GACD,OAAO,MAAMC,sCAEoB,CAAC,GAAGC,aAAe;IAClD,MAAMC,mBAAmBD,WACtBE,GAAG,CAACC,CAAAA,YAAaA,SAAS,CAACL,MAAMM,oBAAoB,CAAC,EACtDC,MAAM,CAACC;IAEV,MAAMC,uBAAuBV,MAAMW,OAAO,CAAC,IAAM;QAC/C,IAAIL,YAAYF,gBAAgB,CAAC,EAAE;QACnCD,WAAWS,KAAK;QAEhB,KAAK,MAAMC,QAAQT,iBAAkB;YACnCE,YAAYQ,gBAAgBR,WAAWO;QACzC;QAEA,OAAOP;IACP,uDAAuD;IACzD,GAAGF;IAEH,OAAO;QAAE,CAACH,MAAMM,oBAAoB,CAAC,EAAEG;IAAqB;AAC9D,EAAE;AAEF,SAASI,gBAAgBC,CAAS,EAAEC,CAAU,EAAU;IACtD,IAAI,CAACA,GAAG;QACN,OAAOD;IACT,CAAC;IAED,IAAIE,UAAU,CAAC;IACf,IAAIC,UAAU,CAAC;IACf,IAAIH,GAAG;QACL,IAAI;YACFE,UAAUE,KAAKC,KAAK,CAACL;QACrB,oCAAoC;QACtC,EAAE,OAAM,CAAC;IACX,CAAC;IAED,IAAIC,GAAG;QACL,IAAI;YACFE,UAAUC,KAAKC,KAAK,CAACJ;QACrB,oCAAoC;QACtC,EAAE,OAAM,CAAC;IACX,CAAC;IAED,OAAOG,KAAKE,SAAS,CAAC;QAAE,GAAGJ,OAAO;QAAE,GAAGC,OAAO;IAAC;AACjD"}
+{"version":3,"sources":["useMergeTabsterAttributes.ts"],"sourcesContent":["import * as React from 'react';\nimport { Types } from 'tabster';\n\n/**\n * Merges a collection of tabster attributes.\n *\n * ⚠️The attributes passed as arguments to this  hook cannot change at runtime.\n * @internal\n * @param attributes - collection of tabster attributes from other react-tabster hooks\n * @returns single merged tabster attribute\n */\nexport const useMergedTabsterAttributes_unstable: (\n  ...attributes: Types.TabsterDOMAttribute[]\n) => Types.TabsterDOMAttribute = (...attributes) => {\n  const stringAttributes = attributes\n    .map(attribute => attribute[Types.TabsterAttributeName])\n    .filter(Boolean) as string[];\n\n  const mergedStrigAttribute = React.useMemo(() => {\n    let attribute = stringAttributes[0];\n    attributes.shift();\n\n    for (const attr of stringAttributes) {\n      attribute = mergeAttributes(attribute, attr);\n    }\n\n    return attribute;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, stringAttributes);\n\n  return { [Types.TabsterAttributeName]: mergedStrigAttribute };\n};\n\nfunction mergeAttributes(a: string, b?: string): string {\n  if (!b) {\n    return a;\n  }\n\n  let aParsed = {};\n  let bParsed = {};\n  if (a) {\n    try {\n      aParsed = JSON.parse(a);\n      // eslint-disable-next-line no-empty\n    } catch {}\n  }\n\n  if (b) {\n    try {\n      bParsed = JSON.parse(b);\n      // eslint-disable-next-line no-empty\n    } catch {}\n  }\n\n  return JSON.stringify({ ...aParsed, ...bParsed });\n}\n"],"names":["React","Types","useMergedTabsterAttributes_unstable","attributes","stringAttributes","map","attribute","TabsterAttributeName","filter","Boolean","mergedStrigAttribute","useMemo","shift","attr","mergeAttributes","a","b","aParsed","bParsed","JSON","parse","stringify"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,UAAU;AAEhC;;;;;;;CAOC,GACD,OAAO,MAAMC,sCAEoB,CAAC,GAAGC;IACnC,MAAMC,mBAAmBD,WACtBE,GAAG,CAACC,CAAAA,YAAaA,SAAS,CAACL,MAAMM,oBAAoB,CAAC,EACtDC,MAAM,CAACC;IAEV,MAAMC,uBAAuBV,MAAMW,OAAO,CAAC;QACzC,IAAIL,YAAYF,gBAAgB,CAAC,EAAE;QACnCD,WAAWS,KAAK;QAEhB,KAAK,MAAMC,QAAQT,iBAAkB;YACnCE,YAAYQ,gBAAgBR,WAAWO;QACzC;QAEA,OAAOP;IACP,uDAAuD;IACzD,GAAGF;IAEH,OAAO;QAAE,CAACH,MAAMM,oBAAoB,CAAC,EAAEG;IAAqB;AAC9D,EAAE;AAEF,SAASI,gBAAgBC,CAAS,EAAEC,CAAU;IAC5C,IAAI,CAACA,GAAG;QACN,OAAOD;IACT;IAEA,IAAIE,UAAU,CAAC;IACf,IAAIC,UAAU,CAAC;IACf,IAAIH,GAAG;QACL,IAAI;YACFE,UAAUE,KAAKC,KAAK,CAACL;QACrB,oCAAoC;QACtC,EAAE,OAAM,CAAC;IACX;IAEA,IAAIC,GAAG;QACL,IAAI;YACFE,UAAUC,KAAKC,KAAK,CAACJ;QACrB,oCAAoC;QACtC,EAAE,OAAM,CAAC;IACX;IAEA,OAAOG,KAAKE,SAAS,CAAC;QAAE,GAAGJ,OAAO;QAAE,GAAGC,OAAO;IAAC;AACjD"}

package/lib/hooks/useModalAttributes.js

@@ -9,7 +9,7 @@ import { useTabster } from './useTabster';
  *
  * @returns DOM attributes to apply to the modal element and its trigger
  */ export const useModalAttributes = (options = {})=>{
-    const { trapFocus , alwaysFocusable , legacyTrapFocus  } = options;
+    const { trapFocus, alwaysFocusable, legacyTrapFocus } = options;
     const tabster = useTabster();
     // Initializes the modalizer and restorer APIs
     if (tabster) {

package/lib/hooks/useModalAttributes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useModalAttributes.ts"],"sourcesContent":["import { useId } from '@fluentui/react-utilities';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { getModalizer, getRestorer, 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   * Id to use for the modalizer. An id will be generated if not provided.\n   */\n  id?: string;\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 restorer APIs\n  if (tabster) {\n    getModalizer(tabster);\n    getRestorer(tabster);\n  }\n\n  const id = useId('modal-', options.id);\n  const modalAttributes = useTabsterAttributes({\n    restorer: { type: TabsterTypes.RestorerTypes.Source },\n    modalizer: {\n      id,\n      isOthersAccessible: !trapFocus,\n      isAlwaysAccessible: alwaysFocusable,\n      isTrapped: legacyTrapFocus && trapFocus,\n    },\n  });\n\n  const triggerAttributes = useTabsterAttributes({\n    restorer: { type: TabsterTypes.RestorerTypes.Target },\n  });\n\n  return { modalAttributes, triggerAttributes };\n};\n"],"names":["useId","useTabsterAttributes","getModalizer","getRestorer","Types","TabsterTypes","useTabster","useModalAttributes","options","trapFocus","alwaysFocusable","legacyTrapFocus","tabster","id","modalAttributes","restorer","type","RestorerTypes","Source","modalizer","isOthersAccessible","isAlwaysAccessible","isTrapped","triggerAttributes","Target"],"mappings":"AAAA,SAASA,KAAK,QAAQ,4BAA4B;AAClD,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,YAAY,EAAEC,WAAW,EAAEC,SAASC,YAAY,QAAQ,UAAU;AAC3E,SAASC,UAAU,QAAQ,eAAe;AA8B1C;;;;;;CAMC,GACD,OAAO,MAAMC,qBAAqB,CAChCC,UAAqC,CAAC,CAAC,GACwE;IAC/G,MAAM,EAAEC,UAAS,EAAEC,gBAAe,EAAEC,gBAAe,EAAE,GAAGH;IACxD,MAAMI,UAAUN;IAChB,8CAA8C;IAC9C,IAAIM,SAAS;QACXV,aAAaU;QACbT,YAAYS;IACd,CAAC;IAED,MAAMC,KAAKb,MAAM,UAAUQ,QAAQK,EAAE;IACrC,MAAMC,kBAAkBb,qBAAqB;QAC3Cc,UAAU;YAAEC,MAAMX,aAAaY,aAAa,CAACC,MAAM;QAAC;QACpDC,WAAW;YACTN;YACAO,oBAAoB,CAACX;YACrBY,oBAAoBX;YACpBY,WAAWX,mBAAmBF;QAChC;IACF;IAEA,MAAMc,oBAAoBtB,qBAAqB;QAC7Cc,UAAU;YAAEC,MAAMX,aAAaY,aAAa,CAACO,MAAM;QAAC;IACtD;IAEA,OAAO;QAAEV;QAAiBS;IAAkB;AAC9C,EAAE"}
+{"version":3,"sources":["useModalAttributes.ts"],"sourcesContent":["import { useId } from '@fluentui/react-utilities';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { getModalizer, getRestorer, 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   * Id to use for the modalizer. An id will be generated if not provided.\n   */\n  id?: string;\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 restorer APIs\n  if (tabster) {\n    getModalizer(tabster);\n    getRestorer(tabster);\n  }\n\n  const id = useId('modal-', options.id);\n  const modalAttributes = useTabsterAttributes({\n    restorer: { type: TabsterTypes.RestorerTypes.Source },\n    modalizer: {\n      id,\n      isOthersAccessible: !trapFocus,\n      isAlwaysAccessible: alwaysFocusable,\n      isTrapped: legacyTrapFocus && trapFocus,\n    },\n  });\n\n  const triggerAttributes = useTabsterAttributes({\n    restorer: { type: TabsterTypes.RestorerTypes.Target },\n  });\n\n  return { modalAttributes, triggerAttributes };\n};\n"],"names":["useId","useTabsterAttributes","getModalizer","getRestorer","Types","TabsterTypes","useTabster","useModalAttributes","options","trapFocus","alwaysFocusable","legacyTrapFocus","tabster","id","modalAttributes","restorer","type","RestorerTypes","Source","modalizer","isOthersAccessible","isAlwaysAccessible","isTrapped","triggerAttributes","Target"],"mappings":"AAAA,SAASA,KAAK,QAAQ,4BAA4B;AAClD,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,YAAY,EAAEC,WAAW,EAAEC,SAASC,YAAY,QAAQ,UAAU;AAC3E,SAASC,UAAU,QAAQ,eAAe;AA8B1C;;;;;;CAMC,GACD,OAAO,MAAMC,qBAAqB,CAChCC,UAAqC,CAAC,CAAC;IAEvC,MAAM,EAAEC,SAAS,EAAEC,eAAe,EAAEC,eAAe,EAAE,GAAGH;IACxD,MAAMI,UAAUN;IAChB,8CAA8C;IAC9C,IAAIM,SAAS;QACXV,aAAaU;QACbT,YAAYS;IACd;IAEA,MAAMC,KAAKb,MAAM,UAAUQ,QAAQK,EAAE;IACrC,MAAMC,kBAAkBb,qBAAqB;QAC3Cc,UAAU;YAAEC,MAAMX,aAAaY,aAAa,CAACC,MAAM;QAAC;QACpDC,WAAW;YACTN;YACAO,oBAAoB,CAACX;YACrBY,oBAAoBX;YACpBY,WAAWX,mBAAmBF;QAChC;IACF;IAEA,MAAMc,oBAAoBtB,qBAAqB;QAC7Cc,UAAU;YAAEC,MAAMX,aAAaY,aAAa,CAACO,MAAM;QAAC;IACtD;IAEA,OAAO;QAAEV;QAAiBS;IAAkB;AAC9C,EAAE"}

package/lib/hooks/useObservedElement.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useObservedElement.ts"],"sourcesContent":["import { useTabster } from './useTabster';\nimport { getObservedElement, Types as TabsterTypes } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\n\nexport function useObservedElement(name: string | string[]): TabsterTypes.TabsterDOMAttribute {\n  const tabster = useTabster();\n  if (tabster) {\n    getObservedElement(tabster);\n  }\n\n  return useTabsterAttributes({ observed: { names: Array.isArray(name) ? name : [name] } });\n}\n"],"names":["useTabster","getObservedElement","useTabsterAttributes","useObservedElement","name","tabster","observed","names","Array","isArray"],"mappings":"AAAA,SAASA,UAAU,QAAQ,eAAe;AAC1C,SAASC,kBAAkB,QAA+B,UAAU;AACpE,SAASC,oBAAoB,QAAQ,yBAAyB;AAE9D,OAAO,SAASC,mBAAmBC,IAAuB,EAAoC;IAC5F,MAAMC,UAAUL;IAChB,IAAIK,SAAS;QACXJ,mBAAmBI;IACrB,CAAC;IAED,OAAOH,qBAAqB;QAAEI,UAAU;YAAEC,OAAOC,MAAMC,OAAO,CAACL,QAAQA,OAAO;gBAACA;aAAK;QAAC;IAAE;AACzF,CAAC"}
+{"version":3,"sources":["useObservedElement.ts"],"sourcesContent":["import { useTabster } from './useTabster';\nimport { getObservedElement, Types as TabsterTypes } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\n\nexport function useObservedElement(name: string | string[]): TabsterTypes.TabsterDOMAttribute {\n  const tabster = useTabster();\n  if (tabster) {\n    getObservedElement(tabster);\n  }\n\n  return useTabsterAttributes({ observed: { names: Array.isArray(name) ? name : [name] } });\n}\n"],"names":["useTabster","getObservedElement","useTabsterAttributes","useObservedElement","name","tabster","observed","names","Array","isArray"],"mappings":"AAAA,SAASA,UAAU,QAAQ,eAAe;AAC1C,SAASC,kBAAkB,QAA+B,UAAU;AACpE,SAASC,oBAAoB,QAAQ,yBAAyB;AAE9D,OAAO,SAASC,mBAAmBC,IAAuB;IACxD,MAAMC,UAAUL;IAChB,IAAIK,SAAS;QACXJ,mBAAmBI;IACrB;IAEA,OAAOH,qBAAqB;QAAEI,UAAU;YAAEC,OAAOC,MAAMC,OAAO,CAACL,QAAQA,OAAO;gBAACA;aAAK;QAAC;IAAE;AACzF"}

package/lib/hooks/useRestoreFocus.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useRestoreFocus.ts"],"sourcesContent":["import { getRestorer, getTabsterAttribute, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Focus will be restored to the most recent target element when it is lost from a source\n * @returns Attribute to apply to the target element where focus is restored\n */\nexport function useRestoreFocusTarget(): TabsterTypes.TabsterDOMAttribute {\n  const tabster = useTabster();\n  // Initializes the restorer API\n  if (tabster) {\n    getRestorer(tabster);\n  }\n\n  return getTabsterAttribute({ restorer: { type: TabsterTypes.RestorerTypes.Target } });\n}\n\n/**\n * Focus will be restored to the most recent target element when it is lost from a source\n * @returns Attribute to apply to the element that might lose focus\n */\nexport function useRestoreFocusSource(): TabsterTypes.TabsterDOMAttribute {\n  const tabster = useTabster();\n  // Initializes the restorer API\n  if (tabster) {\n    getRestorer(tabster);\n  }\n\n  return getTabsterAttribute({ restorer: { type: TabsterTypes.RestorerTypes.Source } });\n}\n"],"names":["getRestorer","getTabsterAttribute","Types","TabsterTypes","useTabster","useRestoreFocusTarget","tabster","restorer","type","RestorerTypes","Target","useRestoreFocusSource","Source"],"mappings":"AAAA,SAASA,WAAW,EAAEC,mBAAmB,EAAEC,SAASC,YAAY,QAAQ,UAAU;AAClF,SAASC,UAAU,QAAQ,eAAe;AAE1C;;;CAGC,GACD,OAAO,SAASC,wBAA0D;IACxE,MAAMC,UAAUF;IAChB,+BAA+B;IAC/B,IAAIE,SAAS;QACXN,YAAYM;IACd,CAAC;IAED,OAAOL,oBAAoB;QAAEM,UAAU;YAAEC,MAAML,aAAaM,aAAa,CAACC,MAAM;QAAC;IAAE;AACrF,CAAC;AAED;;;CAGC,GACD,OAAO,SAASC,wBAA0D;IACxE,MAAML,UAAUF;IAChB,+BAA+B;IAC/B,IAAIE,SAAS;QACXN,YAAYM;IACd,CAAC;IAED,OAAOL,oBAAoB;QAAEM,UAAU;YAAEC,MAAML,aAAaM,aAAa,CAACG,MAAM;QAAC;IAAE;AACrF,CAAC"}
+{"version":3,"sources":["useRestoreFocus.ts"],"sourcesContent":["import { getRestorer, getTabsterAttribute, Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Focus will be restored to the most recent target element when it is lost from a source\n * @returns Attribute to apply to the target element where focus is restored\n */\nexport function useRestoreFocusTarget(): TabsterTypes.TabsterDOMAttribute {\n  const tabster = useTabster();\n  // Initializes the restorer API\n  if (tabster) {\n    getRestorer(tabster);\n  }\n\n  return getTabsterAttribute({ restorer: { type: TabsterTypes.RestorerTypes.Target } });\n}\n\n/**\n * Focus will be restored to the most recent target element when it is lost from a source\n * @returns Attribute to apply to the element that might lose focus\n */\nexport function useRestoreFocusSource(): TabsterTypes.TabsterDOMAttribute {\n  const tabster = useTabster();\n  // Initializes the restorer API\n  if (tabster) {\n    getRestorer(tabster);\n  }\n\n  return getTabsterAttribute({ restorer: { type: TabsterTypes.RestorerTypes.Source } });\n}\n"],"names":["getRestorer","getTabsterAttribute","Types","TabsterTypes","useTabster","useRestoreFocusTarget","tabster","restorer","type","RestorerTypes","Target","useRestoreFocusSource","Source"],"mappings":"AAAA,SAASA,WAAW,EAAEC,mBAAmB,EAAEC,SAASC,YAAY,QAAQ,UAAU;AAClF,SAASC,UAAU,QAAQ,eAAe;AAE1C;;;CAGC,GACD,OAAO,SAASC;IACd,MAAMC,UAAUF;IAChB,+BAA+B;IAC/B,IAAIE,SAAS;QACXN,YAAYM;IACd;IAEA,OAAOL,oBAAoB;QAAEM,UAAU;YAAEC,MAAML,aAAaM,aAAa,CAACC,MAAM;QAAC;IAAE;AACrF;AAEA;;;CAGC,GACD,OAAO,SAASC;IACd,MAAML,UAAUF;IAChB,+BAA+B;IAC/B,IAAIE,SAAS;QACXN,YAAYM;IACd;IAEA,OAAOL,oBAAoB;QAAEM,UAAU;YAAEC,MAAML,aAAaM,aAAa,CAACG,MAAM;QAAC;IAAE;AACrF"}

package/lib/hooks/useTabster.js

@@ -9,8 +9,9 @@ import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
  * @internal
  * @returns Tabster core instance
  */ export const useTabster = ()=>{
-    const { targetDocument  } = useFluent();
-    const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
+    var _targetDocument;
+    const { targetDocument } = useFluent();
+    const defaultView = ((_targetDocument = targetDocument) === null || _targetDocument === void 0 ? void 0 : _targetDocument.defaultView) || undefined;
     const tabster = React.useMemo(()=>{
         if (!defaultView) {
             return null;