@fluentui/react-aria 9.17.10 → 9.17.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -2
- package/dist/index.d.ts +1 -2
- package/lib/AriaLiveAnnouncer/AriaLiveAnnouncer.js +0 -1
- package/lib/AriaLiveAnnouncer/AriaLiveAnnouncer.js.map +1 -1
- package/lib/AriaLiveAnnouncer/AriaLiveAnnouncer.types.js +1 -1
- package/lib/AriaLiveAnnouncer/AriaLiveAnnouncer.types.js.map +1 -1
- package/lib/activedescendant/ActiveDescendantContext.js.map +1 -1
- package/lib/activedescendant/types.js +1 -1
- package/lib/activedescendant/types.js.map +1 -1
- package/lib/button/types.js +3 -1
- package/lib/button/types.js.map +1 -1
- package/lib/button/useARIAButtonProps.js +1 -3
- package/lib/button/useARIAButtonProps.js.map +1 -1
- package/lib/useTypingAnnounce/useTypingAnnounce.js.map +1 -1
- package/lib-commonjs/AriaLiveAnnouncer/AriaLiveAnnouncer.js +0 -2
- package/lib-commonjs/AriaLiveAnnouncer/AriaLiveAnnouncer.js.map +1 -1
- package/lib-commonjs/AriaLiveAnnouncer/AriaLiveAnnouncer.types.js +0 -2
- package/lib-commonjs/AriaLiveAnnouncer/AriaLiveAnnouncer.types.js.map +1 -1
- package/lib-commonjs/activedescendant/ActiveDescendantContext.js.map +1 -1
- package/lib-commonjs/activedescendant/types.js +0 -2
- package/lib-commonjs/activedescendant/types.js.map +1 -1
- package/lib-commonjs/button/types.js +0 -2
- package/lib-commonjs/button/types.js.map +1 -1
- package/lib-commonjs/button/useARIAButtonProps.js +0 -2
- package/lib-commonjs/button/useARIAButtonProps.js.map +1 -1
- package/lib-commonjs/useTypingAnnounce/useTypingAnnounce.js.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,23 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-aria
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Thu, 23 Apr 2026 11:59:54 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.17.11](https://github.com/microsoft/fluentui/tree/@fluentui/react-aria_v9.17.11)
|
|
8
|
+
|
|
9
|
+
Thu, 23 Apr 2026 11:59:54 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-aria_v9.17.10..@fluentui/react-aria_v9.17.11)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
|
|
15
|
+
- Bump @fluentui/react-tabster to v9.26.14 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
|
|
16
|
+
- Bump @fluentui/react-utilities to v9.26.3 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
|
|
17
|
+
|
|
7
18
|
## [9.17.10](https://github.com/microsoft/fluentui/tree/@fluentui/react-aria_v9.17.10)
|
|
8
19
|
|
|
9
|
-
Wed, 25 Feb 2026 13:28
|
|
20
|
+
Wed, 25 Feb 2026 13:32:28 GMT
|
|
10
21
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-aria_v9.17.9..@fluentui/react-aria_v9.17.10)
|
|
11
22
|
|
|
12
23
|
### Patches
|
package/dist/index.d.ts
CHANGED
|
@@ -163,12 +163,11 @@ declare interface UseActiveDescendantReturn<TActiveParentElement extends HTMLEle
|
|
|
163
163
|
}
|
|
164
164
|
|
|
165
165
|
/**
|
|
166
|
-
* @internal
|
|
167
|
-
*
|
|
168
166
|
* Button keyboard handling, role, disabled and tabIndex implementation that ensures ARIA spec
|
|
169
167
|
* for multiple scenarios of non native button elements. Ensuring 1st rule of ARIA for cases
|
|
170
168
|
* where no attribute addition is required.
|
|
171
169
|
*
|
|
170
|
+
* @internal
|
|
172
171
|
* @param type - the proper scenario to be interpreted by the hook.
|
|
173
172
|
* 1. `button` - Minimal interference from the hook, as semantic button already supports most of the states
|
|
174
173
|
* 2. `a` or `div` - Proper keyboard/mouse handling plus other support to ensure ARIA behavior
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import * as React from 'react';
|
|
3
2
|
import { renderAriaLiveAnnouncer_unstable } from './renderAriaLiveAnnouncer';
|
|
4
3
|
import { useAriaLiveAnnouncer_unstable } from './useAriaLiveAnnouncer';
|
|
5
4
|
import { useAriaLiveAnnouncerContextValues_unstable } from './useAriaLiveAnnouncerContextValues';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/AriaLiveAnnouncer/AriaLiveAnnouncer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type { AriaLiveAnnouncerProps } from './AriaLiveAnnouncer.types';\nimport { renderAriaLiveAnnouncer_unstable } from './renderAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncer_unstable } from './useAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncerContextValues_unstable } from './useAriaLiveAnnouncerContextValues';\n\n/**\n * A sample implementation of a component that manages aria live announcements.\n */\nexport const AriaLiveAnnouncer: React.FC<AriaLiveAnnouncerProps> = props => {\n const state = useAriaLiveAnnouncer_unstable(props);\n const contextValues = useAriaLiveAnnouncerContextValues_unstable(state);\n\n return renderAriaLiveAnnouncer_unstable(state, contextValues);\n};\n\nAriaLiveAnnouncer.displayName = 'AriaLiveAnnouncer';\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/AriaLiveAnnouncer/AriaLiveAnnouncer.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\n\nimport type { AriaLiveAnnouncerProps } from './AriaLiveAnnouncer.types';\nimport { renderAriaLiveAnnouncer_unstable } from './renderAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncer_unstable } from './useAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncerContextValues_unstable } from './useAriaLiveAnnouncerContextValues';\n\n/**\n * A sample implementation of a component that manages aria live announcements.\n */\nexport const AriaLiveAnnouncer: React.FC<AriaLiveAnnouncerProps> = props => {\n const state = useAriaLiveAnnouncer_unstable(props);\n const contextValues = useAriaLiveAnnouncerContextValues_unstable(state);\n\n return renderAriaLiveAnnouncer_unstable(state, contextValues);\n};\n\nAriaLiveAnnouncer.displayName = 'AriaLiveAnnouncer';\n"],"names":["renderAriaLiveAnnouncer_unstable","useAriaLiveAnnouncer_unstable","useAriaLiveAnnouncerContextValues_unstable","AriaLiveAnnouncer","props","state","contextValues","displayName"],"mappings":"AAAA;AAKA,SAASA,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,0CAA0C,QAAQ,sCAAsC;AAEjG;;CAEC,GACD,OAAO,MAAMC,oBAAsDC,CAAAA;IACjE,MAAMC,QAAQJ,8BAA8BG;IAC5C,MAAME,gBAAgBJ,2CAA2CG;IAEjE,OAAOL,iCAAiCK,OAAOC;AACjD,EAAE;AAEFH,kBAAkBI,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
export { };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/AriaLiveAnnouncer/AriaLiveAnnouncer.types.ts"],"sourcesContent":["import type { AnnounceContextValue } from '@fluentui/react-shared-contexts';\nimport * as React from 'react';\n\nexport type AriaLiveAnnounceFn = AnnounceContextValue['announce'];\n\nexport type AriaLiveMessage = {\n message: string;\n\n createdAt: number;\n\n priority: number;\n batchId?: string;\n};\n\nexport type AriaLiveAnnouncerProps = {\n children?: React.ReactNode;\n};\n\nexport type AriaLiveAnnouncerState = {\n announce: AriaLiveAnnounceFn;\n children?: React.ReactNode;\n};\n\nexport type AriaLiveAnnouncerContextValues = {\n announce: { announce: AriaLiveAnnounceFn };\n};\n"],"names":[
|
|
1
|
+
{"version":3,"sources":["../src/AriaLiveAnnouncer/AriaLiveAnnouncer.types.ts"],"sourcesContent":["import type { AnnounceContextValue } from '@fluentui/react-shared-contexts';\nimport type * as React from 'react';\n\nexport type AriaLiveAnnounceFn = AnnounceContextValue['announce'];\n\nexport type AriaLiveMessage = {\n message: string;\n\n createdAt: number;\n\n priority: number;\n batchId?: string;\n};\n\nexport type AriaLiveAnnouncerProps = {\n children?: React.ReactNode;\n};\n\nexport type AriaLiveAnnouncerState = {\n announce: AriaLiveAnnounceFn;\n children?: React.ReactNode;\n};\n\nexport type AriaLiveAnnouncerContextValues = {\n announce: { announce: AriaLiveAnnounceFn };\n};\n"],"names":[],"mappings":"AAuBA,WAEE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/activedescendant/ActiveDescendantContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ActiveDescendantImperativeRef } from './types';\n\nexport type ActiveDescendantContextValue = {\n controller: ActiveDescendantImperativeRef;\n};\n\nconst noop = () => undefined;\n\nconst activeDescendantContextDefaultValue: ActiveDescendantContextValue = {\n controller: {\n active: noop,\n blur: noop,\n find: noop,\n first: noop,\n focus: noop,\n focusLastActive: noop,\n scrollActiveIntoView: noop,\n last: noop,\n next: noop,\n prev: noop,\n showAttributes: noop,\n hideAttributes: noop,\n showFocusVisibleAttributes: noop,\n hideFocusVisibleAttributes: noop,\n },\n};\n\nconst ActiveDescendantContext = React.createContext<ActiveDescendantContextValue | undefined>(undefined);\n\nexport const ActiveDescendantContextProvider = ActiveDescendantContext.Provider;\nexport const useActiveDescendantContext = (): ActiveDescendantContextValue =>\n React.useContext(ActiveDescendantContext) ?? activeDescendantContextDefaultValue;\nexport const useHasParentActiveDescendantContext = (): boolean => !!React.useContext(ActiveDescendantContext);\n"],"names":["React","noop","undefined","activeDescendantContextDefaultValue","controller","active","blur","find","first","focus","focusLastActive","scrollActiveIntoView","last","next","prev","showAttributes","hideAttributes","showFocusVisibleAttributes","hideFocusVisibleAttributes","ActiveDescendantContext","createContext","ActiveDescendantContextProvider","Provider","useActiveDescendantContext","useContext","useHasParentActiveDescendantContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAO/B,MAAMC,OAAO,IAAMC;AAEnB,MAAMC,sCAAoE;IACxEC,YAAY;QACVC,QAAQJ;QACRK,MAAML;QACNM,MAAMN;QACNO,OAAOP;QACPQ,OAAOR;QACPS,iBAAiBT;QACjBU,sBAAsBV;QACtBW,MAAMX;QACNY,MAAMZ;QACNa,MAAMb;QACNc,gBAAgBd;QAChBe,gBAAgBf;QAChBgB,4BAA4BhB;QAC5BiB,4BAA4BjB;IAC9B;AACF;AAEA,MAAMkB,0BAA0BnB,MAAMoB,aAAa,CAA2ClB;AAE9F,OAAO,MAAMmB,kCAAkCF,wBAAwBG,QAAQ,CAAC;AAChF,OAAO,MAAMC,6BAA6B;QACxCvB;WAAAA,CAAAA,oBAAAA,MAAMwB,UAAU,CAACL,sCAAjBnB,+BAAAA,oBAA6CG;EAAoC;AACnF,OAAO,MAAMsB,sCAAsC,IAAe,CAAC,CAACzB,MAAMwB,UAAU,CAACL,yBAAyB"}
|
|
1
|
+
{"version":3,"sources":["../src/activedescendant/ActiveDescendantContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ActiveDescendantImperativeRef } from './types';\n\nexport type ActiveDescendantContextValue = {\n controller: ActiveDescendantImperativeRef;\n};\n\nconst noop = () => undefined;\n\nconst activeDescendantContextDefaultValue: ActiveDescendantContextValue = {\n controller: {\n active: noop,\n blur: noop,\n find: noop,\n first: noop,\n focus: noop,\n focusLastActive: noop,\n scrollActiveIntoView: noop,\n last: noop,\n next: noop,\n prev: noop,\n showAttributes: noop,\n hideAttributes: noop,\n showFocusVisibleAttributes: noop,\n hideFocusVisibleAttributes: noop,\n },\n};\n\nconst ActiveDescendantContext = React.createContext<ActiveDescendantContextValue | undefined>(undefined);\n\nexport const ActiveDescendantContextProvider = ActiveDescendantContext.Provider;\nexport const useActiveDescendantContext = (): ActiveDescendantContextValue =>\n React.useContext(ActiveDescendantContext) ?? activeDescendantContextDefaultValue;\nexport const useHasParentActiveDescendantContext = (): boolean => !!React.useContext(ActiveDescendantContext);\n"],"names":["React","noop","undefined","activeDescendantContextDefaultValue","controller","active","blur","find","first","focus","focusLastActive","scrollActiveIntoView","last","next","prev","showAttributes","hideAttributes","showFocusVisibleAttributes","hideFocusVisibleAttributes","ActiveDescendantContext","createContext","ActiveDescendantContextProvider","Provider","useActiveDescendantContext","useContext","useHasParentActiveDescendantContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAO/B,MAAMC,OAAO,IAAMC;AAEnB,MAAMC,sCAAoE;IACxEC,YAAY;QACVC,QAAQJ;QACRK,MAAML;QACNM,MAAMN;QACNO,OAAOP;QACPQ,OAAOR;QACPS,iBAAiBT;QACjBU,sBAAsBV;QACtBW,MAAMX;QACNY,MAAMZ;QACNa,MAAMb;QACNc,gBAAgBd;QAChBe,gBAAgBf;QAChBgB,4BAA4BhB;QAC5BiB,4BAA4BjB;IAC9B;AACF;AAEA,MAAMkB,0BAA0BnB,MAAMoB,aAAa,CAA2ClB;AAE9F,OAAO,MAAMmB,kCAAkCF,wBAAwBG,QAAQ,CAAC;AAChF,OAAO,MAAMC,6BAA6B;QACxCvB;WAAAA,CAAAA,oBAAAA,MAAMwB,UAAU,CAACL,sCAAjBnB,+BAAAA,oBAA6CG;EAAoC;AACnF,OAAO,MAAMsB,sCAAsC,IAAe,CAAC,CAACzB,MAAMwB,UAAU,CAACL,yBAAyB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
export { };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/activedescendant/types.ts"],"sourcesContent":["import * as React from 'react';\n\nexport interface ActiveDescendantImperativeRef {\n first: (options?: IteratorOptions) => string | undefined;\n last: (options?: IteratorOptions) => string | undefined;\n next: (options?: IteratorOptions) => string | undefined;\n prev: (options?: IteratorOptions) => string | undefined;\n find: (predicate: (id: string) => boolean, options?: IteratorOptions & FindOptions) => string | undefined;\n blur: () => void;\n active: () => string | undefined;\n focus: (id: string) => void;\n /**\n * @deprecated This function is not used internally anymore and will be removed in the future\n */\n focusLastActive: () => void;\n /**\n * Scrolls the active option into view, if it still exists\n */\n scrollActiveIntoView: () => void;\n hideAttributes: () => void;\n showAttributes: () => void;\n hideFocusVisibleAttributes: () => void;\n showFocusVisibleAttributes: () => void;\n}\n\nexport interface ActiveDescendantOptions {\n /**\n * @param el - HTML element to test\n * @returns whether the element can be an active descendant\n */\n matchOption: (el: HTMLElement) => boolean;\n /**\n * Forward imperative refs when exposing functionality from a React component\n */\n imperativeRef?: React.RefObject<ActiveDescendantImperativeRef | null>;\n}\n\nexport interface FindOptions {\n /**\n * Starts the search from a specific id\n */\n startFrom?: string;\n}\n\nexport interface UseActiveDescendantReturn<\n TActiveParentElement extends HTMLElement = HTMLElement,\n TListboxElement extends HTMLElement = HTMLElement,\n> {\n /**\n * Attach this to the element that contains all active descendants\n */\n listboxRef: React.Ref<TListboxElement>;\n /**\n * Attach this to the element that has an active descendant\n */\n activeParentRef: React.Ref<TActiveParentElement>;\n /**\n * Imperative functions to manage active descendants within the listboxRef\n */\n controller: ActiveDescendantImperativeRef;\n}\n\nexport interface IteratorOptions {\n /**\n * When passive, the active descendant is changed\n * @default false\n */\n passive?: boolean;\n}\n"],"names":[
|
|
1
|
+
{"version":3,"sources":["../src/activedescendant/types.ts"],"sourcesContent":["import type * as React from 'react';\n\nexport interface ActiveDescendantImperativeRef {\n first: (options?: IteratorOptions) => string | undefined;\n last: (options?: IteratorOptions) => string | undefined;\n next: (options?: IteratorOptions) => string | undefined;\n prev: (options?: IteratorOptions) => string | undefined;\n find: (predicate: (id: string) => boolean, options?: IteratorOptions & FindOptions) => string | undefined;\n blur: () => void;\n active: () => string | undefined;\n focus: (id: string) => void;\n /**\n * @deprecated This function is not used internally anymore and will be removed in the future\n */\n focusLastActive: () => void;\n /**\n * Scrolls the active option into view, if it still exists\n */\n scrollActiveIntoView: () => void;\n hideAttributes: () => void;\n showAttributes: () => void;\n hideFocusVisibleAttributes: () => void;\n showFocusVisibleAttributes: () => void;\n}\n\nexport interface ActiveDescendantOptions {\n /**\n * @param el - HTML element to test\n * @returns whether the element can be an active descendant\n */\n matchOption: (el: HTMLElement) => boolean;\n /**\n * Forward imperative refs when exposing functionality from a React component\n */\n imperativeRef?: React.RefObject<ActiveDescendantImperativeRef | null>;\n}\n\nexport interface FindOptions {\n /**\n * Starts the search from a specific id\n */\n startFrom?: string;\n}\n\nexport interface UseActiveDescendantReturn<\n TActiveParentElement extends HTMLElement = HTMLElement,\n TListboxElement extends HTMLElement = HTMLElement,\n> {\n /**\n * Attach this to the element that contains all active descendants\n */\n listboxRef: React.Ref<TListboxElement>;\n /**\n * Attach this to the element that has an active descendant\n */\n activeParentRef: React.Ref<TActiveParentElement>;\n /**\n * Imperative functions to manage active descendants within the listboxRef\n */\n controller: ActiveDescendantImperativeRef;\n}\n\nexport interface IteratorOptions {\n /**\n * When passive, the active descendant is changed\n * @default false\n */\n passive?: boolean;\n}\n"],"names":[],"mappings":"AA8DA,WAMC"}
|
package/lib/button/types.js
CHANGED
package/lib/button/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/button/types.ts"],"sourcesContent":["import type {\n DistributiveOmit,\n ExtractSlotProps,\n Slot,\n UnionToIntersection,\n JSXIntrinsicElement,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport type ARIAButtonType = 'button' | 'a' | 'div';\n\nexport type ARIAButtonElement<AlternateAs extends 'a' | 'div' = 'a' | 'div'> =\n | HTMLButtonElement\n | (AlternateAs extends 'a' ? HTMLAnchorElement : never)\n | (AlternateAs extends 'div' ? HTMLDivElement : never);\n\n/**\n * @internal\n */\nexport type ARIAButtonElementIntersection<AlternateAs extends 'a' | 'div' = 'a' | 'div'> = UnionToIntersection<\n ARIAButtonElement<AlternateAs>\n>;\n\n/**\n * Props expected by `useARIAButtonProps` hooks\n */\nexport type ARIAButtonProps<Type extends ARIAButtonType = ARIAButtonType> = DistributiveOmit<\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.PropsWithRef<JSXIntrinsicElement<Type>>,\n 'children'\n> & {\n disabled?: boolean;\n /**\n * When set, allows the button to be focusable even when it has been disabled.\n * This is used in scenarios where it is important to keep a consistent tab order\n * for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n *\n * @default false\n */\n disabledFocusable?: boolean;\n};\n\nexport type ARIAButtonSlotProps<AlternateAs extends 'a' | 'div' = 'a' | 'div'> = ExtractSlotProps<\n Slot<'button', AlternateAs>\n> &\n Pick<ARIAButtonProps<ARIAButtonType>, 'disabled' | 'disabledFocusable'>;\n\n/**\n * Props that will be modified internally by `useARIAButtonProps` by each case.\n * This typing is to ensure a well specified return value for `useARIAbButtonProps`\n */\nexport type ARIAButtonAlteredProps<Type extends ARIAButtonType> =\n | (Type extends 'button'\n ? Pick<\n JSXIntrinsicElement<'button'>,\n 'onClick' | 'onKeyDown' | 'onKeyUp' | 'disabled' | 'aria-disabled' | 'tabIndex'\n >\n : never)\n | (Type extends 'a'\n ? Pick<\n JSXIntrinsicElement<'a'>,\n 'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-disabled' | 'tabIndex' | 'role' | 'href'\n >\n : never)\n | (Type extends 'div'\n ? Pick<JSXIntrinsicElement<'div'>, 'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-disabled' | 'tabIndex' | 'role'>\n : never);\n\n/**\n * Merge of props provided by the user and props provided internally.\n */\nexport type ARIAButtonResultProps<Type extends ARIAButtonType, Props> = Props &\n UnionToIntersection<ARIAButtonAlteredProps<Type>>;\n"],"names":[
|
|
1
|
+
{"version":3,"sources":["../src/button/types.ts"],"sourcesContent":["import type {\n DistributiveOmit,\n ExtractSlotProps,\n Slot,\n UnionToIntersection,\n JSXIntrinsicElement,\n} from '@fluentui/react-utilities';\nimport type * as React from 'react';\n\nexport type ARIAButtonType = 'button' | 'a' | 'div';\n\nexport type ARIAButtonElement<AlternateAs extends 'a' | 'div' = 'a' | 'div'> =\n | HTMLButtonElement\n | (AlternateAs extends 'a' ? HTMLAnchorElement : never)\n | (AlternateAs extends 'div' ? HTMLDivElement : never);\n\n/**\n * @internal\n */\nexport type ARIAButtonElementIntersection<AlternateAs extends 'a' | 'div' = 'a' | 'div'> = UnionToIntersection<\n ARIAButtonElement<AlternateAs>\n>;\n\n/**\n * Props expected by `useARIAButtonProps` hooks\n */\nexport type ARIAButtonProps<Type extends ARIAButtonType = ARIAButtonType> = DistributiveOmit<\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.PropsWithRef<JSXIntrinsicElement<Type>>,\n 'children'\n> & {\n disabled?: boolean;\n /**\n * When set, allows the button to be focusable even when it has been disabled.\n * This is used in scenarios where it is important to keep a consistent tab order\n * for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n *\n * @default false\n */\n disabledFocusable?: boolean;\n};\n\nexport type ARIAButtonSlotProps<AlternateAs extends 'a' | 'div' = 'a' | 'div'> = ExtractSlotProps<\n Slot<'button', AlternateAs>\n> &\n Pick<ARIAButtonProps<ARIAButtonType>, 'disabled' | 'disabledFocusable'>;\n\n/**\n * Props that will be modified internally by `useARIAButtonProps` by each case.\n * This typing is to ensure a well specified return value for `useARIAbButtonProps`\n */\nexport type ARIAButtonAlteredProps<Type extends ARIAButtonType> =\n | (Type extends 'button'\n ? Pick<\n JSXIntrinsicElement<'button'>,\n 'onClick' | 'onKeyDown' | 'onKeyUp' | 'disabled' | 'aria-disabled' | 'tabIndex'\n >\n : never)\n | (Type extends 'a'\n ? Pick<\n JSXIntrinsicElement<'a'>,\n 'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-disabled' | 'tabIndex' | 'role' | 'href'\n >\n : never)\n | (Type extends 'div'\n ? Pick<JSXIntrinsicElement<'div'>, 'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-disabled' | 'tabIndex' | 'role'>\n : never);\n\n/**\n * Merge of props provided by the user and props provided internally.\n */\nexport type ARIAButtonResultProps<Type extends ARIAButtonType, Props> = Props &\n UnionToIntersection<ARIAButtonAlteredProps<Type>>;\n"],"names":[],"mappings":"AAqEA;;CAEC,GACD,WACoD"}
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { Enter, Space } from '@fluentui/keyboard-keys';
|
|
3
3
|
import { useEventCallback } from '@fluentui/react-utilities';
|
|
4
|
-
import * as React from 'react';
|
|
5
4
|
/**
|
|
6
|
-
* @internal
|
|
7
|
-
*
|
|
8
5
|
* Button keyboard handling, role, disabled and tabIndex implementation that ensures ARIA spec
|
|
9
6
|
* for multiple scenarios of non native button elements. Ensuring 1st rule of ARIA for cases
|
|
10
7
|
* where no attribute addition is required.
|
|
11
8
|
*
|
|
9
|
+
* @internal
|
|
12
10
|
* @param type - the proper scenario to be interpreted by the hook.
|
|
13
11
|
* 1. `button` - Minimal interference from the hook, as semantic button already supports most of the states
|
|
14
12
|
* 2. `a` or `div` - Proper keyboard/mouse handling plus other support to ensure ARIA behavior
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/button/useARIAButtonProps.ts"],"sourcesContent":["'use client';\n\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonResultProps, ARIAButtonType } from './types';\n\n/**\n *
|
|
1
|
+
{"version":3,"sources":["../src/button/useARIAButtonProps.ts"],"sourcesContent":["'use client';\n\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport type * as React from 'react';\nimport type { ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonResultProps, ARIAButtonType } from './types';\n\n/**\n * Button keyboard handling, role, disabled and tabIndex implementation that ensures ARIA spec\n * for multiple scenarios of non native button elements. Ensuring 1st rule of ARIA for cases\n * where no attribute addition is required.\n *\n * @internal\n * @param type - the proper scenario to be interpreted by the hook.\n * 1. `button` - Minimal interference from the hook, as semantic button already supports most of the states\n * 2. `a` or `div` - Proper keyboard/mouse handling plus other support to ensure ARIA behavior\n * @param props - the props to be passed down the line to the desired element.\n * This hook will encapsulate proper properties, such as `onClick`, `onKeyDown`, `onKeyUp`, etc,.\n *\n * @example\n * ```tsx\n * const buttonProps = useARIAButtonProps('a', {\n * href: './some-route'\n * onClick: () => console.log('this should run both on click and Space and Enter')\n * })\n *\n * // ...\n *\n * return (\n * <a {...buttonProps}>This anchor will behave as a proper button</a>\n * )\n * ```\n */\nexport function useARIAButtonProps<Type extends ARIAButtonType, Props extends ARIAButtonProps<Type>>(\n type?: Type,\n props?: Props,\n): ARIAButtonResultProps<Type, Props> {\n const {\n disabled,\n disabledFocusable = false,\n ['aria-disabled']: ariaDisabled,\n onClick,\n onKeyDown,\n onKeyUp,\n ...rest\n } = props ?? {};\n\n const normalizedARIADisabled = typeof ariaDisabled === 'string' ? ariaDisabled === 'true' : ariaDisabled;\n\n const isDisabled = disabled || disabledFocusable || normalizedARIADisabled;\n\n const handleClick = useEventCallback((ev: React.MouseEvent<ARIAButtonElementIntersection>) => {\n if (isDisabled) {\n ev.preventDefault();\n ev.stopPropagation();\n } else {\n onClick?.(ev);\n }\n });\n\n const handleKeyDown = useEventCallback((ev: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n onKeyDown?.(ev);\n\n if (ev.isDefaultPrevented()) {\n return;\n }\n\n const key = ev.key;\n\n if (isDisabled && (key === Enter || key === Space)) {\n ev.preventDefault();\n ev.stopPropagation();\n return;\n }\n\n if (key === Space) {\n ev.preventDefault();\n return;\n }\n\n // If enter is pressed, activate the button\n else if (key === Enter) {\n ev.preventDefault();\n ev.currentTarget.click();\n }\n });\n\n const handleKeyUp = useEventCallback((ev: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n onKeyUp?.(ev);\n\n if (ev.isDefaultPrevented()) {\n return;\n }\n\n const key = ev.key;\n\n if (isDisabled && (key === Enter || key === Space)) {\n ev.preventDefault();\n ev.stopPropagation();\n return;\n }\n\n if (key === Space) {\n ev.preventDefault();\n ev.currentTarget.click();\n }\n });\n\n // If a <button> tag is to be rendered we just need to set disabled and aria-disabled correctly\n if (type === 'button' || type === undefined) {\n return {\n ...rest,\n disabled: disabled && !disabledFocusable,\n 'aria-disabled': disabledFocusable ? true : normalizedARIADisabled,\n // onclick should still use internal handler to ensure prevention if disabled\n // if disabledFocusable then there's no requirement for handlers as those events should not be propagated\n onClick: disabledFocusable ? undefined : handleClick,\n onKeyUp: disabledFocusable ? undefined : onKeyUp,\n onKeyDown: disabledFocusable ? undefined : onKeyDown,\n } as ARIAButtonResultProps<Type, Props>;\n }\n\n // If an <a> or <div> tag is to be rendered we have to remove disabled and type,\n // and set aria-disabled, role and tabIndex.\n else {\n // the role needs to be explicitly set if the href is undefined\n const isLink = !!(rest as ARIAButtonResultProps<'a', Props>).href;\n let roleOverride = isLink ? undefined : 'button';\n if (!roleOverride && isDisabled) {\n // need to set role=link explicitly for disabled links\n roleOverride = 'link';\n }\n\n const resultProps = {\n role: roleOverride,\n tabIndex: disabledFocusable || (!isLink && !disabled) ? 0 : undefined,\n ...rest,\n // If it's not a <button> than listeners are required even with disabledFocusable\n // Since you cannot assure the default behavior of the element\n // E.g: <a> will redirect on click\n onClick: handleClick,\n onKeyUp: handleKeyUp,\n onKeyDown: handleKeyDown,\n 'aria-disabled': isDisabled,\n } as ARIAButtonResultProps<Type, Props>;\n\n if (type === 'a' && isDisabled) {\n (resultProps as ARIAButtonResultProps<'a', Props>).href = undefined;\n }\n\n return resultProps;\n }\n}\n"],"names":["Enter","Space","useEventCallback","useARIAButtonProps","type","props","disabled","disabledFocusable","ariaDisabled","onClick","onKeyDown","onKeyUp","rest","normalizedARIADisabled","isDisabled","handleClick","ev","preventDefault","stopPropagation","handleKeyDown","isDefaultPrevented","key","currentTarget","click","handleKeyUp","undefined","isLink","href","roleOverride","resultProps","role","tabIndex"],"mappings":"AAAA;AAEA,SAASA,KAAK,EAAEC,KAAK,QAAQ,0BAA0B;AACvD,SAASC,gBAAgB,QAAQ,4BAA4B;AAI7D;;;;;;;;;;;;;;;;;;;;;;;;;CAyBC,GACD,OAAO,SAASC,mBACdC,IAAW,EACXC,KAAa;IAEb,MAAM,EACJC,QAAQ,EACRC,oBAAoB,KAAK,EACzB,CAAC,gBAAgB,EAAEC,YAAY,EAC/BC,OAAO,EACPC,SAAS,EACTC,OAAO,EACP,GAAGC,MACJ,GAAGP,kBAAAA,mBAAAA,QAAS,CAAC;IAEd,MAAMQ,yBAAyB,OAAOL,iBAAiB,WAAWA,iBAAiB,SAASA;IAE5F,MAAMM,aAAaR,YAAYC,qBAAqBM;IAEpD,MAAME,cAAcb,iBAAiB,CAACc;QACpC,IAAIF,YAAY;YACdE,GAAGC,cAAc;YACjBD,GAAGE,eAAe;QACpB,OAAO;YACLT,oBAAAA,8BAAAA,QAAUO;QACZ;IACF;IAEA,MAAMG,gBAAgBjB,iBAAiB,CAACc;QACtCN,sBAAAA,gCAAAA,UAAYM;QAEZ,IAAIA,GAAGI,kBAAkB,IAAI;YAC3B;QACF;QAEA,MAAMC,MAAML,GAAGK,GAAG;QAElB,IAAIP,cAAeO,CAAAA,QAAQrB,SAASqB,QAAQpB,KAAI,GAAI;YAClDe,GAAGC,cAAc;YACjBD,GAAGE,eAAe;YAClB;QACF;QAEA,IAAIG,QAAQpB,OAAO;YACjBe,GAAGC,cAAc;YACjB;QACF,OAGK,IAAII,QAAQrB,OAAO;YACtBgB,GAAGC,cAAc;YACjBD,GAAGM,aAAa,CAACC,KAAK;QACxB;IACF;IAEA,MAAMC,cAActB,iBAAiB,CAACc;QACpCL,oBAAAA,8BAAAA,QAAUK;QAEV,IAAIA,GAAGI,kBAAkB,IAAI;YAC3B;QACF;QAEA,MAAMC,MAAML,GAAGK,GAAG;QAElB,IAAIP,cAAeO,CAAAA,QAAQrB,SAASqB,QAAQpB,KAAI,GAAI;YAClDe,GAAGC,cAAc;YACjBD,GAAGE,eAAe;YAClB;QACF;QAEA,IAAIG,QAAQpB,OAAO;YACjBe,GAAGC,cAAc;YACjBD,GAAGM,aAAa,CAACC,KAAK;QACxB;IACF;IAEA,+FAA+F;IAC/F,IAAInB,SAAS,YAAYA,SAASqB,WAAW;QAC3C,OAAO;YACL,GAAGb,IAAI;YACPN,UAAUA,YAAY,CAACC;YACvB,iBAAiBA,oBAAoB,OAAOM;YAC5C,6EAA6E;YAC7E,yGAAyG;YACzGJ,SAASF,oBAAoBkB,YAAYV;YACzCJ,SAASJ,oBAAoBkB,YAAYd;YACzCD,WAAWH,oBAAoBkB,YAAYf;QAC7C;IACF,OAIK;QACH,+DAA+D;QAC/D,MAAMgB,SAAS,CAAC,CAAC,AAACd,KAA2Ce,IAAI;QACjE,IAAIC,eAAeF,SAASD,YAAY;QACxC,IAAI,CAACG,gBAAgBd,YAAY;YAC/B,sDAAsD;YACtDc,eAAe;QACjB;QAEA,MAAMC,cAAc;YAClBC,MAAMF;YACNG,UAAUxB,qBAAsB,CAACmB,UAAU,CAACpB,WAAY,IAAImB;YAC5D,GAAGb,IAAI;YACP,iFAAiF;YACjF,8DAA8D;YAC9D,kCAAkC;YAClCH,SAASM;YACTJ,SAASa;YACTd,WAAWS;YACX,iBAAiBL;QACnB;QAEA,IAAIV,SAAS,OAAOU,YAAY;YAC7Be,YAAkDF,IAAI,GAAGF;QAC5D;QAEA,OAAOI;IACT;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/useTypingAnnounce/useTypingAnnounce.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTimeout } from '@fluentui/react-utilities';\nimport { useAnnounce, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { AnnounceOptions } from '@fluentui/react-shared-contexts';\nimport { AriaLiveAnnounceFn } from '../AriaLiveAnnouncer/AriaLiveAnnouncer.types';\n\ntype Message = {\n message: string;\n options: AnnounceOptions;\n};\n\nconst valueMutationOptions = {\n attributes: true,\n subtree: true,\n characterData: true,\n attributeFilter: ['value'],\n};\n\ninterface TypingAnnounceReturn<TInputElement extends HTMLElement = HTMLElement> {\n typingAnnounce: AriaLiveAnnounceFn;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inputRef: React.MutableRefObject<TInputElement | null>;\n}\n\nexport function useTypingAnnounce<\n TInputElement extends HTMLElement = HTMLElement,\n>(): TypingAnnounceReturn<TInputElement> {\n const { targetDocument } = useFluent();\n const { announce } = useAnnounce();\n\n const inputRef = React.useRef<TInputElement | null>(null);\n const observer = React.useRef<MutationObserver>(undefined);\n const [setTypingTimeout, clearTypingTimeout] = useTimeout();\n const messageQueue = React.useRef<Message[]>([]);\n\n const callback: MutationCallback = React.useCallback(\n (mutationList, mutationObserver) => {\n setTypingTimeout(() => {\n messageQueue.current.forEach(({ message, options }) => {\n announce(message, options);\n });\n messageQueue.current.length = 0;\n mutationObserver.disconnect();\n }, 500);\n },\n [announce, setTypingTimeout],\n );\n\n const typingAnnounce: AriaLiveAnnounceFn = React.useCallback(\n (message: string, options: AnnounceOptions = {}) => {\n messageQueue.current.push({ message, options });\n\n if (inputRef.current && observer.current) {\n observer.current.observe(inputRef.current, valueMutationOptions);\n }\n\n setTypingTimeout(() => {\n observer.current && callback([], observer.current);\n }, 500);\n },\n [callback, inputRef, setTypingTimeout],\n );\n\n React.useEffect(() => {\n const win = targetDocument?.defaultView;\n if (!win) {\n return;\n }\n\n if (!observer.current) {\n observer.current = new win.MutationObserver(callback);\n }\n\n return () => {\n // Clean up the observer when the component unmounts\n if (observer.current) {\n observer.current.disconnect();\n clearTypingTimeout();\n }\n };\n }, [callback, clearTypingTimeout, targetDocument]);\n\n return { typingAnnounce, inputRef };\n}\n"],"names":["React","useTimeout","useAnnounce","useFluent_unstable","useFluent","valueMutationOptions","attributes","subtree","characterData","attributeFilter","useTypingAnnounce","targetDocument","announce","inputRef","useRef","observer","undefined","setTypingTimeout","clearTypingTimeout","messageQueue","callback","useCallback","mutationList","mutationObserver","current","forEach","message","options","length","disconnect","typingAnnounce","push","observe","useEffect","win","defaultView","MutationObserver"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,4BAA4B;AACvD,SAASC,WAAW,EAAEC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAS/F,MAAMC,uBAAuB;IAC3BC,YAAY;IACZC,SAAS;IACTC,eAAe;IACfC,iBAAiB;QAAC;KAAQ;AAC5B;AAQA,OAAO,SAASC;IAGd,MAAM,EAAEC,cAAc,EAAE,GAAGP;IAC3B,MAAM,EAAEQ,QAAQ,EAAE,GAAGV;IAErB,MAAMW,WAAWb,MAAMc,MAAM,CAAuB;IACpD,MAAMC,WAAWf,MAAMc,MAAM,CAAmBE;IAChD,MAAM,CAACC,kBAAkBC,mBAAmB,GAAGjB;IAC/C,MAAMkB,eAAenB,MAAMc,MAAM,CAAY,EAAE;IAE/C,MAAMM,WAA6BpB,MAAMqB,WAAW,CAClD,CAACC,cAAcC;QACbN,iBAAiB;YACfE,aAAaK,OAAO,CAACC,OAAO,CAAC,CAAC,EAAEC,OAAO,EAAEC,OAAO,EAAE;gBAChDf,SAASc,SAASC;YACpB;YACAR,aAAaK,OAAO,CAACI,MAAM,GAAG;YAC9BL,iBAAiBM,UAAU;QAC7B,GAAG;IACL,GACA;QAACjB;QAAUK;KAAiB;IAG9B,MAAMa,iBAAqC9B,MAAMqB,WAAW,CAC1D,CAACK,SAAiBC,UAA2B,CAAC,CAAC;QAC7CR,aAAaK,OAAO,CAACO,IAAI,CAAC;YAAEL;YAASC;QAAQ;QAE7C,IAAId,SAASW,OAAO,IAAIT,SAASS,OAAO,EAAE;YACxCT,SAASS,OAAO,CAACQ,OAAO,CAACnB,SAASW,OAAO,EAAEnB;QAC7C;QAEAY,iBAAiB;YACfF,SAASS,OAAO,IAAIJ,SAAS,EAAE,EAAEL,SAASS,OAAO;QACnD,GAAG;IACL,GACA;QAACJ;QAAUP;QAAUI;KAAiB;IAGxCjB,MAAMiC,SAAS,CAAC;QACd,MAAMC,MAAMvB,2BAAAA,qCAAAA,eAAgBwB,WAAW;QACvC,IAAI,CAACD,KAAK;YACR;QACF;QAEA,IAAI,CAACnB,SAASS,OAAO,EAAE;YACrBT,SAASS,OAAO,GAAG,IAAIU,IAAIE,gBAAgB,CAAChB;QAC9C;QAEA,OAAO;YACL,oDAAoD;YACpD,IAAIL,SAASS,OAAO,EAAE;gBACpBT,SAASS,OAAO,CAACK,UAAU;gBAC3BX;YACF;QACF;IACF,GAAG;QAACE;QAAUF;QAAoBP;KAAe;IAEjD,OAAO;QAAEmB;QAAgBjB;IAAS;AACpC"}
|
|
1
|
+
{"version":3,"sources":["../src/useTypingAnnounce/useTypingAnnounce.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTimeout } from '@fluentui/react-utilities';\nimport { useAnnounce, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { AnnounceOptions } from '@fluentui/react-shared-contexts';\nimport type { AriaLiveAnnounceFn } from '../AriaLiveAnnouncer/AriaLiveAnnouncer.types';\n\ntype Message = {\n message: string;\n options: AnnounceOptions;\n};\n\nconst valueMutationOptions = {\n attributes: true,\n subtree: true,\n characterData: true,\n attributeFilter: ['value'],\n};\n\ninterface TypingAnnounceReturn<TInputElement extends HTMLElement = HTMLElement> {\n typingAnnounce: AriaLiveAnnounceFn;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inputRef: React.MutableRefObject<TInputElement | null>;\n}\n\nexport function useTypingAnnounce<\n TInputElement extends HTMLElement = HTMLElement,\n>(): TypingAnnounceReturn<TInputElement> {\n const { targetDocument } = useFluent();\n const { announce } = useAnnounce();\n\n const inputRef = React.useRef<TInputElement | null>(null);\n const observer = React.useRef<MutationObserver>(undefined);\n const [setTypingTimeout, clearTypingTimeout] = useTimeout();\n const messageQueue = React.useRef<Message[]>([]);\n\n const callback: MutationCallback = React.useCallback(\n (mutationList, mutationObserver) => {\n setTypingTimeout(() => {\n messageQueue.current.forEach(({ message, options }) => {\n announce(message, options);\n });\n messageQueue.current.length = 0;\n mutationObserver.disconnect();\n }, 500);\n },\n [announce, setTypingTimeout],\n );\n\n const typingAnnounce: AriaLiveAnnounceFn = React.useCallback(\n (message: string, options: AnnounceOptions = {}) => {\n messageQueue.current.push({ message, options });\n\n if (inputRef.current && observer.current) {\n observer.current.observe(inputRef.current, valueMutationOptions);\n }\n\n setTypingTimeout(() => {\n observer.current && callback([], observer.current);\n }, 500);\n },\n [callback, inputRef, setTypingTimeout],\n );\n\n React.useEffect(() => {\n const win = targetDocument?.defaultView;\n if (!win) {\n return;\n }\n\n if (!observer.current) {\n observer.current = new win.MutationObserver(callback);\n }\n\n return () => {\n // Clean up the observer when the component unmounts\n if (observer.current) {\n observer.current.disconnect();\n clearTypingTimeout();\n }\n };\n }, [callback, clearTypingTimeout, targetDocument]);\n\n return { typingAnnounce, inputRef };\n}\n"],"names":["React","useTimeout","useAnnounce","useFluent_unstable","useFluent","valueMutationOptions","attributes","subtree","characterData","attributeFilter","useTypingAnnounce","targetDocument","announce","inputRef","useRef","observer","undefined","setTypingTimeout","clearTypingTimeout","messageQueue","callback","useCallback","mutationList","mutationObserver","current","forEach","message","options","length","disconnect","typingAnnounce","push","observe","useEffect","win","defaultView","MutationObserver"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,4BAA4B;AACvD,SAASC,WAAW,EAAEC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAS/F,MAAMC,uBAAuB;IAC3BC,YAAY;IACZC,SAAS;IACTC,eAAe;IACfC,iBAAiB;QAAC;KAAQ;AAC5B;AAQA,OAAO,SAASC;IAGd,MAAM,EAAEC,cAAc,EAAE,GAAGP;IAC3B,MAAM,EAAEQ,QAAQ,EAAE,GAAGV;IAErB,MAAMW,WAAWb,MAAMc,MAAM,CAAuB;IACpD,MAAMC,WAAWf,MAAMc,MAAM,CAAmBE;IAChD,MAAM,CAACC,kBAAkBC,mBAAmB,GAAGjB;IAC/C,MAAMkB,eAAenB,MAAMc,MAAM,CAAY,EAAE;IAE/C,MAAMM,WAA6BpB,MAAMqB,WAAW,CAClD,CAACC,cAAcC;QACbN,iBAAiB;YACfE,aAAaK,OAAO,CAACC,OAAO,CAAC,CAAC,EAAEC,OAAO,EAAEC,OAAO,EAAE;gBAChDf,SAASc,SAASC;YACpB;YACAR,aAAaK,OAAO,CAACI,MAAM,GAAG;YAC9BL,iBAAiBM,UAAU;QAC7B,GAAG;IACL,GACA;QAACjB;QAAUK;KAAiB;IAG9B,MAAMa,iBAAqC9B,MAAMqB,WAAW,CAC1D,CAACK,SAAiBC,UAA2B,CAAC,CAAC;QAC7CR,aAAaK,OAAO,CAACO,IAAI,CAAC;YAAEL;YAASC;QAAQ;QAE7C,IAAId,SAASW,OAAO,IAAIT,SAASS,OAAO,EAAE;YACxCT,SAASS,OAAO,CAACQ,OAAO,CAACnB,SAASW,OAAO,EAAEnB;QAC7C;QAEAY,iBAAiB;YACfF,SAASS,OAAO,IAAIJ,SAAS,EAAE,EAAEL,SAASS,OAAO;QACnD,GAAG;IACL,GACA;QAACJ;QAAUP;QAAUI;KAAiB;IAGxCjB,MAAMiC,SAAS,CAAC;QACd,MAAMC,MAAMvB,2BAAAA,qCAAAA,eAAgBwB,WAAW;QACvC,IAAI,CAACD,KAAK;YACR;QACF;QAEA,IAAI,CAACnB,SAASS,OAAO,EAAE;YACrBT,SAASS,OAAO,GAAG,IAAIU,IAAIE,gBAAgB,CAAChB;QAC9C;QAEA,OAAO;YACL,oDAAoD;YACpD,IAAIL,SAASS,OAAO,EAAE;gBACpBT,SAASS,OAAO,CAACK,UAAU;gBAC3BX;YACF;QACF;IACF,GAAG;QAACE;QAAUF;QAAoBP;KAAe;IAEjD,OAAO;QAAEmB;QAAgBjB;IAAS;AACpC"}
|
|
@@ -9,8 +9,6 @@ Object.defineProperty(exports, "AriaLiveAnnouncer", {
|
|
|
9
9
|
return AriaLiveAnnouncer;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
-
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
13
|
-
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
14
12
|
const _renderAriaLiveAnnouncer = require("./renderAriaLiveAnnouncer");
|
|
15
13
|
const _useAriaLiveAnnouncer = require("./useAriaLiveAnnouncer");
|
|
16
14
|
const _useAriaLiveAnnouncerContextValues = require("./useAriaLiveAnnouncerContextValues");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/AriaLiveAnnouncer/AriaLiveAnnouncer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type { AriaLiveAnnouncerProps } from './AriaLiveAnnouncer.types';\nimport { renderAriaLiveAnnouncer_unstable } from './renderAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncer_unstable } from './useAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncerContextValues_unstable } from './useAriaLiveAnnouncerContextValues';\n\n/**\n * A sample implementation of a component that manages aria live announcements.\n */\nexport const AriaLiveAnnouncer: React.FC<AriaLiveAnnouncerProps> = props => {\n const state = useAriaLiveAnnouncer_unstable(props);\n const contextValues = useAriaLiveAnnouncerContextValues_unstable(state);\n\n return renderAriaLiveAnnouncer_unstable(state, contextValues);\n};\n\nAriaLiveAnnouncer.displayName = 'AriaLiveAnnouncer';\n"],"names":["AriaLiveAnnouncer","props","state","useAriaLiveAnnouncer_unstable","contextValues","useAriaLiveAnnouncerContextValues_unstable","renderAriaLiveAnnouncer_unstable","displayName"],"mappings":"AAAA;;;;;+BAYaA;;;eAAAA
|
|
1
|
+
{"version":3,"sources":["../src/AriaLiveAnnouncer/AriaLiveAnnouncer.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\n\nimport type { AriaLiveAnnouncerProps } from './AriaLiveAnnouncer.types';\nimport { renderAriaLiveAnnouncer_unstable } from './renderAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncer_unstable } from './useAriaLiveAnnouncer';\nimport { useAriaLiveAnnouncerContextValues_unstable } from './useAriaLiveAnnouncerContextValues';\n\n/**\n * A sample implementation of a component that manages aria live announcements.\n */\nexport const AriaLiveAnnouncer: React.FC<AriaLiveAnnouncerProps> = props => {\n const state = useAriaLiveAnnouncer_unstable(props);\n const contextValues = useAriaLiveAnnouncerContextValues_unstable(state);\n\n return renderAriaLiveAnnouncer_unstable(state, contextValues);\n};\n\nAriaLiveAnnouncer.displayName = 'AriaLiveAnnouncer';\n"],"names":["AriaLiveAnnouncer","props","state","useAriaLiveAnnouncer_unstable","contextValues","useAriaLiveAnnouncerContextValues_unstable","renderAriaLiveAnnouncer_unstable","displayName"],"mappings":"AAAA;;;;;+BAYaA;;;eAAAA;;;yCAPoC;sCACH;mDACa;AAKpD,MAAMA,oBAAsDC,CAAAA;IACjE,MAAMC,QAAQC,IAAAA,mDAA6B,EAACF;IAC5C,MAAMG,gBAAgBC,IAAAA,6EAA0C,EAACH;IAEjE,OAAOI,IAAAA,yDAAgC,EAACJ,OAAOE;AACjD;AAEAJ,kBAAkBO,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/activedescendant/ActiveDescendantContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ActiveDescendantImperativeRef } from './types';\n\nexport type ActiveDescendantContextValue = {\n controller: ActiveDescendantImperativeRef;\n};\n\nconst noop = () => undefined;\n\nconst activeDescendantContextDefaultValue: ActiveDescendantContextValue = {\n controller: {\n active: noop,\n blur: noop,\n find: noop,\n first: noop,\n focus: noop,\n focusLastActive: noop,\n scrollActiveIntoView: noop,\n last: noop,\n next: noop,\n prev: noop,\n showAttributes: noop,\n hideAttributes: noop,\n showFocusVisibleAttributes: noop,\n hideFocusVisibleAttributes: noop,\n },\n};\n\nconst ActiveDescendantContext = React.createContext<ActiveDescendantContextValue | undefined>(undefined);\n\nexport const ActiveDescendantContextProvider = ActiveDescendantContext.Provider;\nexport const useActiveDescendantContext = (): ActiveDescendantContextValue =>\n React.useContext(ActiveDescendantContext) ?? activeDescendantContextDefaultValue;\nexport const useHasParentActiveDescendantContext = (): boolean => !!React.useContext(ActiveDescendantContext);\n"],"names":["ActiveDescendantContextProvider","useActiveDescendantContext","useHasParentActiveDescendantContext","noop","undefined","activeDescendantContextDefaultValue","controller","active","blur","find","first","focus","focusLastActive","scrollActiveIntoView","last","next","prev","showAttributes","hideAttributes","showFocusVisibleAttributes","hideFocusVisibleAttributes","ActiveDescendantContext","React","createContext","Provider","useContext"],"mappings":"AAAA;;;;;;;;;;;;IAgCaA,+BAA+B;eAA/BA;;IACAC,0BAA0B;eAA1BA;;IAEAC,mCAAmC;eAAnCA;;;;iEAjCU;AAOvB,MAAMC,OAAO,IAAMC;AAEnB,MAAMC,sCAAoE;IACxEC,YAAY;QACVC,QAAQJ;QACRK,MAAML;QACNM,MAAMN;QACNO,OAAOP;QACPQ,OAAOR;QACPS,iBAAiBT;QACjBU,sBAAsBV;QACtBW,MAAMX;QACNY,MAAMZ;QACNa,MAAMb;QACNc,gBAAgBd;QAChBe,gBAAgBf;QAChBgB,4BAA4BhB;QAC5BiB,4BAA4BjB;IAC9B;AACF;AAEA,MAAMkB,0BAA0BC,OAAMC,aAAa,CAA2CnB;AAEvF,MAAMJ,kCAAkCqB,wBAAwBG,QAAQ;AACxE,MAAMvB,6BAA6B;QACxCqB;WAAAA,CAAAA,oBAAAA,OAAMG,UAAU,CAACJ,sCAAjBC,+BAAAA,oBAA6CjB;;AACxC,MAAMH,sCAAsC,IAAe,CAAC,CAACoB,OAAMG,UAAU,CAACJ"}
|
|
1
|
+
{"version":3,"sources":["../src/activedescendant/ActiveDescendantContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ActiveDescendantImperativeRef } from './types';\n\nexport type ActiveDescendantContextValue = {\n controller: ActiveDescendantImperativeRef;\n};\n\nconst noop = () => undefined;\n\nconst activeDescendantContextDefaultValue: ActiveDescendantContextValue = {\n controller: {\n active: noop,\n blur: noop,\n find: noop,\n first: noop,\n focus: noop,\n focusLastActive: noop,\n scrollActiveIntoView: noop,\n last: noop,\n next: noop,\n prev: noop,\n showAttributes: noop,\n hideAttributes: noop,\n showFocusVisibleAttributes: noop,\n hideFocusVisibleAttributes: noop,\n },\n};\n\nconst ActiveDescendantContext = React.createContext<ActiveDescendantContextValue | undefined>(undefined);\n\nexport const ActiveDescendantContextProvider = ActiveDescendantContext.Provider;\nexport const useActiveDescendantContext = (): ActiveDescendantContextValue =>\n React.useContext(ActiveDescendantContext) ?? activeDescendantContextDefaultValue;\nexport const useHasParentActiveDescendantContext = (): boolean => !!React.useContext(ActiveDescendantContext);\n"],"names":["ActiveDescendantContextProvider","useActiveDescendantContext","useHasParentActiveDescendantContext","noop","undefined","activeDescendantContextDefaultValue","controller","active","blur","find","first","focus","focusLastActive","scrollActiveIntoView","last","next","prev","showAttributes","hideAttributes","showFocusVisibleAttributes","hideFocusVisibleAttributes","ActiveDescendantContext","React","createContext","Provider","useContext"],"mappings":"AAAA;;;;;;;;;;;;IAgCaA,+BAA+B;eAA/BA;;IACAC,0BAA0B;eAA1BA;;IAEAC,mCAAmC;eAAnCA;;;;iEAjCU;AAOvB,MAAMC,OAAO,IAAMC;AAEnB,MAAMC,sCAAoE;IACxEC,YAAY;QACVC,QAAQJ;QACRK,MAAML;QACNM,MAAMN;QACNO,OAAOP;QACPQ,OAAOR;QACPS,iBAAiBT;QACjBU,sBAAsBV;QACtBW,MAAMX;QACNY,MAAMZ;QACNa,MAAMb;QACNc,gBAAgBd;QAChBe,gBAAgBf;QAChBgB,4BAA4BhB;QAC5BiB,4BAA4BjB;IAC9B;AACF;AAEA,MAAMkB,0BAA0BC,OAAMC,aAAa,CAA2CnB;AAEvF,MAAMJ,kCAAkCqB,wBAAwBG,QAAQ;AACxE,MAAMvB,6BAA6B;QACxCqB;WAAAA,CAAAA,oBAAAA,OAAMG,UAAU,CAACJ,sCAAjBC,+BAAAA,oBAA6CjB;;AACxC,MAAMH,sCAAsC,IAAe,CAAC,CAACoB,OAAMG,UAAU,CAACJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":""}
|
|
@@ -9,10 +9,8 @@ Object.defineProperty(exports, "useARIAButtonProps", {
|
|
|
9
9
|
return useARIAButtonProps;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
-
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
13
12
|
const _keyboardkeys = require("@fluentui/keyboard-keys");
|
|
14
13
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
15
|
-
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
16
14
|
function useARIAButtonProps(type, props) {
|
|
17
15
|
const { disabled, disabledFocusable = false, ['aria-disabled']: ariaDisabled, onClick, onKeyDown, onKeyUp, ...rest } = props !== null && props !== void 0 ? props : {};
|
|
18
16
|
const normalizedARIADisabled = typeof ariaDisabled === 'string' ? ariaDisabled === 'true' : ariaDisabled;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/button/useARIAButtonProps.ts"],"sourcesContent":["'use client';\n\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonResultProps, ARIAButtonType } from './types';\n\n/**\n *
|
|
1
|
+
{"version":3,"sources":["../src/button/useARIAButtonProps.ts"],"sourcesContent":["'use client';\n\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport type * as React from 'react';\nimport type { ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonResultProps, ARIAButtonType } from './types';\n\n/**\n * Button keyboard handling, role, disabled and tabIndex implementation that ensures ARIA spec\n * for multiple scenarios of non native button elements. Ensuring 1st rule of ARIA for cases\n * where no attribute addition is required.\n *\n * @internal\n * @param type - the proper scenario to be interpreted by the hook.\n * 1. `button` - Minimal interference from the hook, as semantic button already supports most of the states\n * 2. `a` or `div` - Proper keyboard/mouse handling plus other support to ensure ARIA behavior\n * @param props - the props to be passed down the line to the desired element.\n * This hook will encapsulate proper properties, such as `onClick`, `onKeyDown`, `onKeyUp`, etc,.\n *\n * @example\n * ```tsx\n * const buttonProps = useARIAButtonProps('a', {\n * href: './some-route'\n * onClick: () => console.log('this should run both on click and Space and Enter')\n * })\n *\n * // ...\n *\n * return (\n * <a {...buttonProps}>This anchor will behave as a proper button</a>\n * )\n * ```\n */\nexport function useARIAButtonProps<Type extends ARIAButtonType, Props extends ARIAButtonProps<Type>>(\n type?: Type,\n props?: Props,\n): ARIAButtonResultProps<Type, Props> {\n const {\n disabled,\n disabledFocusable = false,\n ['aria-disabled']: ariaDisabled,\n onClick,\n onKeyDown,\n onKeyUp,\n ...rest\n } = props ?? {};\n\n const normalizedARIADisabled = typeof ariaDisabled === 'string' ? ariaDisabled === 'true' : ariaDisabled;\n\n const isDisabled = disabled || disabledFocusable || normalizedARIADisabled;\n\n const handleClick = useEventCallback((ev: React.MouseEvent<ARIAButtonElementIntersection>) => {\n if (isDisabled) {\n ev.preventDefault();\n ev.stopPropagation();\n } else {\n onClick?.(ev);\n }\n });\n\n const handleKeyDown = useEventCallback((ev: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n onKeyDown?.(ev);\n\n if (ev.isDefaultPrevented()) {\n return;\n }\n\n const key = ev.key;\n\n if (isDisabled && (key === Enter || key === Space)) {\n ev.preventDefault();\n ev.stopPropagation();\n return;\n }\n\n if (key === Space) {\n ev.preventDefault();\n return;\n }\n\n // If enter is pressed, activate the button\n else if (key === Enter) {\n ev.preventDefault();\n ev.currentTarget.click();\n }\n });\n\n const handleKeyUp = useEventCallback((ev: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n onKeyUp?.(ev);\n\n if (ev.isDefaultPrevented()) {\n return;\n }\n\n const key = ev.key;\n\n if (isDisabled && (key === Enter || key === Space)) {\n ev.preventDefault();\n ev.stopPropagation();\n return;\n }\n\n if (key === Space) {\n ev.preventDefault();\n ev.currentTarget.click();\n }\n });\n\n // If a <button> tag is to be rendered we just need to set disabled and aria-disabled correctly\n if (type === 'button' || type === undefined) {\n return {\n ...rest,\n disabled: disabled && !disabledFocusable,\n 'aria-disabled': disabledFocusable ? true : normalizedARIADisabled,\n // onclick should still use internal handler to ensure prevention if disabled\n // if disabledFocusable then there's no requirement for handlers as those events should not be propagated\n onClick: disabledFocusable ? undefined : handleClick,\n onKeyUp: disabledFocusable ? undefined : onKeyUp,\n onKeyDown: disabledFocusable ? undefined : onKeyDown,\n } as ARIAButtonResultProps<Type, Props>;\n }\n\n // If an <a> or <div> tag is to be rendered we have to remove disabled and type,\n // and set aria-disabled, role and tabIndex.\n else {\n // the role needs to be explicitly set if the href is undefined\n const isLink = !!(rest as ARIAButtonResultProps<'a', Props>).href;\n let roleOverride = isLink ? undefined : 'button';\n if (!roleOverride && isDisabled) {\n // need to set role=link explicitly for disabled links\n roleOverride = 'link';\n }\n\n const resultProps = {\n role: roleOverride,\n tabIndex: disabledFocusable || (!isLink && !disabled) ? 0 : undefined,\n ...rest,\n // If it's not a <button> than listeners are required even with disabledFocusable\n // Since you cannot assure the default behavior of the element\n // E.g: <a> will redirect on click\n onClick: handleClick,\n onKeyUp: handleKeyUp,\n onKeyDown: handleKeyDown,\n 'aria-disabled': isDisabled,\n } as ARIAButtonResultProps<Type, Props>;\n\n if (type === 'a' && isDisabled) {\n (resultProps as ARIAButtonResultProps<'a', Props>).href = undefined;\n }\n\n return resultProps;\n }\n}\n"],"names":["useARIAButtonProps","type","props","disabled","disabledFocusable","ariaDisabled","onClick","onKeyDown","onKeyUp","rest","normalizedARIADisabled","isDisabled","handleClick","useEventCallback","ev","preventDefault","stopPropagation","handleKeyDown","isDefaultPrevented","key","Enter","Space","currentTarget","click","handleKeyUp","undefined","isLink","href","roleOverride","resultProps","role","tabIndex"],"mappings":"AAAA;;;;;+BAiCgBA;;;eAAAA;;;8BA/Ba;gCACI;AA8B1B,SAASA,mBACdC,IAAW,EACXC,KAAa;IAEb,MAAM,EACJC,QAAQ,EACRC,oBAAoB,KAAK,EACzB,CAAC,gBAAgB,EAAEC,YAAY,EAC/BC,OAAO,EACPC,SAAS,EACTC,OAAO,EACP,GAAGC,MACJ,GAAGP,kBAAAA,mBAAAA,QAAS,CAAC;IAEd,MAAMQ,yBAAyB,OAAOL,iBAAiB,WAAWA,iBAAiB,SAASA;IAE5F,MAAMM,aAAaR,YAAYC,qBAAqBM;IAEpD,MAAME,cAAcC,IAAAA,gCAAgB,EAAC,CAACC;QACpC,IAAIH,YAAY;YACdG,GAAGC,cAAc;YACjBD,GAAGE,eAAe;QACpB,OAAO;YACLV,oBAAAA,8BAAAA,QAAUQ;QACZ;IACF;IAEA,MAAMG,gBAAgBJ,IAAAA,gCAAgB,EAAC,CAACC;QACtCP,sBAAAA,gCAAAA,UAAYO;QAEZ,IAAIA,GAAGI,kBAAkB,IAAI;YAC3B;QACF;QAEA,MAAMC,MAAML,GAAGK,GAAG;QAElB,IAAIR,cAAeQ,CAAAA,QAAQC,mBAAK,IAAID,QAAQE,mBAAK,AAAD,GAAI;YAClDP,GAAGC,cAAc;YACjBD,GAAGE,eAAe;YAClB;QACF;QAEA,IAAIG,QAAQE,mBAAK,EAAE;YACjBP,GAAGC,cAAc;YACjB;QACF,OAGK,IAAII,QAAQC,mBAAK,EAAE;YACtBN,GAAGC,cAAc;YACjBD,GAAGQ,aAAa,CAACC,KAAK;QACxB;IACF;IAEA,MAAMC,cAAcX,IAAAA,gCAAgB,EAAC,CAACC;QACpCN,oBAAAA,8BAAAA,QAAUM;QAEV,IAAIA,GAAGI,kBAAkB,IAAI;YAC3B;QACF;QAEA,MAAMC,MAAML,GAAGK,GAAG;QAElB,IAAIR,cAAeQ,CAAAA,QAAQC,mBAAK,IAAID,QAAQE,mBAAK,AAAD,GAAI;YAClDP,GAAGC,cAAc;YACjBD,GAAGE,eAAe;YAClB;QACF;QAEA,IAAIG,QAAQE,mBAAK,EAAE;YACjBP,GAAGC,cAAc;YACjBD,GAAGQ,aAAa,CAACC,KAAK;QACxB;IACF;IAEA,+FAA+F;IAC/F,IAAItB,SAAS,YAAYA,SAASwB,WAAW;QAC3C,OAAO;YACL,GAAGhB,IAAI;YACPN,UAAUA,YAAY,CAACC;YACvB,iBAAiBA,oBAAoB,OAAOM;YAC5C,6EAA6E;YAC7E,yGAAyG;YACzGJ,SAASF,oBAAoBqB,YAAYb;YACzCJ,SAASJ,oBAAoBqB,YAAYjB;YACzCD,WAAWH,oBAAoBqB,YAAYlB;QAC7C;IACF,OAIK;QACH,+DAA+D;QAC/D,MAAMmB,SAAS,CAAC,CAAC,AAACjB,KAA2CkB,IAAI;QACjE,IAAIC,eAAeF,SAASD,YAAY;QACxC,IAAI,CAACG,gBAAgBjB,YAAY;YAC/B,sDAAsD;YACtDiB,eAAe;QACjB;QAEA,MAAMC,cAAc;YAClBC,MAAMF;YACNG,UAAU3B,qBAAsB,CAACsB,UAAU,CAACvB,WAAY,IAAIsB;YAC5D,GAAGhB,IAAI;YACP,iFAAiF;YACjF,8DAA8D;YAC9D,kCAAkC;YAClCH,SAASM;YACTJ,SAASgB;YACTjB,WAAWU;YACX,iBAAiBN;QACnB;QAEA,IAAIV,SAAS,OAAOU,YAAY;YAC7BkB,YAAkDF,IAAI,GAAGF;QAC5D;QAEA,OAAOI;IACT;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/useTypingAnnounce/useTypingAnnounce.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTimeout } from '@fluentui/react-utilities';\nimport { useAnnounce, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { AnnounceOptions } from '@fluentui/react-shared-contexts';\nimport { AriaLiveAnnounceFn } from '../AriaLiveAnnouncer/AriaLiveAnnouncer.types';\n\ntype Message = {\n message: string;\n options: AnnounceOptions;\n};\n\nconst valueMutationOptions = {\n attributes: true,\n subtree: true,\n characterData: true,\n attributeFilter: ['value'],\n};\n\ninterface TypingAnnounceReturn<TInputElement extends HTMLElement = HTMLElement> {\n typingAnnounce: AriaLiveAnnounceFn;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inputRef: React.MutableRefObject<TInputElement | null>;\n}\n\nexport function useTypingAnnounce<\n TInputElement extends HTMLElement = HTMLElement,\n>(): TypingAnnounceReturn<TInputElement> {\n const { targetDocument } = useFluent();\n const { announce } = useAnnounce();\n\n const inputRef = React.useRef<TInputElement | null>(null);\n const observer = React.useRef<MutationObserver>(undefined);\n const [setTypingTimeout, clearTypingTimeout] = useTimeout();\n const messageQueue = React.useRef<Message[]>([]);\n\n const callback: MutationCallback = React.useCallback(\n (mutationList, mutationObserver) => {\n setTypingTimeout(() => {\n messageQueue.current.forEach(({ message, options }) => {\n announce(message, options);\n });\n messageQueue.current.length = 0;\n mutationObserver.disconnect();\n }, 500);\n },\n [announce, setTypingTimeout],\n );\n\n const typingAnnounce: AriaLiveAnnounceFn = React.useCallback(\n (message: string, options: AnnounceOptions = {}) => {\n messageQueue.current.push({ message, options });\n\n if (inputRef.current && observer.current) {\n observer.current.observe(inputRef.current, valueMutationOptions);\n }\n\n setTypingTimeout(() => {\n observer.current && callback([], observer.current);\n }, 500);\n },\n [callback, inputRef, setTypingTimeout],\n );\n\n React.useEffect(() => {\n const win = targetDocument?.defaultView;\n if (!win) {\n return;\n }\n\n if (!observer.current) {\n observer.current = new win.MutationObserver(callback);\n }\n\n return () => {\n // Clean up the observer when the component unmounts\n if (observer.current) {\n observer.current.disconnect();\n clearTypingTimeout();\n }\n };\n }, [callback, clearTypingTimeout, targetDocument]);\n\n return { typingAnnounce, inputRef };\n}\n"],"names":["useTypingAnnounce","valueMutationOptions","attributes","subtree","characterData","attributeFilter","targetDocument","useFluent","announce","useAnnounce","inputRef","React","useRef","observer","undefined","setTypingTimeout","clearTypingTimeout","useTimeout","messageQueue","callback","useCallback","mutationList","mutationObserver","current","forEach","message","options","length","disconnect","typingAnnounce","push","observe","useEffect","win","defaultView","MutationObserver"],"mappings":"AAAA;;;;;+BA0BgBA;;;eAAAA;;;;iEAxBO;gCACI;qCACkC;AAS7D,MAAMC,uBAAuB;IAC3BC,YAAY;IACZC,SAAS;IACTC,eAAe;IACfC,iBAAiB;QAAC;KAAQ;AAC5B;AAQO,SAASL;IAGd,MAAM,EAAEM,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,IAAAA,gCAAW;IAEhC,MAAMC,WAAWC,OAAMC,MAAM,CAAuB;IACpD,MAAMC,WAAWF,OAAMC,MAAM,CAAmBE;IAChD,MAAM,CAACC,kBAAkBC,mBAAmB,GAAGC,IAAAA,0BAAU;IACzD,MAAMC,eAAeP,OAAMC,MAAM,CAAY,EAAE;IAE/C,MAAMO,WAA6BR,OAAMS,WAAW,CAClD,CAACC,cAAcC;QACbP,iBAAiB;YACfG,aAAaK,OAAO,CAACC,OAAO,CAAC,CAAC,EAAEC,OAAO,EAAEC,OAAO,EAAE;gBAChDlB,SAASiB,SAASC;YACpB;YACAR,aAAaK,OAAO,CAACI,MAAM,GAAG;YAC9BL,iBAAiBM,UAAU;QAC7B,GAAG;IACL,GACA;QAACpB;QAAUO;KAAiB;IAG9B,MAAMc,iBAAqClB,OAAMS,WAAW,CAC1D,CAACK,SAAiBC,UAA2B,CAAC,CAAC;QAC7CR,aAAaK,OAAO,CAACO,IAAI,CAAC;YAAEL;YAASC;QAAQ;QAE7C,IAAIhB,SAASa,OAAO,IAAIV,SAASU,OAAO,EAAE;YACxCV,SAASU,OAAO,CAACQ,OAAO,CAACrB,SAASa,OAAO,EAAEtB;QAC7C;QAEAc,iBAAiB;YACfF,SAASU,OAAO,IAAIJ,SAAS,EAAE,EAAEN,SAASU,OAAO;QACnD,GAAG;IACL,GACA;QAACJ;QAAUT;QAAUK;KAAiB;IAGxCJ,OAAMqB,SAAS,CAAC;QACd,MAAMC,MAAM3B,2BAAAA,qCAAAA,eAAgB4B,WAAW;QACvC,IAAI,CAACD,KAAK;YACR;QACF;QAEA,IAAI,CAACpB,SAASU,OAAO,EAAE;YACrBV,SAASU,OAAO,GAAG,IAAIU,IAAIE,gBAAgB,CAAChB;QAC9C;QAEA,OAAO;YACL,oDAAoD;YACpD,IAAIN,SAASU,OAAO,EAAE;gBACpBV,SAASU,OAAO,CAACK,UAAU;gBAC3BZ;YACF;QACF;IACF,GAAG;QAACG;QAAUH;QAAoBV;KAAe;IAEjD,OAAO;QAAEuB;QAAgBnB;IAAS;AACpC"}
|
|
1
|
+
{"version":3,"sources":["../src/useTypingAnnounce/useTypingAnnounce.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTimeout } from '@fluentui/react-utilities';\nimport { useAnnounce, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { AnnounceOptions } from '@fluentui/react-shared-contexts';\nimport type { AriaLiveAnnounceFn } from '../AriaLiveAnnouncer/AriaLiveAnnouncer.types';\n\ntype Message = {\n message: string;\n options: AnnounceOptions;\n};\n\nconst valueMutationOptions = {\n attributes: true,\n subtree: true,\n characterData: true,\n attributeFilter: ['value'],\n};\n\ninterface TypingAnnounceReturn<TInputElement extends HTMLElement = HTMLElement> {\n typingAnnounce: AriaLiveAnnounceFn;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inputRef: React.MutableRefObject<TInputElement | null>;\n}\n\nexport function useTypingAnnounce<\n TInputElement extends HTMLElement = HTMLElement,\n>(): TypingAnnounceReturn<TInputElement> {\n const { targetDocument } = useFluent();\n const { announce } = useAnnounce();\n\n const inputRef = React.useRef<TInputElement | null>(null);\n const observer = React.useRef<MutationObserver>(undefined);\n const [setTypingTimeout, clearTypingTimeout] = useTimeout();\n const messageQueue = React.useRef<Message[]>([]);\n\n const callback: MutationCallback = React.useCallback(\n (mutationList, mutationObserver) => {\n setTypingTimeout(() => {\n messageQueue.current.forEach(({ message, options }) => {\n announce(message, options);\n });\n messageQueue.current.length = 0;\n mutationObserver.disconnect();\n }, 500);\n },\n [announce, setTypingTimeout],\n );\n\n const typingAnnounce: AriaLiveAnnounceFn = React.useCallback(\n (message: string, options: AnnounceOptions = {}) => {\n messageQueue.current.push({ message, options });\n\n if (inputRef.current && observer.current) {\n observer.current.observe(inputRef.current, valueMutationOptions);\n }\n\n setTypingTimeout(() => {\n observer.current && callback([], observer.current);\n }, 500);\n },\n [callback, inputRef, setTypingTimeout],\n );\n\n React.useEffect(() => {\n const win = targetDocument?.defaultView;\n if (!win) {\n return;\n }\n\n if (!observer.current) {\n observer.current = new win.MutationObserver(callback);\n }\n\n return () => {\n // Clean up the observer when the component unmounts\n if (observer.current) {\n observer.current.disconnect();\n clearTypingTimeout();\n }\n };\n }, [callback, clearTypingTimeout, targetDocument]);\n\n return { typingAnnounce, inputRef };\n}\n"],"names":["useTypingAnnounce","valueMutationOptions","attributes","subtree","characterData","attributeFilter","targetDocument","useFluent","announce","useAnnounce","inputRef","React","useRef","observer","undefined","setTypingTimeout","clearTypingTimeout","useTimeout","messageQueue","callback","useCallback","mutationList","mutationObserver","current","forEach","message","options","length","disconnect","typingAnnounce","push","observe","useEffect","win","defaultView","MutationObserver"],"mappings":"AAAA;;;;;+BA0BgBA;;;eAAAA;;;;iEAxBO;gCACI;qCACkC;AAS7D,MAAMC,uBAAuB;IAC3BC,YAAY;IACZC,SAAS;IACTC,eAAe;IACfC,iBAAiB;QAAC;KAAQ;AAC5B;AAQO,SAASL;IAGd,MAAM,EAAEM,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,IAAAA,gCAAW;IAEhC,MAAMC,WAAWC,OAAMC,MAAM,CAAuB;IACpD,MAAMC,WAAWF,OAAMC,MAAM,CAAmBE;IAChD,MAAM,CAACC,kBAAkBC,mBAAmB,GAAGC,IAAAA,0BAAU;IACzD,MAAMC,eAAeP,OAAMC,MAAM,CAAY,EAAE;IAE/C,MAAMO,WAA6BR,OAAMS,WAAW,CAClD,CAACC,cAAcC;QACbP,iBAAiB;YACfG,aAAaK,OAAO,CAACC,OAAO,CAAC,CAAC,EAAEC,OAAO,EAAEC,OAAO,EAAE;gBAChDlB,SAASiB,SAASC;YACpB;YACAR,aAAaK,OAAO,CAACI,MAAM,GAAG;YAC9BL,iBAAiBM,UAAU;QAC7B,GAAG;IACL,GACA;QAACpB;QAAUO;KAAiB;IAG9B,MAAMc,iBAAqClB,OAAMS,WAAW,CAC1D,CAACK,SAAiBC,UAA2B,CAAC,CAAC;QAC7CR,aAAaK,OAAO,CAACO,IAAI,CAAC;YAAEL;YAASC;QAAQ;QAE7C,IAAIhB,SAASa,OAAO,IAAIV,SAASU,OAAO,EAAE;YACxCV,SAASU,OAAO,CAACQ,OAAO,CAACrB,SAASa,OAAO,EAAEtB;QAC7C;QAEAc,iBAAiB;YACfF,SAASU,OAAO,IAAIJ,SAAS,EAAE,EAAEN,SAASU,OAAO;QACnD,GAAG;IACL,GACA;QAACJ;QAAUT;QAAUK;KAAiB;IAGxCJ,OAAMqB,SAAS,CAAC;QACd,MAAMC,MAAM3B,2BAAAA,qCAAAA,eAAgB4B,WAAW;QACvC,IAAI,CAACD,KAAK;YACR;QACF;QAEA,IAAI,CAACpB,SAASU,OAAO,EAAE;YACrBV,SAASU,OAAO,GAAG,IAAIU,IAAIE,gBAAgB,CAAChB;QAC9C;QAEA,OAAO;YACL,oDAAoD;YACpD,IAAIN,SAASU,OAAO,EAAE;gBACpBV,SAASU,OAAO,CAACK,UAAU;gBAC3BZ;YACF;QACF;IACF,GAAG;QAACG;QAAUH;QAAoBV;KAAe;IAEjD,OAAO;QAAEuB;QAAgBnB;IAAS;AACpC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-aria",
|
|
3
|
-
"version": "9.17.
|
|
3
|
+
"version": "9.17.11",
|
|
4
4
|
"description": "React helper to ensure ARIA",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@fluentui/keyboard-keys": "^9.0.8",
|
|
16
16
|
"@fluentui/react-shared-contexts": "^9.26.2",
|
|
17
|
-
"@fluentui/react-jsx-runtime": "^9.4.
|
|
18
|
-
"@fluentui/react-tabster": "^9.26.
|
|
19
|
-
"@fluentui/react-utilities": "^9.26.
|
|
17
|
+
"@fluentui/react-jsx-runtime": "^9.4.2",
|
|
18
|
+
"@fluentui/react-tabster": "^9.26.14",
|
|
19
|
+
"@fluentui/react-utilities": "^9.26.3",
|
|
20
20
|
"@swc/helpers": "^0.5.1"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|