@fluentui/react-utilities 0.0.0-nightlyca6ef2bc8e20220105.1 → 0.0.0-nightlyd45ba4664620220211.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 +93 -6
- package/CHANGELOG.md +25 -6
- package/dist/react-utilities.d.ts +193 -78
- package/lib/compose/getSlots.d.ts +7 -8
- package/lib/compose/getSlots.js +3 -4
- package/lib/compose/getSlots.js.map +1 -1
- package/lib/compose/index.d.ts +0 -1
- package/lib/compose/index.js +0 -1
- package/lib/compose/index.js.map +1 -1
- package/lib/compose/resolveShorthand.d.ts +10 -6
- package/lib/compose/resolveShorthand.js +5 -5
- package/lib/compose/resolveShorthand.js.map +1 -1
- package/lib/compose/types.d.ts +86 -34
- 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.d.ts +1 -1
- package/lib/utils/applyTriggerPropsToChildren.js +23 -3
- package/lib/utils/applyTriggerPropsToChildren.js.map +1 -1
- package/lib/utils/getNativeElementProps.d.ts +4 -4
- package/lib/utils/getNativeElementProps.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 -8
- package/lib-commonjs/compose/getSlots.js +3 -5
- package/lib-commonjs/compose/getSlots.js.map +1 -1
- package/lib-commonjs/compose/index.d.ts +0 -1
- package/lib-commonjs/compose/index.js +0 -2
- package/lib-commonjs/compose/index.js.map +1 -1
- package/lib-commonjs/compose/resolveShorthand.d.ts +10 -6
- package/lib-commonjs/compose/resolveShorthand.js +5 -5
- package/lib-commonjs/compose/resolveShorthand.js.map +1 -1
- package/lib-commonjs/compose/types.d.ts +86 -34
- 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.d.ts +1 -1
- package/lib-commonjs/utils/applyTriggerPropsToChildren.js +24 -4
- package/lib-commonjs/utils/applyTriggerPropsToChildren.js.map +1 -1
- package/lib-commonjs/utils/getNativeElementProps.d.ts +4 -4
- package/lib-commonjs/utils/getNativeElementProps.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/compose/nullRender.d.ts +0 -4
- package/lib/compose/nullRender.js +0 -5
- package/lib/compose/nullRender.js.map +0 -1
- 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/compose/nullRender.d.ts +0 -4
- package/lib-commonjs/compose/nullRender.js +0 -14
- package/lib-commonjs/compose/nullRender.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
package/lib/compose/index.d.ts
CHANGED
package/lib/compose/index.js
CHANGED
package/lib/compose/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/compose/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/compose/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC"}
|
@@ -1,12 +1,16 @@
|
|
1
|
-
import type {
|
2
|
-
export declare type ResolveShorthandOptions<Props
|
1
|
+
import type { ReplaceNullWithUndefined, SlotShorthandValue, UnknownSlotProps } from './types';
|
2
|
+
export declare type ResolveShorthandOptions<Props, Required extends boolean = false> = {
|
3
3
|
required?: Required;
|
4
4
|
defaultProps?: Props;
|
5
5
|
};
|
6
|
+
export declare type ResolveShorthandFunction<Props extends UnknownSlotProps = UnknownSlotProps> = {
|
7
|
+
<P extends Props | null>(value: P | SlotShorthandValue | undefined, options?: ResolveShorthandOptions<P, true>): ReplaceNullWithUndefined<P>;
|
8
|
+
<P extends Props | null>(value: P | SlotShorthandValue | undefined, options?: ResolveShorthandOptions<P, boolean>): ReplaceNullWithUndefined<P> | undefined;
|
9
|
+
};
|
6
10
|
/**
|
7
|
-
* Resolves
|
11
|
+
* Resolves shorthands into slot props, to ensure normalization of the signature
|
8
12
|
* being passed down to getSlots method
|
9
|
-
* @param value - the base
|
10
|
-
* @param options - options to resolve
|
13
|
+
* @param value - the base shorthand props
|
14
|
+
* @param options - options to resolve shorthand props
|
11
15
|
*/
|
12
|
-
export declare
|
16
|
+
export declare const resolveShorthand: ResolveShorthandFunction;
|
@@ -1,12 +1,12 @@
|
|
1
1
|
import { isValidElement } from 'react';
|
2
2
|
/**
|
3
|
-
* Resolves
|
3
|
+
* Resolves shorthands into slot props, to ensure normalization of the signature
|
4
4
|
* being passed down to getSlots method
|
5
|
-
* @param value - the base
|
6
|
-
* @param options - options to resolve
|
5
|
+
* @param value - the base shorthand props
|
6
|
+
* @param options - options to resolve shorthand props
|
7
7
|
*/
|
8
8
|
|
9
|
-
export
|
9
|
+
export const resolveShorthand = (value, options) => {
|
10
10
|
const {
|
11
11
|
required = false,
|
12
12
|
defaultProps
|
@@ -27,5 +27,5 @@ export function resolveShorthand(value, options) {
|
|
27
27
|
return defaultProps ? { ...defaultProps,
|
28
28
|
...resolvedShorthand
|
29
29
|
} : resolvedShorthand;
|
30
|
-
}
|
30
|
+
};
|
31
31
|
//# sourceMappingURL=resolveShorthand.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/compose/resolveShorthand.ts"],"names":[],"mappings":"AAAA,SAAS,cAAT,QAA+B,OAA/B;
|
1
|
+
{"version":3,"sources":["../../src/compose/resolveShorthand.ts"],"names":[],"mappings":"AAAA,SAAS,cAAT,QAA+B,OAA/B;AAkBA;;;;;AAKG;;AACH,OAAO,MAAM,gBAAgB,GAA6B,CAAC,KAAD,EAAQ,OAAR,KAAmB;AAC3E,QAAM;AAAE,IAAA,QAAQ,GAAG,KAAb;AAAoB,IAAA;AAApB,MAAqC,OAAO,IAAI,EAAtD;;AACA,MAAI,KAAK,KAAK,IAAV,IAAmB,KAAK,KAAK,SAAV,IAAuB,CAAC,QAA/C,EAA0D;AACxD,WAAO,SAAP;AACD;;AAED,MAAI,iBAAiB,GAAG,EAAxB;;AAEA,MAAI,OAAO,KAAP,KAAiB,QAAjB,IAA6B,OAAO,KAAP,KAAiB,QAA9C,IAA0D,KAAK,CAAC,OAAN,CAAc,KAAd,CAA1D,iBAAkF,cAAc,CAAC,KAAD,CAApG,EAA6G;AAC3G,IAAA,iBAAiB,CAAC,QAAlB,GAA6B,KAA7B;AACD,GAFD,MAEO,IAAI,OAAO,KAAP,KAAiB,QAArB,EAA+B;AACpC,IAAA,iBAAiB,GAAG,KAApB;AACD;;AAED,SAAO,YAAY,GAAG,EAAE,GAAG,YAAL;AAAmB,OAAG;AAAtB,GAAH,GAA+C,iBAAlE;AACD,CAfM","sourceRoot":""}
|
package/lib/compose/types.d.ts
CHANGED
@@ -1,46 +1,83 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
export declare type
|
3
|
-
export declare type ObjectShorthandPropsRecord = Record<string, DefaultObjectShorthandProps | undefined>;
|
4
|
-
export declare type ShorthandProps<Props extends DefaultObjectShorthandProps> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | number | null | undefined | Props;
|
2
|
+
export declare type SlotRenderFunction<Props> = (Component: React.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React.ReactNode;
|
5
3
|
/**
|
6
|
-
* Matches any
|
4
|
+
* Matches any component's Slots type (such as ButtonSlots).
|
7
5
|
*
|
8
|
-
* This should ONLY be used in type templates as in `extends
|
6
|
+
* This should ONLY be used in type templates as in `extends SlotPropsRecord`;
|
7
|
+
* it shouldn't be used as a component's Slots type.
|
8
|
+
*/
|
9
|
+
export declare type SlotPropsRecord = Record<string, UnknownSlotProps | SlotShorthandValue | null | undefined>;
|
10
|
+
/**
|
11
|
+
* The shorthand value of a slot allows specifying its child
|
12
|
+
*/
|
13
|
+
export declare type SlotShorthandValue = React.ReactChild | React.ReactNodeArray | React.ReactPortal;
|
14
|
+
/**
|
15
|
+
* Matches any slot props type.
|
16
|
+
*
|
17
|
+
* This should ONLY be used in type templates as in `extends UnknownSlotProps`;
|
9
18
|
* it shouldn't be used as the type of a slot.
|
10
19
|
*/
|
11
|
-
export declare type
|
20
|
+
export declare type UnknownSlotProps = Pick<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {
|
12
21
|
as?: keyof JSX.IntrinsicElements;
|
13
|
-
}
|
22
|
+
};
|
14
23
|
/**
|
15
|
-
*
|
16
|
-
*
|
17
|
-
* For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
24
|
+
* Helper type for {@link Slot}. Adds shorthand types that are assignable to the slot's `children`.
|
18
25
|
*/
|
19
|
-
|
20
|
-
children?:
|
21
|
-
}
|
22
|
-
|
26
|
+
declare type WithSlotShorthandValue<Props extends {
|
27
|
+
children?: unknown;
|
28
|
+
}> = Props | Extract<SlotShorthandValue, Props['children']>;
|
29
|
+
/**
|
30
|
+
* Helper type for {@link Slot}. Takes the props we want to support for a slot and adds the ability for `children`
|
31
|
+
* to be a render function that takes those props.
|
32
|
+
*/
|
33
|
+
declare type WithSlotRenderFunction<Props extends {
|
34
|
+
children?: unknown;
|
35
|
+
}> = Props & {
|
36
|
+
children?: Props['children'] | SlotRenderFunction<Props>;
|
23
37
|
};
|
24
38
|
/**
|
25
|
-
*
|
26
|
-
* For slots that support custom components, use {@link ObjectShorthandProps} instead.
|
39
|
+
* HTML element types that are not allowed to have children.
|
27
40
|
*
|
28
|
-
*
|
29
|
-
|
41
|
+
* Reference: https://developer.mozilla.org/en-US/docs/Glossary/Empty_element
|
42
|
+
*/
|
43
|
+
declare type EmptyIntrisicElements = 'area' | 'base' | 'br' | 'col' | 'embed' | 'hr' | 'img' | 'input' | 'link' | 'meta' | 'param' | 'source' | 'track' | 'wbr';
|
44
|
+
/**
|
45
|
+
* Helper type for {@link Slot}. Modifies `JSX.IntrinsicElements[Type]`:
|
46
|
+
* * Removes legacy string ref.
|
47
|
+
* * Disallows children for empty tags like 'img'.
|
48
|
+
*/
|
49
|
+
declare type IntrisicElementProps<Type extends keyof JSX.IntrinsicElements> = React.PropsWithRef<JSX.IntrinsicElements[Type]> & (Type extends EmptyIntrisicElements ? {
|
50
|
+
children?: never;
|
51
|
+
} : {});
|
52
|
+
/**
|
53
|
+
* The props type and shorthand value for a slot. Type is either a single intrinsic element like `'div'`,
|
54
|
+
* or a component like `typeof Button`.
|
30
55
|
*
|
56
|
+
* If a slot needs to support multiple intrinsic element types, use the `AlternateAs` param (see examples below).
|
57
|
+
*
|
58
|
+
* By default, slots can be set to `null` to prevent them from being rendered. If a slot must always be rendered,
|
59
|
+
* wrap with `NonNullable` (see examples below).
|
60
|
+
*
|
61
|
+
* @example
|
31
62
|
* ```
|
32
|
-
*
|
33
|
-
*
|
34
|
-
*
|
63
|
+
* // Intrinsic element examples:
|
64
|
+
* Slot<'div'> // Slot is always div
|
65
|
+
* Slot<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
|
66
|
+
* Slot<'span', 'div' | 'pre'> // Defaults to span, but allows as="div" or as="pre"
|
67
|
+
* NonNullable<Slot<'div'>> // Slot that will always be rendered (can't be set to null by the user)
|
68
|
+
*
|
69
|
+
* // Component examples:
|
70
|
+
* Slot<typeof Button> // Slot is always a Button, and accepts all of Button's Props
|
71
|
+
* NonNullable<Slot<typeof Label>> // Slot is a Label and will always be rendered (can't be set to null by the user)
|
35
72
|
* ```
|
36
73
|
*/
|
37
|
-
export declare type
|
38
|
-
as?:
|
39
|
-
} &
|
74
|
+
export declare type Slot<Type extends keyof JSX.IntrinsicElements | React.ComponentType | UnknownSlotProps, AlternateAs extends keyof JSX.IntrinsicElements = never> = IsSingleton<Extract<Type, string>> extends true ? WithSlotShorthandValue<Type extends keyof JSX.IntrinsicElements ? {
|
75
|
+
as?: Type;
|
76
|
+
} & WithSlotRenderFunction<IntrisicElementProps<Type>> : Type extends React.ComponentType<infer Props> ? WithSlotRenderFunction<Props> : Type> | {
|
40
77
|
[As in AlternateAs]: {
|
41
78
|
as: As;
|
42
|
-
} &
|
43
|
-
}[AlternateAs];
|
79
|
+
} & WithSlotRenderFunction<IntrisicElementProps<As>>;
|
80
|
+
}[AlternateAs] | null : 'Error: First parameter to Slot must not be not a union of types. See documentation of Slot type.';
|
44
81
|
/**
|
45
82
|
* Evaluates to true if the given type contains exactly one string, or false if it is a union of strings.
|
46
83
|
*
|
@@ -69,20 +106,35 @@ export declare type AsIntrinsicElement<As extends keyof JSX.IntrinsicElements> =
|
|
69
106
|
export declare type UnionToIntersection<U> = (U extends unknown ? (x: U) => U : never) extends (x: infer I) => U ? I : never;
|
70
107
|
/**
|
71
108
|
* Removes the 'ref' prop from the given Props type, leaving unions intact (such as the discriminated union created by
|
72
|
-
*
|
109
|
+
* IntrinsicSlotProps). This allows IntrinsicSlotProps to be used with React.forwardRef.
|
73
110
|
*
|
74
111
|
* The conditional "extends unknown" (always true) exploits a quirk in the way TypeScript handles conditional
|
75
112
|
* types, to prevent unions from being expanded.
|
76
113
|
*/
|
77
114
|
export declare type PropsWithoutRef<P> = 'ref' extends keyof P ? (P extends unknown ? Omit<P, 'ref'> : P) : P;
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
export declare type
|
82
|
-
|
83
|
-
|
115
|
+
/**
|
116
|
+
* Removes SlotShorthandValue and null from the slot type, extracting just the slot's Props object.
|
117
|
+
*/
|
118
|
+
export declare type ExtractSlotProps<S> = Exclude<S, SlotShorthandValue | null | undefined>;
|
119
|
+
/**
|
120
|
+
* Defines the Props type for a component given its slots and the definition of which one is the primary slot,
|
121
|
+
* defaulting to root if one is not provided.
|
122
|
+
*/
|
123
|
+
export declare type ComponentProps<Slots extends SlotPropsRecord, Primary extends keyof Slots = 'root'> = Omit<Slots, Primary & 'root'> & PropsWithoutRef<ExtractSlotProps<Slots[Primary]>>;
|
124
|
+
/**
|
125
|
+
* If type T includes `null`, remove it and add `undefined` instead.
|
126
|
+
*/
|
127
|
+
export declare type ReplaceNullWithUndefined<T> = T extends null ? Exclude<T, null> | undefined : T;
|
128
|
+
/**
|
129
|
+
* Defines the State object of a component given its slots.
|
130
|
+
*/
|
131
|
+
export declare type ComponentState<Slots extends SlotPropsRecord> = {
|
132
|
+
components: {
|
133
|
+
[Key in keyof Slots]-?: React.ComponentType<ExtractSlotProps<Slots[Key]>> | (ExtractSlotProps<Slots[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
|
84
134
|
};
|
85
|
-
} &
|
135
|
+
} & {
|
136
|
+
[Key in keyof Slots]: ReplaceNullWithUndefined<Exclude<Slots[Key], SlotShorthandValue | (Key extends 'root' ? null : never)>>;
|
137
|
+
};
|
86
138
|
/**
|
87
139
|
* This is part of a hack to infer the element type from a native element *props* type.
|
88
140
|
* The only place the original element is found in a native props type (at least that's workable
|
package/lib/compose/types.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":"WAqNA;AACA;AACA;AACA;AACA","sourceRoot":""}
|
package/lib/hooks/index.d.ts
CHANGED
@@ -5,6 +5,7 @@ export * from './useEventCallback';
|
|
5
5
|
export * from './useFirstMount';
|
6
6
|
export * from './useId';
|
7
7
|
export * from './useIsomorphicLayoutEffect';
|
8
|
+
export * from './useMergedEventCallbacks';
|
8
9
|
export * from './useMergedRefs';
|
9
10
|
export * from './useMount';
|
10
11
|
export * from './useOnClickOutside';
|
package/lib/hooks/index.js
CHANGED
@@ -5,6 +5,7 @@ export * from './useEventCallback';
|
|
5
5
|
export * from './useFirstMount';
|
6
6
|
export * from './useId';
|
7
7
|
export * from './useIsomorphicLayoutEffect';
|
8
|
+
export * from './useMergedEventCallbacks';
|
8
9
|
export * from './useMergedRefs';
|
9
10
|
export * from './useMount';
|
10
11
|
export * from './useOnClickOutside';
|
package/lib/hooks/index.js.map
CHANGED
@@ -1 +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"}
|
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,2BAA2B,CAAC;AAC1C,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"}
|
@@ -0,0 +1,18 @@
|
|
1
|
+
/**
|
2
|
+
* Combine two event callbacks into a single callback function that calls each one in order.
|
3
|
+
*
|
4
|
+
* This is useful to add an event listener to an existing element without overwriting the current listener, if any.
|
5
|
+
*
|
6
|
+
* For example:
|
7
|
+
* ```ts
|
8
|
+
* state.slot.onChange = useMergedCallbacks(state.slot.onChange, ev => {
|
9
|
+
* // Handle onChange
|
10
|
+
* });
|
11
|
+
* ```
|
12
|
+
*
|
13
|
+
* @param callback1 - The first callback to be called
|
14
|
+
* @param callback2 - The second callback to be called
|
15
|
+
*
|
16
|
+
* @returns An event callback that calls the callbacks in order, and is stable between renders
|
17
|
+
*/
|
18
|
+
export declare function useMergedEventCallbacks<Args extends unknown[]>(callback1: ((...args: Args) => void) | undefined, callback2: ((...args: Args) => void) | undefined): (...args: Args) => void;
|
@@ -0,0 +1,26 @@
|
|
1
|
+
import { useEventCallback } from './useEventCallback';
|
2
|
+
/**
|
3
|
+
* Combine two event callbacks into a single callback function that calls each one in order.
|
4
|
+
*
|
5
|
+
* This is useful to add an event listener to an existing element without overwriting the current listener, if any.
|
6
|
+
*
|
7
|
+
* For example:
|
8
|
+
* ```ts
|
9
|
+
* state.slot.onChange = useMergedCallbacks(state.slot.onChange, ev => {
|
10
|
+
* // Handle onChange
|
11
|
+
* });
|
12
|
+
* ```
|
13
|
+
*
|
14
|
+
* @param callback1 - The first callback to be called
|
15
|
+
* @param callback2 - The second callback to be called
|
16
|
+
*
|
17
|
+
* @returns An event callback that calls the callbacks in order, and is stable between renders
|
18
|
+
*/
|
19
|
+
|
20
|
+
export function useMergedEventCallbacks(callback1, callback2) {
|
21
|
+
return useEventCallback((...args) => {
|
22
|
+
callback1 === null || callback1 === void 0 ? void 0 : callback1(...args);
|
23
|
+
callback2 === null || callback2 === void 0 ? void 0 : callback2(...args);
|
24
|
+
});
|
25
|
+
}
|
26
|
+
//# sourceMappingURL=useMergedEventCallbacks.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/useMergedEventCallbacks.ts"],"names":[],"mappings":"AAAA,SAAS,gBAAT,QAAiC,oBAAjC;AAEA;;;;;;;;;;;;;;;;AAgBG;;AACH,OAAM,SAAU,uBAAV,CACJ,SADI,EAEJ,SAFI,EAE4C;AAEhD,SAAO,gBAAgB,CAAC,CAAC,GAAG,IAAJ,KAAkB;AACxC,IAAA,SAAS,KAAA,IAAT,IAAA,SAAS,KAAA,KAAA,CAAT,GAAS,KAAA,CAAT,GAAA,SAAS,CAAG,GAAG,IAAN,CAAT;AACA,IAAA,SAAS,KAAA,IAAT,IAAA,SAAS,KAAA,KAAA,CAAT,GAAS,KAAA,CAAT,GAAA,SAAS,CAAG,GAAG,IAAN,CAAT;AACD,GAHsB,CAAvB;AAID","sourceRoot":""}
|
@@ -2,4 +2,4 @@ import * as React from 'react';
|
|
2
2
|
/**
|
3
3
|
* Apply the trigger props to the children, either by calling the render function, or cloning with the new props.
|
4
4
|
*/
|
5
|
-
export declare const applyTriggerPropsToChildren: <TTriggerProps>(children: React.ReactElement<any, string | React.JSXElementConstructor<any>> | ((props: TTriggerProps) => React.
|
5
|
+
export declare const applyTriggerPropsToChildren: <TTriggerProps>(children: React.ReactElement<any, string | React.JSXElementConstructor<any>> | ((props: TTriggerProps) => React.ReactElement | null) | null | undefined, triggerProps: TTriggerProps) => React.ReactElement | null;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import {
|
2
|
+
import { isFluentTrigger } from './isFluentTrigger';
|
3
3
|
/**
|
4
4
|
* Apply the trigger props to the children, either by calling the render function, or cloning with the new props.
|
5
5
|
*/
|
@@ -8,9 +8,29 @@ export const applyTriggerPropsToChildren = (children, triggerProps) => {
|
|
8
8
|
if (typeof children === 'function') {
|
9
9
|
return children(triggerProps);
|
10
10
|
} else if (children) {
|
11
|
-
return
|
11
|
+
return cloneTriggerTree(children, triggerProps);
|
12
|
+
} // Components in React should return either JSX elements or "null", otherwise React will throw:
|
13
|
+
// Nothing was returned from render.
|
14
|
+
// This usually means a return statement is missing. Or, to render nothing, return null.
|
15
|
+
|
16
|
+
|
17
|
+
return children || null;
|
18
|
+
};
|
19
|
+
/**
|
20
|
+
* Clones a React element tree, and applies the given props to the first grandchild that is not
|
21
|
+
* a FluentTriggerComponent or React Fragment (the same element returned by {@link getTriggerChild}).
|
22
|
+
*/
|
23
|
+
|
24
|
+
const cloneTriggerTree = (child, triggerProps) => {
|
25
|
+
if (! /*#__PURE__*/React.isValidElement(child) || child.type === React.Fragment) {
|
26
|
+
throw new Error('A trigger element must be a single element for this component. ' + "Please ensure that you're not using React Fragments.");
|
12
27
|
}
|
13
28
|
|
14
|
-
|
29
|
+
if (isFluentTrigger(child)) {
|
30
|
+
const grandchild = cloneTriggerTree(child.props.children, triggerProps);
|
31
|
+
return /*#__PURE__*/React.cloneElement(child, undefined, grandchild);
|
32
|
+
} else {
|
33
|
+
return /*#__PURE__*/React.cloneElement(child, triggerProps);
|
34
|
+
}
|
15
35
|
};
|
16
36
|
//# sourceMappingURL=applyTriggerPropsToChildren.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/utils/applyTriggerPropsToChildren.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["../../src/utils/applyTriggerPropsToChildren.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,eAAT,QAAgC,mBAAhC;AAEA;;AAEG;;AACH,OAAO,MAAM,2BAA2B,GAAG,CACzC,QADyC,EAEzC,YAFyC,KAGZ;AAC7B,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,WAAO,QAAQ,CAAC,YAAD,CAAf;AACD,GAFD,MAEO,IAAI,QAAJ,EAAc;AACnB,WAAO,gBAAgB,CAAC,QAAD,EAAW,YAAX,CAAvB;AACD,GAL4B,CAO7B;AACA;AACA;;;AACA,SAAO,QAAQ,IAAI,IAAnB;AACD,CAdM;AAgBP;;;AAGG;;AACH,MAAM,gBAAgB,GAAG,CAAgB,KAAhB,EAAwC,YAAxC,KAA2F;AAClH,MAAI,eAAC,KAAK,CAAC,cAAN,CAAqB,KAArB,CAAD,IAAgC,KAAK,CAAC,IAAN,KAAe,KAAK,CAAC,QAAzD,EAAmE;AACjE,UAAM,IAAI,KAAJ,CACJ,oEACE,sDAFE,CAAN;AAID;;AAED,MAAI,eAAe,CAAC,KAAD,CAAnB,EAA4B;AAC1B,UAAM,UAAU,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAN,CAAY,QAAb,EAAuB,YAAvB,CAAnC;AACA,wBAAO,KAAK,CAAC,YAAN,CAAmB,KAAnB,EAA0B,SAA1B,EAAqC,UAArC,CAAP;AACD,GAHD,MAGO;AACL,wBAAO,KAAK,CAAC,YAAN,CAAmB,KAAnB,EAA0B,YAA1B,CAAP;AACD;AACF,CAdD","sourceRoot":""}
|
@@ -15,17 +15,17 @@ export declare function getNativeElementProps<TAttributes extends React.HTMLAttr
|
|
15
15
|
*
|
16
16
|
* @returns An object containing the native props for the `root` and primary slots.
|
17
17
|
*/
|
18
|
-
export declare const getPartitionedNativeProps: ({ primarySlotTagName, props, excludedPropNames, }: {
|
18
|
+
export declare const getPartitionedNativeProps: <Props extends Pick<React.HTMLAttributes<HTMLElement>, "style" | "className">, ExcludedPropKeys extends Extract<keyof Props, string> = never>({ primarySlotTagName, props, excludedPropNames, }: {
|
19
19
|
/** The primary slot's element type (e.g. 'div') */
|
20
20
|
primarySlotTagName: keyof JSX.IntrinsicElements;
|
21
21
|
/** The component's props object */
|
22
|
-
props:
|
22
|
+
props: Props;
|
23
23
|
/** List of native props to exclude from the returned value */
|
24
|
-
excludedPropNames?:
|
24
|
+
excludedPropNames?: ExcludedPropKeys[] | undefined;
|
25
25
|
}) => {
|
26
26
|
root: {
|
27
27
|
style: React.CSSProperties | undefined;
|
28
28
|
className: string | undefined;
|
29
29
|
};
|
30
|
-
primary:
|
30
|
+
primary: Omit<Props, ExcludedPropKeys>;
|
31
31
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/utils/getNativeElementProps.ts"],"names":[],"mappings":"AACA,SACE,eADF,EAEE,eAFF,EAGE,eAHF,EAIE,YAJF,EAKE,YALF,EAME,gBANF,EAOE,gBAPF,EAQE,eARF,EASE,kBATF,EAUE,gBAVF,EAWE,gBAXF,EAYE,eAZF,EAaE,YAbF,EAcE,YAdF,EAeE,YAfF,EAgBE,kBAhBF,EAiBE,aAjBF,EAkBE,cAlBF,EAmBE,gBAnBF,EAoBE,aApBF,EAqBE,qBArBF,EAsBE,cAtBF,QAuBO,cAvBP;AAyBA,MAAM,gBAAgB,GAA2C;AAC/D,EAAA,KAAK,EAAE,eADwD;AAE/D,EAAA,KAAK,EAAE,eAFwD;AAG/D,EAAA,KAAK,EAAE,eAHwD;AAI/D,EAAA,EAAE,EAAE,YAJ2D;AAK/D,EAAA,EAAE,EAAE,YAL2D;AAM/D,EAAA,CAAC,EAAE,gBAN4D;AAO/D,EAAA,MAAM,EAAE,gBAPuD;AAQ/D,EAAA,KAAK,EAAE,eARwD;AAS/D,EAAA,QAAQ,EAAE,kBATqD;AAU/D,EAAA,MAAM,EAAE,gBAVuD;AAW/D,EAAA,MAAM,EAAE,gBAXuD;AAY/D,EAAA,KAAK,EAAE,eAZwD;AAa/D,EAAA,EAAE,EAAE,YAb2D;AAc/D,EAAA,EAAE,EAAE,YAd2D;AAe/D,EAAA,EAAE,EAAE,YAf2D;AAgB/D,EAAA,QAAQ,EAAE,kBAhBqD;AAiB/D,EAAA,GAAG,EAAE,aAjB0D;AAkB/D,EAAA,IAAI,EAAE,cAlByD;AAmB/D,EAAA,MAAM,EAAE,gBAnBuD;AAoB/D,EAAA,GAAG,EAAE;AApB0D,CAAjE;AAuBA;;;;;;AAMG;AACH;;AACA,OAAM,SAAU,qBAAV,CACJ,OADI,EAEJ,KAFI,EAGJ,iBAHI,EAGwB;AAE5B,QAAM,gBAAgB,GAAI,OAAO,IAAI,gBAAgB,CAAC,OAAD,CAA5B,IAA0C,qBAAnE;AACA,EAAA,gBAAgB,CAAC,EAAjB,GAAsB,CAAtB;AAEA,SAAO,cAAc,CAAC,KAAD,EAAQ,gBAAR,EAA0B,iBAA1B,CAArB;AACD;AAED;;;;;;;AAOG;;AACH,OAAO,MAAM,yBAAyB,GAAG,
|
1
|
+
{"version":3,"sources":["../../src/utils/getNativeElementProps.ts"],"names":[],"mappings":"AACA,SACE,eADF,EAEE,eAFF,EAGE,eAHF,EAIE,YAJF,EAKE,YALF,EAME,gBANF,EAOE,gBAPF,EAQE,eARF,EASE,kBATF,EAUE,gBAVF,EAWE,gBAXF,EAYE,eAZF,EAaE,YAbF,EAcE,YAdF,EAeE,YAfF,EAgBE,kBAhBF,EAiBE,aAjBF,EAkBE,cAlBF,EAmBE,gBAnBF,EAoBE,aApBF,EAqBE,qBArBF,EAsBE,cAtBF,QAuBO,cAvBP;AAyBA,MAAM,gBAAgB,GAA2C;AAC/D,EAAA,KAAK,EAAE,eADwD;AAE/D,EAAA,KAAK,EAAE,eAFwD;AAG/D,EAAA,KAAK,EAAE,eAHwD;AAI/D,EAAA,EAAE,EAAE,YAJ2D;AAK/D,EAAA,EAAE,EAAE,YAL2D;AAM/D,EAAA,CAAC,EAAE,gBAN4D;AAO/D,EAAA,MAAM,EAAE,gBAPuD;AAQ/D,EAAA,KAAK,EAAE,eARwD;AAS/D,EAAA,QAAQ,EAAE,kBATqD;AAU/D,EAAA,MAAM,EAAE,gBAVuD;AAW/D,EAAA,MAAM,EAAE,gBAXuD;AAY/D,EAAA,KAAK,EAAE,eAZwD;AAa/D,EAAA,EAAE,EAAE,YAb2D;AAc/D,EAAA,EAAE,EAAE,YAd2D;AAe/D,EAAA,EAAE,EAAE,YAf2D;AAgB/D,EAAA,QAAQ,EAAE,kBAhBqD;AAiB/D,EAAA,GAAG,EAAE,aAjB0D;AAkB/D,EAAA,IAAI,EAAE,cAlByD;AAmB/D,EAAA,MAAM,EAAE,gBAnBuD;AAoB/D,EAAA,GAAG,EAAE;AApB0D,CAAjE;AAuBA;;;;;;AAMG;AACH;;AACA,OAAM,SAAU,qBAAV,CACJ,OADI,EAEJ,KAFI,EAGJ,iBAHI,EAGwB;AAE5B,QAAM,gBAAgB,GAAI,OAAO,IAAI,gBAAgB,CAAC,OAAD,CAA5B,IAA0C,qBAAnE;AACA,EAAA,gBAAgB,CAAC,EAAjB,GAAsB,CAAtB;AAEA,SAAO,cAAc,CAAC,KAAD,EAAQ,gBAAR,EAA0B,iBAA1B,CAArB;AACD;AAED;;;;;;;AAOG;;AACH,OAAO,MAAM,yBAAyB,GAAG,CAGvC;AACA,EAAA,kBADA;AAEA,EAAA,KAFA;AAGA,EAAA;AAHA,CAHuC,KAgBpC;AACH,SAAO;AACL,IAAA,IAAI,EAAE;AAAE,MAAA,KAAK,EAAE,KAAK,CAAC,KAAf;AAAsB,MAAA,SAAS,EAAE,KAAK,CAAC;AAAvC,KADD;AAEL,IAAA,OAAO,EAAE,qBAAqB,CAAgC,kBAAhC,EAAoD,KAApD,EAA2D,CACvF,IAAI,iBAAiB,IAAI,EAAzB,CADuF,EAEvF,OAFuF,EAGvF,WAHuF,CAA3D;AAFzB,GAAP;AAQD,CAzBM","sourceRoot":""}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
interface ReactSyntheticEvent extends React.SyntheticEvent<unknown> {
|
3
|
+
_reactName?: string;
|
4
|
+
dispatchConfig?: {
|
5
|
+
registrationName: string;
|
6
|
+
phasedRegistrationNames: {
|
7
|
+
bubbled: string;
|
8
|
+
captured: string;
|
9
|
+
};
|
10
|
+
};
|
11
|
+
}
|
12
|
+
declare type NonUndefined<A> = A extends undefined ? never : A;
|
13
|
+
declare type FunctionKeys<T extends object> = {
|
14
|
+
[K in keyof T]-?: NonUndefined<T[K]> extends Function ? K : never;
|
15
|
+
}[keyof T];
|
16
|
+
export declare type ReactCallbackName = FunctionKeys<React.DOMAttributes<unknown>>;
|
17
|
+
/**
|
18
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
19
|
+
*
|
20
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
21
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
22
|
+
* are handled in bubble phase.
|
23
|
+
*/
|
24
|
+
export declare function getReactCallbackName(event: ReactSyntheticEvent): ReactCallbackName | undefined;
|
25
|
+
export {};
|
@@ -0,0 +1,26 @@
|
|
1
|
+
/**
|
2
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
3
|
+
*
|
4
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
5
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
6
|
+
* are handled in bubble phase.
|
7
|
+
*/
|
8
|
+
export function getReactCallbackName(event) {
|
9
|
+
if (event._reactName) {
|
10
|
+
return event._reactName;
|
11
|
+
}
|
12
|
+
|
13
|
+
if (event.dispatchConfig) {
|
14
|
+
if (event.dispatchConfig.registrationName) {
|
15
|
+
return event.dispatchConfig.registrationName;
|
16
|
+
}
|
17
|
+
|
18
|
+
return event.dispatchConfig.phasedRegistrationNames.bubbled;
|
19
|
+
}
|
20
|
+
|
21
|
+
if (process.env.NODE_ENV !== 'production') {
|
22
|
+
// eslint-disable-next-line no-console
|
23
|
+
console.error(['Passed React.SyntheticEvent does not contain ".dispatchConfig" or "._reactName".', 'This should not happen, please report it to https://github.com/microsoft/fluentui']);
|
24
|
+
}
|
25
|
+
}
|
26
|
+
//# sourceMappingURL=getReactCallbackName.js.map
|
@@ -0,0 +1 @@
|
|
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":""}
|
@@ -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,26 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { isFluentTrigger } from './isFluentTrigger';
|
3
|
+
/**
|
4
|
+
* Gets the trigger element of a FluentTriggerComponent (such as Tooltip or MenuTrigger).
|
5
|
+
*
|
6
|
+
* In the case where the immediate child is itself a FluentTriggerComponent and/or React Fragment,
|
7
|
+
* it returns the first descendant that is _not_ a FluentTriggerComponent or Fragment.
|
8
|
+
* This allows multiple triggers to be stacked, and still apply their props to the actual trigger element.
|
9
|
+
*
|
10
|
+
* For example, the following returns `<div id="child" />`:
|
11
|
+
* ```jsx
|
12
|
+
* getTriggerChild(
|
13
|
+
* <Tooltip>
|
14
|
+
* <MenuTrigger>
|
15
|
+
* <div id="child" />
|
16
|
+
* </MenuTrigger>
|
17
|
+
* </Tooltip>
|
18
|
+
* );
|
19
|
+
* ```
|
20
|
+
*/
|
21
|
+
|
22
|
+
export const getTriggerChild = children => {
|
23
|
+
const child = React.Children.only(children);
|
24
|
+
return isFluentTrigger(child) ? getTriggerChild(child.props.children) : child;
|
25
|
+
};
|
26
|
+
//# sourceMappingURL=getTriggerChild.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/utils/getTriggerChild.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,eAAT,QAAgC,mBAAhC;AAEA;;;;;;;;;;;;;;;;;AAiBG;;AACH,OAAO,MAAM,eAAe,GAAI,QAAD,IAAiF;AAC9G,QAAM,KAAK,GAAG,KAAK,CAAC,QAAN,CAAe,IAAf,CAAoB,QAApB,CAAd;AACA,SAAO,eAAe,CAAC,KAAD,CAAf,GAAyB,eAAe,CAAC,KAAK,CAAC,KAAN,CAAY,QAAb,CAAxC,GAAiE,KAAxE;AACD,CAHM","sourceRoot":""}
|
package/lib/utils/index.d.ts
CHANGED
@@ -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';
|
package/lib/utils/index.js
CHANGED
@@ -2,8 +2,9 @@ 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';
|
9
10
|
//# sourceMappingURL=index.js.map
|
package/lib/utils/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC;AAC9C,cAAc,SAAS,CAAC;AACxB,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC;AAC9C,cAAc,SAAS,CAAC;AACxB,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,iCAAiC,CAAC"}
|
@@ -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,8 @@
|
|
1
|
+
/**
|
2
|
+
* Checks if a given element is a FluentUI trigger (e.g. `MenuTrigger` or `Tooltip`).
|
3
|
+
* See the {@link FluentTriggerComponent} type for more info.
|
4
|
+
*/
|
5
|
+
export const isFluentTrigger = element => {
|
6
|
+
return element.type.isFluentTriggerComponent;
|
7
|
+
};
|
8
|
+
//# sourceMappingURL=isFluentTrigger.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/utils/isFluentTrigger.ts"],"names":[],"mappings":"AAmBA;;;AAGG;AACH,OAAO,MAAM,eAAe,GAAI,OAAD,IAAgC;AAC7D,SAAQ,OAAO,CAAC,IAAR,CAAwC,wBAAhD;AACD,CAFM","sourceRoot":""}
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { AsIntrinsicElement, ComponentState,
|
3
|
-
export declare type Slots<S extends
|
4
|
-
[K in keyof S]
|
2
|
+
import type { AsIntrinsicElement, ComponentState, ExtractSlotProps, SlotPropsRecord, UnionToIntersection } from './types';
|
3
|
+
export declare type Slots<S extends SlotPropsRecord> = {
|
4
|
+
[K in keyof S]: ExtractSlotProps<S[K]> extends AsIntrinsicElement<infer As> ? As : ExtractSlotProps<S[K]> extends React.ComponentType<infer P> ? React.ElementType<NonNullable<P>> : React.ElementType<ExtractSlotProps<S[K]>>;
|
5
5
|
};
|
6
|
-
declare type
|
7
|
-
[K in keyof S]-?:
|
6
|
+
declare type ObjectSlotProps<S extends SlotPropsRecord> = {
|
7
|
+
[K in keyof S]-?: ExtractSlotProps<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : ExtractSlotProps<S[K]> extends React.ComponentType<infer P> ? P : never;
|
8
8
|
};
|
9
9
|
/**
|
10
10
|
* Given the state and an array of slot names, will break out `slots` and `slotProps`
|
@@ -21,11 +21,10 @@ declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
|
|
21
21
|
* runtime code filtering props in this function.
|
22
22
|
*
|
23
23
|
* @param state - State including slot definitions
|
24
|
-
* @param slotNames - Name of which props are slots
|
25
24
|
* @returns An object containing the `slots` map and `slotProps` map.
|
26
25
|
*/
|
27
|
-
export declare function getSlots<R extends
|
26
|
+
export declare function getSlots<R extends SlotPropsRecord>(state: ComponentState<R>): {
|
28
27
|
slots: Slots<R>;
|
29
|
-
slotProps:
|
28
|
+
slotProps: ObjectSlotProps<R>;
|
30
29
|
};
|
31
30
|
export {};
|