@fluentui/react-utilities 0.0.0-nightly65dd5f749420211213.1 → 0.0.0-nightly6a6e258c4020220125.1

package/CHANGELOG.json

@@ -2,17 +2,35 @@
   "name": "@fluentui/react-utilities",
   "entries": [
     {
-      "date": "Mon, 13 Dec 2021 04:16:35 GMT",
-      "tag": "@fluentui/react-utilities_v0.0.0-nightly65dd5f749420211213.1",
-      "version": "0.0.0-nightly65dd5f749420211213.1",
+      "date": "Tue, 25 Jan 2022 04:17:22 GMT",
+      "tag": "@fluentui/react-utilities_v0.0.0-nightly6a6e258c4020220125.1",
+      "version": "0.0.0-nightly6a6e258c4020220125.1",
       "comments": {
         "prerelease": [
           {
             "author": "email not defined",
             "package": "@fluentui/react-utilities",
-            "commit": "77618a4c1c41ffdcf3d5d21ea90d20af614da6f1",
+            "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d",
             "comment": "Release nightly v9"
           },
+          {
+            "author": "behowell@microsoft.com",
+            "package": "@fluentui/react-utilities",
+            "commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
+            "comment": "Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
+          },
+          {
+            "author": "behowell@microsoft.com",
+            "package": "@fluentui/react-utilities",
+            "commit": "7cc28ed8320b00f42d91c63882f10316db2205c5",
+            "comment": "getSlots: remove slotNames param, and infer from state.components instead"
+          },
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-utilities",
+            "commit": "d2eb57808a403b70845a732a62b55aa64d66b2a0",
+            "comment": "add useTriggerElement() hook"
+          },
           {
             "author": "elcraig@microsoft.com",
             "package": "@fluentui/react-utilities",
@@ -22,8 +40,8 @@
           {
             "author": "beachball",
             "package": "@fluentui/react-utilities",
-            "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly65dd5f749420211213.1",
-            "commit": "77618a4c1c41ffdcf3d5d21ea90d20af614da6f1"
+            "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly6a6e258c4020220125.1",
+            "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
           }
         ],
         "none": [
@@ -33,11 +51,29 @@
             "commit": "3360b45ec159250b1346c91afad7dce138e6bc20",
             "comment": "Update API file to version generated by typescript 4.3"
           },
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-utilities",
+            "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
+            "comment": "remove inline-style-expand-shorthand from tsconfigs"
+          },
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-utilities",
+            "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
+            "comment": "chore: use storybook runner for all vNext packages"
+          },
           {
             "author": "seanmonahan@microsoft.com",
             "package": "@fluentui/react-utilities",
             "commit": "6404bef16cebf1f67b9b80a9f6d5f605f9873df1",
             "comment": "Update getSlots() docs."
+          },
+          {
+            "author": "lingfangao@hotmail.com",
+            "package": "@fluentui/react-utilities",
+            "commit": "a4e048a0e03ddd676670da516e3a6612b26ea500",
+            "comment": "chore: Remove enzyme from react-utilities tests"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,19 +1,22 @@
 # Change Log - @fluentui/react-utilities
 
-This log was last generated on Mon, 13 Dec 2021 04:16:35 GMT and should not be manually modified.
+This log was last generated on Tue, 25 Jan 2022 04:17:22 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly65dd5f749420211213.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v0.0.0-nightly65dd5f749420211213.1)
+## [0.0.0-nightly6a6e258c4020220125.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v0.0.0-nightly6a6e258c4020220125.1)
 
-Mon, 13 Dec 2021 04:16:35 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.4..@fluentui/react-utilities_v0.0.0-nightly65dd5f749420211213.1)
+Tue, 25 Jan 2022 04:17:22 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.4..@fluentui/react-utilities_v0.0.0-nightly6a6e258c4020220125.1)
 
 ### Changes
 
-- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/77618a4c1c41ffdcf3d5d21ea90d20af614da6f1) by email not defined)
+- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by email not defined)
+- Rename component hooks add the suffix _unstable, as their API has not been finalized yet ([PR #21365](https://github.com/microsoft/fluentui/pull/21365) by behowell@microsoft.com)
+- getSlots: remove slotNames param, and infer from state.components instead ([PR #21134](https://github.com/microsoft/fluentui/pull/21134) by behowell@microsoft.com)
+- add useTriggerElement() hook ([PR #21225](https://github.com/microsoft/fluentui/pull/21225) by olfedias@microsoft.com)
 - [breaking] Remove useControllableValue hook (use useControllableState instead) ([PR #20865](https://github.com/microsoft/fluentui/pull/20865) by elcraig@microsoft.com)
-- Bump @fluentui/keyboard-keys to v0.0.0-nightly65dd5f749420211213.1 ([commit](https://github.com/microsoft/fluentui/commit/77618a4c1c41ffdcf3d5d21ea90d20af614da6f1) by beachball)
+- Bump @fluentui/keyboard-keys to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
 
 ## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-beta.4)
 

package/dist/react-utilities.d.ts

@@ -76,7 +76,7 @@ export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord
 }, Primary & 'root'> & PropsWithoutRef<Shorthands[Primary]>;
 
 export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
-    components?: {
+    components: {
         [Key in keyof Shorthands]-?: React_2.ComponentType<NonNullable<Shorthands[Key]> extends ObjectShorthandProps<infer P> ? P : NonNullable<Shorthands[Key]>> | (NonNullable<Shorthands[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
     };
 } & Shorthands;
@@ -185,10 +185,9 @@ export declare const getRTLSafeKey: (key: string, dir: 'ltr' | 'rtl') => string;
  * runtime code filtering props in this function.
  *
  * @param state - State including slot definitions
- * @param slotNames - Name of which props are slots
  * @returns An object containing the `slots` map and `slotProps` map.
  */
-export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>, slotNames?: (keyof R)[]): {
+export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>): {
     slots: Slots<R>;
     slotProps: SlotProps<R>;
 };
@@ -643,6 +642,25 @@ export declare function useSSRContext(): SSRContextValue;
  */
 export declare function useTimeout(): readonly [(fn: () => void, delay: number) => void, () => void];
 
+/**
+ * A hook that handles "trigger" pattern.
+ *
+ * Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
+ * by reference.
+ */
+export declare function useTriggerElement<TriggerProps extends React_2.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React_2.ReactNode;
+
+export declare type UseTriggerElementOptions<TriggerProps> = {
+    /** An actual trigger element or render props function. */
+    children: React_2.ReactElement | ((props: TriggerProps) => React_2.ReactNode) | null | undefined;
+    /** A ref to trigger element. */
+    ref: React_2.Ref<unknown> | undefined;
+    /** Props that are passed to a parent component and should be forwarded down. */
+    outerProps: React_2.HTMLProps<unknown>;
+    /** Custom props including callbacks. */
+    overrideProps: TriggerProps;
+};
+
 /**
  * Hook which synchronously executes a callback when the component is about to unmount.
  *

package/lib/compose/getSlots.d.ts

@@ -21,10 +21,9 @@ declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
  * runtime code filtering props in this function.
  *
  * @param state - State including slot definitions
- * @param slotNames - Name of which props are slots
  * @returns An object containing the `slots` map and `slotProps` map.
  */
-export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>, slotNames?: (keyof R)[]): {
+export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>): {
     slots: Slots<R>;
     slotProps: SlotProps<R>;
 };

package/lib/compose/getSlots.js

@@ -16,13 +16,13 @@ import { omit } from '../utils/omit';
  * runtime code filtering props in this function.
  *
  * @param state - State including slot definitions
- * @param slotNames - Name of which props are slots
  * @returns An object containing the `slots` map and `slotProps` map.
  */
 
-export function getSlots(state, slotNames = ['root']) {
+export function getSlots(state) {
   const slots = {};
   const slotProps = {};
+  const slotNames = Object.keys(state.components);
 
   for (const slotName of slotNames) {
     const [slot, props] = getSlot(state, slotName);

package/lib/compose/getSlots.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAUA,SAAS,UAAT,QAA2B,cAA3B;AACA,SAAS,IAAT,QAAqB,eAArB;AAqBA;;;;;;;;;;;;;;;;;AAiBG;;AACH,OAAM,SAAU,QAAV,CACJ,KADI,EAEJ,SAAA,GAAyB,CAAC,MAAD,CAFrB,EAE6B;AAKjC,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;;AAEA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAED,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAI,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAA4B,CAAA,EAAA,GAAA,KAAK,CAAC,QAAD,CAAL,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,QAAD,CAAN,EAAmB,CAAC,IAAD,CAAnB,CAAP,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}
+{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAUA,SAAS,UAAT,QAA2B,cAA3B;AACA,SAAS,IAAT,QAAqB,eAArB;AAqBA;;;;;;;;;;;;;;;;AAgBG;;AACH,OAAM,SAAU,QAAV,CACJ,KADI,EACoB;AAKxB,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;AAEA,QAAM,SAAS,GAAgB,MAAM,CAAC,IAAP,CAAY,KAAK,CAAC,UAAlB,CAA/B;;AACA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAED,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAI,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAA4B,CAAA,EAAA,GAAA,KAAK,CAAC,QAAD,CAAL,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,QAAD,CAAN,EAAmB,CAAC,IAAD,CAAnB,CAAP,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}

package/lib/compose/types.d.ts

@@ -79,7 +79,7 @@ export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord
     [Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
 }, Primary & 'root'> & PropsWithoutRef<Shorthands[Primary]>;
 export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
-    components?: {
+    components: {
         [Key in keyof Shorthands]-?: React.ComponentType<NonNullable<Shorthands[Key]> extends ObjectShorthandProps<infer P> ? P : NonNullable<Shorthands[Key]>> | (NonNullable<Shorthands[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
     };
 } & Shorthands;

package/lib/hooks/index.d.ts

@@ -11,5 +11,6 @@ export * from './useOnClickOutside';
 export * from './useOnScrollOutside';
 export * from './usePrevious';
 export * from './useTimeout';
+export * from './useTriggerElement';
 export * from './useUnmount';
 export * from './useForceUpdate';

package/lib/hooks/index.js

@@ -11,6 +11,7 @@ export * from './useOnClickOutside';
 export * from './useOnScrollOutside';
 export * from './usePrevious';
 export * from './useTimeout';
+export * from './useTriggerElement';
 export * from './useUnmount';
 export * from './useForceUpdate';
 //# sourceMappingURL=index.js.map

package/lib/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC"}

package/lib/hooks/useTriggerElement.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+export declare type UseTriggerElementOptions<TriggerProps> = {
+    /** An actual trigger element or render props function. */
+    children: React.ReactElement | ((props: TriggerProps) => React.ReactNode) | null | undefined;
+    /** A ref to trigger element. */
+    ref: React.Ref<unknown> | undefined;
+    /** Props that are passed to a parent component and should be forwarded down. */
+    outerProps: React.HTMLProps<unknown>;
+    /** Custom props including callbacks. */
+    overrideProps: TriggerProps;
+};
+/**
+ * A hook that handles "trigger" pattern.
+ *
+ * Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
+ * by reference.
+ */
+export declare function useTriggerElement<TriggerProps extends React.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React.ReactNode;

package/lib/hooks/useTriggerElement.js

@@ -0,0 +1,90 @@
+import * as React from 'react';
+import { applyTriggerPropsToChildren } from '../utils/applyTriggerPropsToChildren';
+import { getReactCallbackName } from '../utils/getReactCallbackName';
+import { onlyChild } from '../utils/onlyChild';
+import { useEventCallback } from './useEventCallback';
+import { useMergedRefs } from './useMergedRefs';
+const CAPTURE_CALLBACK_REGEX = /on[A-Z].+Capture$/;
+const CALLBACK_REGEX = /on[A-Z].+/;
+/**
+ * A hook that handles "trigger" pattern.
+ *
+ * Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
+ * by reference.
+ */
+
+export function useTriggerElement(options) {
+  const {
+    children,
+    ref,
+    outerProps,
+    overrideProps
+  } = options;
+  let childProps = {};
+  let childRef = null; // child can be a render func, `applyTriggerPropsToChildren`does the same check again
+  // TODO figure out a way to only do this check once
+
+  if ( /*#__PURE__*/React.isValidElement(children)) {
+    const child = onlyChild(children);
+    childProps = child.props;
+    childRef = child.ref;
+  } // Two separate callbacks are needed to handle properly bubble and capture callbacks
+  // "getReactCallbackName()" could return proper callback name, but it's possible only with React 17
+
+
+  const handleBubbleEvent = useEventCallback(ev => {
+    var _a, _b, _c;
+
+    const callbackName = getReactCallbackName(ev);
+
+    if (callbackName) {
+      // Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
+      // "FocusEvent", "ClipboardEvent" and etc.
+
+      /* eslint-disable @typescript-eslint/no-explicit-any */
+      (_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
+      (_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
+      (_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
+      /* eslint-enable @typescript-eslint/no-explicit-any */
+    }
+  });
+  const handleCaptureEvent = useEventCallback(ev => {
+    var _a, _b, _c;
+
+    const callbackName = getReactCallbackName(ev) + 'Capture';
+
+    if (callbackName) {
+      // Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
+      // "FocusEvent", "ClipboardEvent" and etc.
+
+      /* eslint-disable @typescript-eslint/no-explicit-any */
+      (_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
+      (_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
+      (_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
+      /* eslint-enable @typescript-eslint/no-explicit-any */
+    }
+  });
+  const mergedPropEntries = Object.entries({ ...outerProps,
+    ...overrideProps,
+    ...childProps,
+    // Undocumented, but React supports ref cloning through props
+    ref: useMergedRefs(childRef, ref)
+  }); // TODO: fix me after https://github.com/microsoft/fluentui/issues/21229
+  // Causes TS error:
+  // "Property 'fromEntries' does not exist on type 'ObjectConstructor'"
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+  const triggerProps = Object.fromEntries(mergedPropEntries.map(([propName, propValue]) => {
+    if (propName.match(CAPTURE_CALLBACK_REGEX)) {
+      return [propName, handleCaptureEvent];
+    }
+
+    if (propName.match(CALLBACK_REGEX)) {
+      return [propName, handleBubbleEvent];
+    }
+
+    return [propName, propValue];
+  }));
+  return applyTriggerPropsToChildren(children, triggerProps);
+}
+//# sourceMappingURL=useTriggerElement.js.map

package/lib/hooks/useTriggerElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/hooks/useTriggerElement.ts"],"names":[],"mappings":"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","sourceRoot":""}

package/lib/utils/getReactCallbackName.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+interface ReactSyntheticEvent extends React.SyntheticEvent<unknown> {
+    _reactName?: string;
+    dispatchConfig?: {
+        registrationName: string;
+        phasedRegistrationNames: {
+            bubbled: string;
+            captured: string;
+        };
+    };
+}
+declare type NonUndefined<A> = A extends undefined ? never : A;
+declare type FunctionKeys<T extends object> = {
+    [K in keyof T]-?: NonUndefined<T[K]> extends Function ? K : never;
+}[keyof T];
+export declare type ReactCallbackName = FunctionKeys<React.DOMAttributes<unknown>>;
+/**
+ * React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
+ *
+ * Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
+ * ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
+ * are handled in bubble phase.
+ */
+export declare function getReactCallbackName(event: ReactSyntheticEvent): ReactCallbackName | undefined;
+export {};

package/lib/utils/getReactCallbackName.js

@@ -0,0 +1,26 @@
+/**
+ * React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
+ *
+ * Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
+ * ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
+ * are handled in bubble phase.
+ */
+export function getReactCallbackName(event) {
+  if (event._reactName) {
+    return event._reactName;
+  }
+
+  if (event.dispatchConfig) {
+    if (event.dispatchConfig.registrationName) {
+      return event.dispatchConfig.registrationName;
+    }
+
+    return event.dispatchConfig.phasedRegistrationNames.bubbled;
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line no-console
+    console.error(['Passed React.SyntheticEvent does not contain ".dispatchConfig" or "._reactName".', 'This should not happen, please report it to https://github.com/microsoft/fluentui']);
+  }
+}
+//# sourceMappingURL=getReactCallbackName.js.map

package/lib/utils/getReactCallbackName.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/getReactCallbackName.ts"],"names":[],"mappings":"AAwBA;;;;;;AAMG;AACH,OAAM,SAAU,oBAAV,CAA+B,KAA/B,EAAyD;AAC7D,MAAI,KAAK,CAAC,UAAV,EAAsB;AACpB,WAAO,KAAK,CAAC,UAAb;AACD;;AAED,MAAI,KAAK,CAAC,cAAV,EAA0B;AACxB,QAAI,KAAK,CAAC,cAAN,CAAqB,gBAAzB,EAA2C;AACzC,aAAO,KAAK,CAAC,cAAN,CAAqB,gBAA5B;AACD;;AAED,WAAO,KAAK,CAAC,cAAN,CAAqB,uBAArB,CAA6C,OAApD;AACD;;AAED,MAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AACzC;AACA,IAAA,OAAO,CAAC,KAAR,CAAc,CACZ,kFADY,EAEZ,mFAFY,CAAd;AAID;AACF","sourceRoot":""}

package/lib-commonjs/compose/getSlots.d.ts

@@ -21,10 +21,9 @@ declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
  * runtime code filtering props in this function.
  *
  * @param state - State including slot definitions
- * @param slotNames - Name of which props are slots
  * @returns An object containing the `slots` map and `slotProps` map.
  */
-export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>, slotNames?: (keyof R)[]): {
+export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>): {
     slots: Slots<R>;
     slotProps: SlotProps<R>;
 };

package/lib-commonjs/compose/getSlots.js

@@ -25,14 +25,14 @@ const omit_1 = /*#__PURE__*/require("../utils/omit");
  * runtime code filtering props in this function.
  *
  * @param state - State including slot definitions
- * @param slotNames - Name of which props are slots
  * @returns An object containing the `slots` map and `slotProps` map.
  */
 
 
-function getSlots(state, slotNames = ['root']) {
+function getSlots(state) {
   const slots = {};
   const slotProps = {};
+  const slotNames = Object.keys(state.components);
 
   for (const slotName of slotNames) {
     const [slot, props] = getSlot(state, slotName);

package/lib-commonjs/compose/getSlots.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAUA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,MAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;AAqBA;;;;;;;;;;;;;;;;;AAiBG;;;AACH,SAAgB,QAAhB,CACE,KADF,EAEE,SAAA,GAAyB,CAAC,MAAD,CAF3B,EAEmC;AAKjC,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;;AAEA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAhBD,OAAA,CAAA,QAAA,GAAA,QAAA;;AAkBA,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,YAAA,CAAA,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAI,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAA4B,CAAA,EAAA,GAAA,KAAK,CAAC,QAAD,CAAL,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,MAAA,CAAA,IAAA,CAAK,KAAK,CAAC,QAAD,CAAV,EAAuB,CAAC,IAAD,CAAvB,CAAH,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}
+{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAUA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,MAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;AAqBA;;;;;;;;;;;;;;;;AAgBG;;;AACH,SAAgB,QAAhB,CACE,KADF,EAC0B;AAKxB,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;AAEA,QAAM,SAAS,GAAgB,MAAM,CAAC,IAAP,CAAY,KAAK,CAAC,UAAlB,CAA/B;;AACA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAhBD,OAAA,CAAA,QAAA,GAAA,QAAA;;AAkBA,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,YAAA,CAAA,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAI,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAA4B,CAAA,EAAA,GAAA,KAAK,CAAC,QAAD,CAAL,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,MAAA,CAAA,IAAA,CAAK,KAAK,CAAC,QAAD,CAAV,EAAuB,CAAC,IAAD,CAAvB,CAAH,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}

package/lib-commonjs/compose/types.d.ts

@@ -79,7 +79,7 @@ export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord
     [Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
 }, Primary & 'root'> & PropsWithoutRef<Shorthands[Primary]>;
 export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
-    components?: {
+    components: {
         [Key in keyof Shorthands]-?: React.ComponentType<NonNullable<Shorthands[Key]> extends ObjectShorthandProps<infer P> ? P : NonNullable<Shorthands[Key]>> | (NonNullable<Shorthands[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
     };
 } & Shorthands;

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

@@ -11,5 +11,6 @@ export * from './useOnClickOutside';
 export * from './useOnScrollOutside';
 export * from './usePrevious';
 export * from './useTimeout';
+export * from './useTriggerElement';
 export * from './useUnmount';
 export * from './useForceUpdate';

package/lib-commonjs/hooks/index.js

@@ -32,6 +32,8 @@ tslib_1.__exportStar(require("./usePrevious"), exports);
 
 tslib_1.__exportStar(require("./useTimeout"), exports);
 
+tslib_1.__exportStar(require("./useTriggerElement"), exports);
+
 tslib_1.__exportStar(require("./useUnmount"), exports);
 
 tslib_1.__exportStar(require("./useForceUpdate"), exports);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,6BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
+{"version":3,"sources":["../../src/hooks/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,6BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourceRoot":""}

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

@@ -0,0 +1,18 @@
+import * as React from 'react';
+export declare type UseTriggerElementOptions<TriggerProps> = {
+    /** An actual trigger element or render props function. */
+    children: React.ReactElement | ((props: TriggerProps) => React.ReactNode) | null | undefined;
+    /** A ref to trigger element. */
+    ref: React.Ref<unknown> | undefined;
+    /** Props that are passed to a parent component and should be forwarded down. */
+    outerProps: React.HTMLProps<unknown>;
+    /** Custom props including callbacks. */
+    overrideProps: TriggerProps;
+};
+/**
+ * A hook that handles "trigger" pattern.
+ *
+ * Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
+ * by reference.
+ */
+export declare function useTriggerElement<TriggerProps extends React.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React.ReactNode;

package/lib-commonjs/hooks/useTriggerElement.js

@@ -0,0 +1,105 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTriggerElement = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const applyTriggerPropsToChildren_1 = /*#__PURE__*/require("../utils/applyTriggerPropsToChildren");
+
+const getReactCallbackName_1 = /*#__PURE__*/require("../utils/getReactCallbackName");
+
+const onlyChild_1 = /*#__PURE__*/require("../utils/onlyChild");
+
+const useEventCallback_1 = /*#__PURE__*/require("./useEventCallback");
+
+const useMergedRefs_1 = /*#__PURE__*/require("./useMergedRefs");
+
+const CAPTURE_CALLBACK_REGEX = /on[A-Z].+Capture$/;
+const CALLBACK_REGEX = /on[A-Z].+/;
+/**
+ * A hook that handles "trigger" pattern.
+ *
+ * Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
+ * by reference.
+ */
+
+function useTriggerElement(options) {
+  const {
+    children,
+    ref,
+    outerProps,
+    overrideProps
+  } = options;
+  let childProps = {};
+  let childRef = null; // child can be a render func, `applyTriggerPropsToChildren`does the same check again
+  // TODO figure out a way to only do this check once
+
+  if (React.isValidElement(children)) {
+    const child = onlyChild_1.onlyChild(children);
+    childProps = child.props;
+    childRef = child.ref;
+  } // Two separate callbacks are needed to handle properly bubble and capture callbacks
+  // "getReactCallbackName()" could return proper callback name, but it's possible only with React 17
+
+
+  const handleBubbleEvent = useEventCallback_1.useEventCallback(ev => {
+    var _a, _b, _c;
+
+    const callbackName = getReactCallbackName_1.getReactCallbackName(ev);
+
+    if (callbackName) {
+      // Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
+      // "FocusEvent", "ClipboardEvent" and etc.
+
+      /* eslint-disable @typescript-eslint/no-explicit-any */
+      (_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
+      (_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
+      (_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
+      /* eslint-enable @typescript-eslint/no-explicit-any */
+    }
+  });
+  const handleCaptureEvent = useEventCallback_1.useEventCallback(ev => {
+    var _a, _b, _c;
+
+    const callbackName = getReactCallbackName_1.getReactCallbackName(ev) + 'Capture';
+
+    if (callbackName) {
+      // Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
+      // "FocusEvent", "ClipboardEvent" and etc.
+
+      /* eslint-disable @typescript-eslint/no-explicit-any */
+      (_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
+      (_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
+      (_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
+      /* eslint-enable @typescript-eslint/no-explicit-any */
+    }
+  });
+  const mergedPropEntries = Object.entries({ ...outerProps,
+    ...overrideProps,
+    ...childProps,
+    // Undocumented, but React supports ref cloning through props
+    ref: useMergedRefs_1.useMergedRefs(childRef, ref)
+  }); // TODO: fix me after https://github.com/microsoft/fluentui/issues/21229
+  // Causes TS error:
+  // "Property 'fromEntries' does not exist on type 'ObjectConstructor'"
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+  const triggerProps = Object.fromEntries(mergedPropEntries.map(([propName, propValue]) => {
+    if (propName.match(CAPTURE_CALLBACK_REGEX)) {
+      return [propName, handleCaptureEvent];
+    }
+
+    if (propName.match(CALLBACK_REGEX)) {
+      return [propName, handleBubbleEvent];
+    }
+
+    return [propName, propValue];
+  }));
+  return applyTriggerPropsToChildren_1.applyTriggerPropsToChildren(children, triggerProps);
+}
+
+exports.useTriggerElement = useTriggerElement;
+//# sourceMappingURL=useTriggerElement.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/hooks/useTriggerElement.ts"],"names":[],"mappings":"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","sourceRoot":""}

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

@@ -0,0 +1,25 @@
+import * as React from 'react';
+interface ReactSyntheticEvent extends React.SyntheticEvent<unknown> {
+    _reactName?: string;
+    dispatchConfig?: {
+        registrationName: string;
+        phasedRegistrationNames: {
+            bubbled: string;
+            captured: string;
+        };
+    };
+}
+declare type NonUndefined<A> = A extends undefined ? never : A;
+declare type FunctionKeys<T extends object> = {
+    [K in keyof T]-?: NonUndefined<T[K]> extends Function ? K : never;
+}[keyof T];
+export declare type ReactCallbackName = FunctionKeys<React.DOMAttributes<unknown>>;
+/**
+ * React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
+ *
+ * Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
+ * ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
+ * are handled in bubble phase.
+ */
+export declare function getReactCallbackName(event: ReactSyntheticEvent): ReactCallbackName | undefined;
+export {};

package/lib-commonjs/utils/getReactCallbackName.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getReactCallbackName = void 0;
+/**
+ * React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
+ *
+ * Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
+ * ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
+ * are handled in bubble phase.
+ */
+
+function getReactCallbackName(event) {
+  if (event._reactName) {
+    return event._reactName;
+  }
+
+  if (event.dispatchConfig) {
+    if (event.dispatchConfig.registrationName) {
+      return event.dispatchConfig.registrationName;
+    }
+
+    return event.dispatchConfig.phasedRegistrationNames.bubbled;
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line no-console
+    console.error(['Passed React.SyntheticEvent does not contain ".dispatchConfig" or "._reactName".', 'This should not happen, please report it to https://github.com/microsoft/fluentui']);
+  }
+}
+
+exports.getReactCallbackName = getReactCallbackName;
+//# sourceMappingURL=getReactCallbackName.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/getReactCallbackName.ts"],"names":[],"mappings":";;;;;;AAwBA;;;;;;AAMG;;AACH,SAAgB,oBAAhB,CAAqC,KAArC,EAA+D;AAC7D,MAAI,KAAK,CAAC,UAAV,EAAsB;AACpB,WAAO,KAAK,CAAC,UAAb;AACD;;AAED,MAAI,KAAK,CAAC,cAAV,EAA0B;AACxB,QAAI,KAAK,CAAC,cAAN,CAAqB,gBAAzB,EAA2C;AACzC,aAAO,KAAK,CAAC,cAAN,CAAqB,gBAA5B;AACD;;AAED,WAAO,KAAK,CAAC,cAAN,CAAqB,uBAArB,CAA6C,OAApD;AACD;;AAED,MAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AACzC;AACA,IAAA,OAAO,CAAC,KAAR,CAAc,CACZ,kFADY,EAEZ,mFAFY,CAAd;AAID;AACF;;AApBD,OAAA,CAAA,oBAAA,GAAA,oBAAA","sourceRoot":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-utilities",
-  "version": "0.0.0-nightly65dd5f749420211213.1",
+  "version": "0.0.0-nightly6a6e258c4020220125.1",
   "description": "A set of general React-specific utilities.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -18,7 +18,7 @@
     "code-style": "just-scripts code-style",
     "just": "just-scripts",
     "lint": "just-scripts lint",
-    "test": "jest",
+    "test": "jest --passWithNoTests",
     "docs": "api-extractor run --config=config/api-extractor.local.json --local",
     "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-utilities/src && yarn docs",
     "start": "yarn storybook",
@@ -27,17 +27,13 @@
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/scripts": "^1.0.0",
-    "@types/enzyme": "3.10.3",
-    "@types/enzyme-adapter-react-16": "1.0.3",
     "@types/react": "16.9.42",
     "@types/react-test-renderer": "^16.0.0",
-    "enzyme": "~3.10.0",
-    "enzyme-adapter-react-16": "^1.15.0",
     "react": "16.8.6",
     "react-test-renderer": "^16.3.0"
   },
   "dependencies": {
-    "@fluentui/keyboard-keys": "0.0.0-nightly65dd5f749420211213.1",
+    "@fluentui/keyboard-keys": "0.0.0-nightly6a6e258c4020220125.1",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {