@fluentui/react-utilities 0.0.0-nightlya9c3d10d9520220113.1 → 0.0.0-nightlyb8663b78ad20220207.1
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.json +48 -6
- package/CHANGELOG.md +11 -6
- package/dist/react-utilities.d.ts +134 -52
- package/lib/compose/getSlots.d.ts +7 -7
- package/lib/compose/getSlots.js.map +1 -1
- package/lib/compose/resolveShorthand.d.ts +5 -5
- package/lib/compose/resolveShorthand.js +3 -3
- package/lib/compose/types.d.ts +47 -25
- package/lib/compose/types.js.map +1 -1
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/index.js +1 -0
- package/lib/hooks/index.js.map +1 -1
- package/lib/hooks/useMergedEventCallbacks.d.ts +18 -0
- package/lib/hooks/useMergedEventCallbacks.js +26 -0
- package/lib/hooks/useMergedEventCallbacks.js.map +1 -0
- package/lib/utils/applyTriggerPropsToChildren.js +19 -2
- package/lib/utils/applyTriggerPropsToChildren.js.map +1 -1
- package/lib/utils/getReactCallbackName.d.ts +25 -0
- package/lib/utils/getReactCallbackName.js +26 -0
- package/lib/utils/getReactCallbackName.js.map +1 -0
- package/lib/utils/getTriggerChild.d.ts +22 -0
- package/lib/utils/getTriggerChild.js +26 -0
- package/lib/utils/getTriggerChild.js.map +1 -0
- package/lib/utils/index.d.ts +2 -1
- package/lib/utils/index.js +2 -1
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/isFluentTrigger.d.ts +22 -0
- package/lib/utils/isFluentTrigger.js +8 -0
- package/lib/utils/isFluentTrigger.js.map +1 -0
- package/lib-commonjs/compose/getSlots.d.ts +7 -7
- package/lib-commonjs/compose/getSlots.js.map +1 -1
- package/lib-commonjs/compose/resolveShorthand.d.ts +5 -5
- package/lib-commonjs/compose/resolveShorthand.js +3 -3
- package/lib-commonjs/compose/types.d.ts +47 -25
- package/lib-commonjs/compose/types.js.map +1 -1
- package/lib-commonjs/hooks/index.d.ts +1 -0
- package/lib-commonjs/hooks/index.js +2 -0
- package/lib-commonjs/hooks/index.js.map +1 -1
- package/lib-commonjs/hooks/useMergedEventCallbacks.d.ts +18 -0
- package/lib-commonjs/hooks/useMergedEventCallbacks.js +36 -0
- package/lib-commonjs/hooks/useMergedEventCallbacks.js.map +1 -0
- package/lib-commonjs/utils/applyTriggerPropsToChildren.js +19 -2
- package/lib-commonjs/utils/applyTriggerPropsToChildren.js.map +1 -1
- package/lib-commonjs/utils/getReactCallbackName.d.ts +25 -0
- package/lib-commonjs/utils/getReactCallbackName.js +35 -0
- package/lib-commonjs/utils/getReactCallbackName.js.map +1 -0
- package/lib-commonjs/utils/getTriggerChild.d.ts +22 -0
- package/lib-commonjs/utils/getTriggerChild.js +37 -0
- package/lib-commonjs/utils/getTriggerChild.js.map +1 -0
- package/lib-commonjs/utils/index.d.ts +2 -1
- package/lib-commonjs/utils/index.js +4 -2
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/isFluentTrigger.d.ts +22 -0
- package/lib-commonjs/utils/isFluentTrigger.js +17 -0
- package/lib-commonjs/utils/isFluentTrigger.js.map +1 -0
- package/package.json +3 -3
- package/lib/utils/onlyChild.d.ts +0 -5
- package/lib/utils/onlyChild.js +0 -13
- package/lib/utils/onlyChild.js.map +0 -1
- package/lib-commonjs/utils/onlyChild.d.ts +0 -5
- package/lib-commonjs/utils/onlyChild.js +0 -23
- package/lib-commonjs/utils/onlyChild.js.map +0 -1
@@ -0,0 +1,35 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.getReactCallbackName = void 0;
|
7
|
+
/**
|
8
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
9
|
+
*
|
10
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
11
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
12
|
+
* are handled in bubble phase.
|
13
|
+
*/
|
14
|
+
|
15
|
+
function getReactCallbackName(event) {
|
16
|
+
if (event._reactName) {
|
17
|
+
return event._reactName;
|
18
|
+
}
|
19
|
+
|
20
|
+
if (event.dispatchConfig) {
|
21
|
+
if (event.dispatchConfig.registrationName) {
|
22
|
+
return event.dispatchConfig.registrationName;
|
23
|
+
}
|
24
|
+
|
25
|
+
return event.dispatchConfig.phasedRegistrationNames.bubbled;
|
26
|
+
}
|
27
|
+
|
28
|
+
if (process.env.NODE_ENV !== 'production') {
|
29
|
+
// eslint-disable-next-line no-console
|
30
|
+
console.error(['Passed React.SyntheticEvent does not contain ".dispatchConfig" or "._reactName".', 'This should not happen, please report it to https://github.com/microsoft/fluentui']);
|
31
|
+
}
|
32
|
+
}
|
33
|
+
|
34
|
+
exports.getReactCallbackName = getReactCallbackName;
|
35
|
+
//# sourceMappingURL=getReactCallbackName.js.map
|
@@ -0,0 +1 @@
|
|
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":""}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
/**
|
3
|
+
* Gets the trigger element of a FluentTriggerComponent (such as Tooltip or MenuTrigger).
|
4
|
+
*
|
5
|
+
* In the case where the immediate child is itself a FluentTriggerComponent and/or React Fragment,
|
6
|
+
* it returns the first descendant that is _not_ a FluentTriggerComponent or Fragment.
|
7
|
+
* This allows multiple triggers to be stacked, and still apply their props to the actual trigger element.
|
8
|
+
*
|
9
|
+
* For example, the following returns `<div id="child" />`:
|
10
|
+
* ```jsx
|
11
|
+
* getTriggerChild(
|
12
|
+
* <Tooltip>
|
13
|
+
* <MenuTrigger>
|
14
|
+
* <div id="child" />
|
15
|
+
* </MenuTrigger>
|
16
|
+
* </Tooltip>
|
17
|
+
* );
|
18
|
+
* ```
|
19
|
+
*/
|
20
|
+
export declare const getTriggerChild: (children: React.ReactNode) => React.ReactElement & {
|
21
|
+
ref?: React.Ref<unknown>;
|
22
|
+
};
|
@@ -0,0 +1,37 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.getTriggerChild = void 0;
|
7
|
+
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
|
+
|
10
|
+
const isFluentTrigger_1 = /*#__PURE__*/require("./isFluentTrigger");
|
11
|
+
/**
|
12
|
+
* Gets the trigger element of a FluentTriggerComponent (such as Tooltip or MenuTrigger).
|
13
|
+
*
|
14
|
+
* In the case where the immediate child is itself a FluentTriggerComponent and/or React Fragment,
|
15
|
+
* it returns the first descendant that is _not_ a FluentTriggerComponent or Fragment.
|
16
|
+
* This allows multiple triggers to be stacked, and still apply their props to the actual trigger element.
|
17
|
+
*
|
18
|
+
* For example, the following returns `<div id="child" />`:
|
19
|
+
* ```jsx
|
20
|
+
* getTriggerChild(
|
21
|
+
* <Tooltip>
|
22
|
+
* <MenuTrigger>
|
23
|
+
* <div id="child" />
|
24
|
+
* </MenuTrigger>
|
25
|
+
* </Tooltip>
|
26
|
+
* );
|
27
|
+
* ```
|
28
|
+
*/
|
29
|
+
|
30
|
+
|
31
|
+
const getTriggerChild = children => {
|
32
|
+
const child = React.Children.only(children);
|
33
|
+
return isFluentTrigger_1.isFluentTrigger(child) ? exports.getTriggerChild(child.props.children) : child;
|
34
|
+
};
|
35
|
+
|
36
|
+
exports.getTriggerChild = getTriggerChild;
|
37
|
+
//# sourceMappingURL=getTriggerChild.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/utils/getTriggerChild.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAEA;;;;;;;;;;;;;;;;;AAiBG;;;AACI,MAAM,eAAe,GAAI,QAAD,IAAiF;AAC9G,QAAM,KAAK,GAAG,KAAK,CAAC,QAAN,CAAe,IAAf,CAAoB,QAApB,CAAd;AACA,SAAO,iBAAA,CAAA,eAAA,CAAgB,KAAhB,IAAyB,OAAA,CAAA,eAAA,CAAgB,KAAK,CAAC,KAAN,CAAY,QAA5B,CAAzB,GAAiE,KAAxE;AACD,CAHM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourceRoot":""}
|
@@ -2,7 +2,8 @@ export * from './applyTriggerPropsToChildren';
|
|
2
2
|
export * from './clamp';
|
3
3
|
export * from './getNativeElementProps';
|
4
4
|
export * from './getRTLSafeKey';
|
5
|
+
export * from './getTriggerChild';
|
6
|
+
export * from './isFluentTrigger';
|
5
7
|
export * from './omit';
|
6
|
-
export * from './onlyChild';
|
7
8
|
export * from './properties';
|
8
9
|
export * from './shouldPreventDefaultOnKeyDown';
|
@@ -14,9 +14,11 @@ tslib_1.__exportStar(require("./getNativeElementProps"), exports);
|
|
14
14
|
|
15
15
|
tslib_1.__exportStar(require("./getRTLSafeKey"), exports);
|
16
16
|
|
17
|
-
tslib_1.__exportStar(require("./
|
17
|
+
tslib_1.__exportStar(require("./getTriggerChild"), exports);
|
18
|
+
|
19
|
+
tslib_1.__exportStar(require("./isFluentTrigger"), exports);
|
18
20
|
|
19
|
-
tslib_1.__exportStar(require("./
|
21
|
+
tslib_1.__exportStar(require("./omit"), exports);
|
20
22
|
|
21
23
|
tslib_1.__exportStar(require("./properties"), exports);
|
22
24
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,QAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iCAAA,CAAA,EAAA,OAAA","sourceRoot":""}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
/**
|
3
|
+
* Allows a component to be tagged as a FluentUI trigger component.
|
4
|
+
*
|
5
|
+
* Triggers are special-case components: they attach event listeners and other props on their child,
|
6
|
+
* and use them to trigger another component to show. Examples include `MenuTrigger` and `Tooltip`.
|
7
|
+
*
|
8
|
+
* A component can be tagged as a trigger as follows:
|
9
|
+
* ```ts
|
10
|
+
* const MyComponent: React.FC<MyComponentProps> & FluentTriggerComponent = ...;
|
11
|
+
*
|
12
|
+
* MyComponent.isFluentTriggerComponent = true; // MUST also set this to true
|
13
|
+
* ```
|
14
|
+
*/
|
15
|
+
export declare type FluentTriggerComponent = {
|
16
|
+
isFluentTriggerComponent?: boolean;
|
17
|
+
};
|
18
|
+
/**
|
19
|
+
* Checks if a given element is a FluentUI trigger (e.g. `MenuTrigger` or `Tooltip`).
|
20
|
+
* See the {@link FluentTriggerComponent} type for more info.
|
21
|
+
*/
|
22
|
+
export declare const isFluentTrigger: (element: React.ReactElement) => boolean | undefined;
|
@@ -0,0 +1,17 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.isFluentTrigger = void 0;
|
7
|
+
/**
|
8
|
+
* Checks if a given element is a FluentUI trigger (e.g. `MenuTrigger` or `Tooltip`).
|
9
|
+
* See the {@link FluentTriggerComponent} type for more info.
|
10
|
+
*/
|
11
|
+
|
12
|
+
const isFluentTrigger = element => {
|
13
|
+
return element.type.isFluentTriggerComponent;
|
14
|
+
};
|
15
|
+
|
16
|
+
exports.isFluentTrigger = isFluentTrigger;
|
17
|
+
//# sourceMappingURL=isFluentTrigger.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/utils/isFluentTrigger.ts"],"names":[],"mappings":";;;;;;AAmBA;;;AAGG;;AACI,MAAM,eAAe,GAAI,OAAD,IAAgC;AAC7D,SAAQ,OAAO,CAAC,IAAR,CAAwC,wBAAhD;AACD,CAFM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourceRoot":""}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-utilities",
|
3
|
-
"version": "0.0.0-
|
3
|
+
"version": "0.0.0-nightlyb8663b78ad20220207.1",
|
4
4
|
"description": "A set of general React-specific utilities.",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -18,7 +18,7 @@
|
|
18
18
|
"code-style": "just-scripts code-style",
|
19
19
|
"just": "just-scripts",
|
20
20
|
"lint": "just-scripts lint",
|
21
|
-
"test": "jest",
|
21
|
+
"test": "jest --passWithNoTests",
|
22
22
|
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
23
23
|
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-utilities/src && yarn docs",
|
24
24
|
"start": "yarn storybook",
|
@@ -33,7 +33,7 @@
|
|
33
33
|
"react-test-renderer": "^16.3.0"
|
34
34
|
},
|
35
35
|
"dependencies": {
|
36
|
-
"@fluentui/keyboard-keys": "0.0.0-
|
36
|
+
"@fluentui/keyboard-keys": "0.0.0-nightlyb8663b78ad20220207.1",
|
37
37
|
"tslib": "^2.1.0"
|
38
38
|
},
|
39
39
|
"peerDependencies": {
|
package/lib/utils/onlyChild.d.ts
DELETED
@@ -1,5 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
/**
|
3
|
-
* Similar to React.Children.only, but drills into fragments rather than treating them as a single child
|
4
|
-
*/
|
5
|
-
export declare const onlyChild: <P>(child: boolean | React.ReactText | React.ReactFragment | React.ReactPortal | React.ReactElement<P, string | React.JSXElementConstructor<any>> | null | undefined) => React.ReactElement<P, string | React.JSXElementConstructor<any>>;
|
package/lib/utils/onlyChild.js
DELETED
@@ -1,13 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
/**
|
3
|
-
* Similar to React.Children.only, but drills into fragments rather than treating them as a single child
|
4
|
-
*/
|
5
|
-
|
6
|
-
export const onlyChild = child => {
|
7
|
-
if (! /*#__PURE__*/React.isValidElement(child)) {
|
8
|
-
throw new Error(`Component's child must be a single element`);
|
9
|
-
}
|
10
|
-
|
11
|
-
return child.type === React.Fragment ? onlyChild(child.props.children) : child;
|
12
|
-
};
|
13
|
-
//# sourceMappingURL=onlyChild.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../../src/utils/onlyChild.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA;;AAEG;;AACH,OAAO,MAAM,SAAS,GACpB,KADuB,IAEE;AACzB,MAAI,eAAC,KAAK,CAAC,cAAN,CAAqB,KAArB,CAAL,EAAkC;AAChC,UAAM,IAAI,KAAJ,CAAU,4CAAV,CAAN;AACD;;AAED,SAAO,KAAK,CAAC,IAAN,KAAe,KAAK,CAAC,QAArB,GAAgC,SAAS,CAAC,KAAK,CAAC,KAAN,CAAY,QAAb,CAAzC,GAAkE,KAAzE;AACD,CARM","sourceRoot":""}
|
@@ -1,5 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
/**
|
3
|
-
* Similar to React.Children.only, but drills into fragments rather than treating them as a single child
|
4
|
-
*/
|
5
|
-
export declare const onlyChild: <P>(child: boolean | React.ReactText | React.ReactFragment | React.ReactPortal | React.ReactElement<P, string | React.JSXElementConstructor<any>> | null | undefined) => React.ReactElement<P, string | React.JSXElementConstructor<any>>;
|
@@ -1,23 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.onlyChild = void 0;
|
7
|
-
|
8
|
-
const React = /*#__PURE__*/require("react");
|
9
|
-
/**
|
10
|
-
* Similar to React.Children.only, but drills into fragments rather than treating them as a single child
|
11
|
-
*/
|
12
|
-
|
13
|
-
|
14
|
-
const onlyChild = child => {
|
15
|
-
if (!React.isValidElement(child)) {
|
16
|
-
throw new Error(`Component's child must be a single element`);
|
17
|
-
}
|
18
|
-
|
19
|
-
return child.type === React.Fragment ? exports.onlyChild(child.props.children) : child;
|
20
|
-
};
|
21
|
-
|
22
|
-
exports.onlyChild = onlyChild;
|
23
|
-
//# sourceMappingURL=onlyChild.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../../src/utils/onlyChild.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,SAAS,GACpB,KADuB,IAEE;AACzB,MAAI,CAAC,KAAK,CAAC,cAAN,CAAqB,KAArB,CAAL,EAAkC;AAChC,UAAM,IAAI,KAAJ,CAAU,4CAAV,CAAN;AACD;;AAED,SAAO,KAAK,CAAC,IAAN,KAAe,KAAK,CAAC,QAArB,GAAgC,OAAA,CAAA,SAAA,CAAU,KAAK,CAAC,KAAN,CAAY,QAAtB,CAAhC,GAAkE,KAAzE;AACD,CARM;;AAAM,OAAA,CAAA,SAAA,GAAS,SAAT","sourceRoot":""}
|