@fluentui/react-utilities 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.4

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

@@ -1,12 +1,16 @@
-import type { DefaultObjectShorthandProps, ShorthandProps } from './types';
-export declare type ResolveShorthandOptions<Props extends Record<string, any>, Required extends boolean = false> = {
+import type { ReplaceNullWithUndefined, SlotShorthandValue, UnknownSlotProps } from './types';
+export declare type ResolveShorthandOptions<Props, Required extends boolean = false> = {
     required?: Required;
     defaultProps?: Props;
 };
+export declare type ResolveShorthandFunction<Props extends UnknownSlotProps = UnknownSlotProps> = {
+    <P extends Props | null>(value: P | SlotShorthandValue | undefined, options?: ResolveShorthandOptions<P, true>): ReplaceNullWithUndefined<P>;
+    <P extends Props | null>(value: P | SlotShorthandValue | undefined, options?: ResolveShorthandOptions<P, boolean>): ReplaceNullWithUndefined<P> | undefined;
+};
 /**
- * Resolves ShorthandProps into ObjectShorthandProps, to ensure normalization of the signature
+ * Resolves shorthands into slot props, to ensure normalization of the signature
  * being passed down to getSlots method
- * @param value - the base ShorthandProps
- * @param options - options to resolve ShorthandProps
+ * @param value - the base shorthand props
+ * @param options - options to resolve shorthand props
  */
-export declare function resolveShorthand<Props extends DefaultObjectShorthandProps, Required extends boolean = false>(value: ShorthandProps<Props>, options?: ResolveShorthandOptions<Props, Required>): Required extends false ? Props | undefined : Props;
+export declare const resolveShorthand: ResolveShorthandFunction;

package/lib-commonjs/compose/resolveShorthand.js

@@ -5,28 +5,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.resolveShorthand = void 0;
 
-var tslib_1 = /*#__PURE__*/require("tslib");
-
-var react_1 = /*#__PURE__*/require("react");
+const react_1 = /*#__PURE__*/require("react");
 /**
- * Resolves ShorthandProps into ObjectShorthandProps, to ensure normalization of the signature
+ * Resolves shorthands into slot props, to ensure normalization of the signature
  * being passed down to getSlots method
- * @param value - the base ShorthandProps
- * @param options - options to resolve ShorthandProps
+ * @param value - the base shorthand props
+ * @param options - options to resolve shorthand props
  */
 
 
-function resolveShorthand(value, options) {
-  var _a = options || {},
-      _b = _a.required,
-      required = _b === void 0 ? false : _b,
-      defaultProps = _a.defaultProps;
+const resolveShorthand = (value, options) => {
+  const {
+    required = false,
+    defaultProps
+  } = options || {};
 
   if (value === null || value === undefined && !required) {
     return undefined;
   }
 
-  var resolvedShorthand = {};
+  let resolvedShorthand = {};
 
   if (typeof value === 'string' || typeof value === 'number' || Array.isArray(value) || react_1.isValidElement(value)) {
     resolvedShorthand.children = value;
@@ -34,8 +32,10 @@ function resolveShorthand(value, options) {
     resolvedShorthand = value;
   }
 
-  return defaultProps ? tslib_1.__assign(tslib_1.__assign({}, defaultProps), resolvedShorthand) : resolvedShorthand;
-}
+  return defaultProps ? { ...defaultProps,
+    ...resolvedShorthand
+  } : resolvedShorthand;
+};
 
 exports.resolveShorthand = resolveShorthand;
 //# sourceMappingURL=resolveShorthand.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/compose/resolveShorthand.ts"],"names":[],"mappings":";;;;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AASA;;;;;AAKG;;;AACH,SAAgB,gBAAhB,CACE,KADF,EAEE,OAFF,EAEoD;AAE5C,MAAA,EAAA,GAAqC,OAAO,IAAI,EAAhD;AAAA,MAAE,EAAA,GAAA,EAAA,CAAA,QAAF;AAAA,MAAE,QAAQ,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQ,EAAlB;AAAA,MAAoB,YAAY,GAAA,EAAA,CAAA,YAAhC;;AACN,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,IAAkF,OAAA,CAAA,cAAA,CAAe,KAAf,CAAtF,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,SAAQ,YAAY,GAAE,OAAA,CAAA,QAAA,CAAA,OAAA,CAAA,QAAA,CAAA,EAAA,EAAM,YAAN,CAAA,EAAuB,iBAAvB,CAAF,GAA+C,iBAAnE;AAGD;;AApBD,OAAA,CAAA,gBAAA,GAAA,gBAAA","sourceRoot":""}
+{"version":3,"sources":["compose/resolveShorthand.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAkBA;;;;;AAKG;;;AACI,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,IAAkF,OAAA,CAAA,cAAA,CAAe,KAAf,CAAtF,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;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourcesContent":["import { isValidElement } from 'react';\nimport type { ReplaceNullWithUndefined, SlotShorthandValue, UnknownSlotProps } from './types';\n\nexport type ResolveShorthandOptions<Props, Required extends boolean = false> = {\n  required?: Required;\n  defaultProps?: Props;\n};\n\nexport type ResolveShorthandFunction<Props extends UnknownSlotProps = UnknownSlotProps> = {\n  <P extends Props | null>(\n    value: P | SlotShorthandValue | undefined,\n    options?: ResolveShorthandOptions<P, true>,\n  ): ReplaceNullWithUndefined<P>;\n  <P extends Props | null>(value: P | SlotShorthandValue | undefined, options?: ResolveShorthandOptions<P, boolean>):\n    | ReplaceNullWithUndefined<P>\n    | undefined;\n};\n\n/**\n * Resolves shorthands into slot props, to ensure normalization of the signature\n * being passed down to getSlots method\n * @param value - the base shorthand props\n * @param options - options to resolve shorthand props\n */\nexport const resolveShorthand: ResolveShorthandFunction = (value, options) => {\n  const { required = false, defaultProps } = options || {};\n  if (value === null || (value === undefined && !required)) {\n    return undefined;\n  }\n\n  let resolvedShorthand = {} as UnknownSlotProps;\n\n  if (typeof value === 'string' || typeof value === 'number' || Array.isArray(value) || isValidElement(value)) {\n    resolvedShorthand.children = value;\n  } else if (typeof value === 'object') {\n    resolvedShorthand = value;\n  }\n\n  return defaultProps ? { ...defaultProps, ...resolvedShorthand } : resolvedShorthand;\n};\n"],"sourceRoot":"../src/"}

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

@@ -1,47 +1,83 @@
 import * as React from 'react';
-export declare type ShorthandRenderFunction<Props> = (Component: React.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React.ReactNode;
-export declare type ObjectShorthandPropsRecord = Record<string, DefaultObjectShorthandProps | undefined>;
-export declare type ShorthandProps<Props extends DefaultObjectShorthandProps> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | number | null | undefined | Props;
+export declare type SlotRenderFunction<Props> = (Component: React.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React.ReactNode;
 /**
- * Matches any shorthand props type.
+ * Matches any component's Slots type (such as ButtonSlots).
  *
- * This should ONLY be used in type templates as in `extends DefaultObjectShorthandProps`;
+ * This should ONLY be used in type templates as in `extends SlotPropsRecord`;
+ * it shouldn't be used as a component's Slots type.
+ */
+export declare type SlotPropsRecord = Record<string, UnknownSlotProps | SlotShorthandValue | null | undefined>;
+/**
+ * The shorthand value of a slot allows specifying its child
+ */
+export declare type SlotShorthandValue = React.ReactChild | React.ReactNodeArray | React.ReactPortal;
+/**
+ * Matches any slot props type.
+ *
+ * This should ONLY be used in type templates as in `extends UnknownSlotProps`;
  * it shouldn't be used as the type of a slot.
  */
-export declare type DefaultObjectShorthandProps = ObjectShorthandProps<{
-    children?: React.ReactNode;
+export declare type UnknownSlotProps = Pick<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {
     as?: keyof JSX.IntrinsicElements;
-}>;
+};
 /**
- * Defines the slot props for a slot that supports a Component type.
- *
- * For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
+ * Helper type for {@link Slot}. Adds shorthand types that are assignable to the slot's `children`.
  */
-export declare type ObjectShorthandProps<Props extends {
-    children?: React.ReactNode;
-} = {}> = Props & {
-    children?: Props['children'] | ShorthandRenderFunction<Props>;
+declare type WithSlotShorthandValue<Props extends {
+    children?: unknown;
+}> = Props | Extract<SlotShorthandValue, Props['children']>;
+/**
+ * Helper type for {@link Slot}. Takes the props we want to support for a slot and adds the ability for `children`
+ * to be a render function that takes those props.
+ */
+declare type WithSlotRenderFunction<Props extends {
+    children?: unknown;
+}> = Props & {
+    children?: Props['children'] | SlotRenderFunction<Props>;
 };
 /**
- * Define the slot arguments for a slot that supports one or more intrinsic element types, such as 'div'.
- * For slots that support custom components, use {@link ObjectShorthandProps} instead.
+ * HTML element types that are not allowed to have children.
+ *
+ * Reference: https://developer.mozilla.org/en-US/docs/Glossary/Empty_element
+ */
+declare type EmptyIntrisicElements = 'area' | 'base' | 'br' | 'col' | 'embed' | 'hr' | 'img' | 'input' | 'link' | 'meta' | 'param' | 'source' | 'track' | 'wbr';
+/**
+ * Helper type for {@link Slot}. Modifies `JSX.IntrinsicElements[Type]`:
+ * * Removes legacy string ref.
+ * * Disallows children for empty tags like 'img'.
+ */
+declare type IntrisicElementProps<Type extends keyof JSX.IntrinsicElements> = React.PropsWithRef<JSX.IntrinsicElements[Type]> & (Type extends EmptyIntrisicElements ? {
+    children?: never;
+} : {});
+/**
+ * The props type and shorthand value for a slot. Type is either a single intrinsic element like `'div'`,
+ * or a component like `typeof Button`.
+ *
+ * If a slot needs to support multiple intrinsic element types, use the `AlternateAs` param (see examples below).
  *
- * The first param is the slot's default type if no `as` prop is specified.
- * The second param is an optional union of alternative types that can be specified for the `as` prop.
+ * By default, slots can be set to `null` to prevent them from being rendered. If a slot must always be rendered,
+ * wrap with `NonNullable` (see examples below).
  *
+ * @example
  * ```
- * IntrinsicShorthandProps<'div'> // Slot is always div
- * IntrinsicShorthandProps<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
- * IntrinsicShorthandProps<'label', 'span' | 'div'>; // Defaults to label, but allows as="span" or as="div"
+ * // Intrinsic element examples:
+ * Slot<'div'> // Slot is always div
+ * Slot<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
+ * Slot<'span', 'div' | 'pre'> // Defaults to span, but allows as="div" or as="pre"
+ * NonNullable<Slot<'div'>> // Slot that will always be rendered (can't be set to null by the user)
+ *
+ * // Component examples:
+ * Slot<typeof Button> // Slot is always a Button, and accepts all of Button's Props
+ * NonNullable<Slot<typeof Label>> // Slot is a Label and will always be rendered (can't be set to null by the user)
  * ```
  */
-export declare type IntrinsicShorthandProps<DefaultAs extends keyof JSX.IntrinsicElements, AlternateAs extends keyof JSX.IntrinsicElements = never> = IsSingleton<DefaultAs> extends false ? 'Error: first parameter to IntrinsicShorthandProps must be a single element type, not a union of types' : ({
-    as?: DefaultAs;
-} & ObjectShorthandProps<React.PropsWithRef<JSX.IntrinsicElements[DefaultAs]>>) | {
+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 ? {
+    as?: Type;
+} & WithSlotRenderFunction<IntrisicElementProps<Type>> : Type extends React.ComponentType<infer Props> ? WithSlotRenderFunction<Props> : Type> | {
     [As in AlternateAs]: {
         as: As;
-    } & ObjectShorthandProps<React.PropsWithRef<JSX.IntrinsicElements[As]>>;
-}[AlternateAs];
+    } & WithSlotRenderFunction<IntrisicElementProps<As>>;
+}[AlternateAs] | null : 'Error: First parameter to Slot must not be not a union of types. See documentation of Slot type.';
 /**
  * Evaluates to true if the given type contains exactly one string, or false if it is a union of strings.
  *
@@ -70,20 +106,35 @@ export declare type AsIntrinsicElement<As extends keyof JSX.IntrinsicElements> =
 export declare type UnionToIntersection<U> = (U extends unknown ? (x: U) => U : never) extends (x: infer I) => U ? I : never;
 /**
  * Removes the 'ref' prop from the given Props type, leaving unions intact (such as the discriminated union created by
- * IntrinsicShorthandProps). This allows IntrinsicShorthandProps to be used with React.forwardRef.
+ * IntrinsicSlotProps). This allows IntrinsicSlotProps to be used with React.forwardRef.
  *
  * The conditional "extends unknown" (always true) exploits a quirk in the way TypeScript handles conditional
  * types, to prevent unions from being expanded.
  */
 export declare type PropsWithoutRef<P> = 'ref' extends keyof P ? (P extends unknown ? Omit<P, 'ref'> : P) : P;
-export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord, Primary extends keyof Shorthands = 'root'> = Omit<{
-    [Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
-}, Primary> & PropsWithoutRef<Shorthands[Primary]>;
-export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
-    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);
+/**
+ * Removes SlotShorthandValue and null from the slot type, extracting just the slot's Props object.
+ */
+export declare type ExtractSlotProps<S> = Exclude<S, SlotShorthandValue | null | undefined>;
+/**
+ * Defines the Props type for a component given its slots and the definition of which one is the primary slot,
+ * defaulting to root if one is not provided.
+ */
+export declare type ComponentProps<Slots extends SlotPropsRecord, Primary extends keyof Slots = 'root'> = Omit<Slots, Primary & 'root'> & PropsWithoutRef<ExtractSlotProps<Slots[Primary]>>;
+/**
+ * If type T includes `null`, remove it and add `undefined` instead.
+ */
+export declare type ReplaceNullWithUndefined<T> = T extends null ? Exclude<T, null> | undefined : T;
+/**
+ * Defines the State object of a component given its slots.
+ */
+export declare type ComponentState<Slots extends SlotPropsRecord> = {
+    components: {
+        [Key in keyof Slots]-?: React.ComponentType<ExtractSlotProps<Slots[Key]>> | (ExtractSlotProps<Slots[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
     };
-} & Shorthands;
+} & {
+    [Key in keyof Slots]: ReplaceNullWithUndefined<Exclude<Slots[Key], SlotShorthandValue | (Key extends 'root' ? null : never)>>;
+};
 /**
  * This is part of a hack to infer the element type from a native element *props* type.
  * The only place the original element is found in a native props type (at least that's workable
@@ -101,45 +152,4 @@ declare type ObscureEventName = 'onLostPointerCaptureCapture';
  * Return type for `React.forwardRef`, including inference of the proper typing for the ref.
  */
 export declare type ForwardRefComponent<Props> = ObscureEventName extends keyof Props ? Required<Props>[ObscureEventName] extends React.PointerEventHandler<infer Element> ? React.ForwardRefExoticComponent<Props & React.RefAttributes<Element>> : never : never;
-export declare type ComponentPropsCompat = {
-    as?: React.ElementType;
-    className?: string;
-    children?: React.ReactNode;
-};
-export declare type ShorthandRenderFunctionCompat<TProps> = (Component: React.ElementType<TProps>, props: TProps) => React.ReactNode;
-export declare type ShorthandPropsCompat<TProps extends ComponentPropsCompat = {}> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | number | null | undefined | ObjectShorthandPropsCompat<TProps>;
-export declare type ObjectShorthandPropsCompat<TProps extends ComponentPropsCompat = {}> = TProps & Omit<ComponentPropsCompat, 'children'> & {
-    children?: TProps['children'] | ShorthandRenderFunctionCompat<TProps>;
-};
-export declare type BaseSlotsCompat = {
-    root: React.ElementType;
-};
-export declare type SlotPropsCompat<TSlots extends BaseSlotsCompat, TProps, TRootProps extends React.HTMLAttributes<HTMLElement>> = {
-    [key in keyof Omit<TSlots, 'root'>]: key extends keyof TProps ? TProps[key] : any;
-} & {
-    root: TRootProps;
-};
-/**
- * Helper type to convert the given props of type ShorthandProps into ObjectShorthandProps
- */
-export declare type ResolvedShorthandPropsCompat<T, K extends keyof T> = Omit<T, K> & {
-    [P in K]: T[P] extends ShorthandPropsCompat<infer U> ? ObjectShorthandPropsCompat<U> : T[P];
-};
-/**
- * Helper type to mark the given props as required.
- * Similar to Required<T> except it only requires a subset of the props.
- */
-export declare type RequiredPropsCompat<T, K extends keyof T> = Omit<T, K> & {
-    [P in K]-?: T[P];
-};
-/**
- * Converts a components Props type to a State type:
- * * Ensures the specified ShorthandProps are of type ObjectShorthandProps<T>
- * * Marks the given defaulted props as required (-?)
- *
- * @template Props - The component's Props type
- * @template ShorthandPropNames - The keys of Props that correspond to ShorthandProps
- * @template DefaultedPropNames - The keys of Props that will always have a default value provided
- */
-export declare type ComponentStateCompat<Props, ShorthandPropNames extends keyof Props = never, DefaultedPropNames extends keyof ResolvedShorthandPropsCompat<Props, ShorthandPropNames> = never> = RequiredPropsCompat<ResolvedShorthandPropsCompat<Props, ShorthandPropNames>, DefaultedPropNames>;
 export {};

package/lib-commonjs/compose/types.js

@@ -2,5 +2,9 @@
 
 Object.defineProperty(exports, "__esModule", {
   value: true
-});
+}); // A definition like this would also work, but typescript is more likely to unnecessarily expand
+// the props type with this version (and it's likely much more expensive to evaluate)
+// export type ForwardRefComponent<Props> = Props extends React.DOMAttributes<infer Element>
+//   ? React.ForwardRefExoticComponent<Props> & React.RefAttributes<Element>
+//   : never;
 //# sourceMappingURL=types.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
+{"version":3,"sources":["compose/types.ts"],"names":[],"mappings":";;;;IAqNA;AACA;AACA;AACA;AACA","sourcesContent":["import * as React from 'react';\n\nexport type SlotRenderFunction<Props> = (\n  Component: React.ElementType<Props>,\n  props: Omit<Props, 'children' | 'as'>,\n) => React.ReactNode;\n\n/**\n * Matches any component's Slots type (such as ButtonSlots).\n *\n * This should ONLY be used in type templates as in `extends SlotPropsRecord`;\n * it shouldn't be used as a component's Slots type.\n */\nexport type SlotPropsRecord = Record<string, UnknownSlotProps | SlotShorthandValue | null | undefined>;\n\n/**\n * The shorthand value of a slot allows specifying its child\n */\nexport type SlotShorthandValue = React.ReactChild | React.ReactNodeArray | React.ReactPortal;\n\n/**\n * Matches any slot props type.\n *\n * This should ONLY be used in type templates as in `extends UnknownSlotProps`;\n * it shouldn't be used as the type of a slot.\n */\nexport type UnknownSlotProps = Pick<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {\n  as?: keyof JSX.IntrinsicElements;\n};\n\n/**\n * Helper type for {@link Slot}. Adds shorthand types that are assignable to the slot's `children`.\n */\ntype WithSlotShorthandValue<Props extends { children?: unknown }> =\n  | Props\n  | Extract<SlotShorthandValue, Props['children']>;\n\n/**\n * Helper type for {@link Slot}. Takes the props we want to support for a slot and adds the ability for `children`\n * to be a render function that takes those props.\n */\ntype WithSlotRenderFunction<Props extends { children?: unknown }> = Props & {\n  children?: Props['children'] | SlotRenderFunction<Props>;\n};\n\n/**\n * HTML element types that are not allowed to have children.\n *\n * Reference: https://developer.mozilla.org/en-US/docs/Glossary/Empty_element\n */\ntype EmptyIntrisicElements =\n  | 'area'\n  | 'base'\n  | 'br'\n  | 'col'\n  | 'embed'\n  | 'hr'\n  | 'img'\n  | 'input'\n  | 'link'\n  | 'meta'\n  | 'param'\n  | 'source'\n  | 'track'\n  | 'wbr';\n\n/**\n * Helper type for {@link Slot}. Modifies `JSX.IntrinsicElements[Type]`:\n * * Removes legacy string ref.\n * * Disallows children for empty tags like 'img'.\n */\ntype IntrisicElementProps<Type extends keyof JSX.IntrinsicElements> = React.PropsWithRef<JSX.IntrinsicElements[Type]> &\n  (Type extends EmptyIntrisicElements ? { children?: never } : {});\n\n/**\n * The props type and shorthand value for a slot. Type is either a single intrinsic element like `'div'`,\n * or a component like `typeof Button`.\n *\n * If a slot needs to support multiple intrinsic element types, use the `AlternateAs` param (see examples below).\n *\n * By default, slots can be set to `null` to prevent them from being rendered. If a slot must always be rendered,\n * wrap with `NonNullable` (see examples below).\n *\n * @example\n * ```\n * // Intrinsic element examples:\n * Slot<'div'> // Slot is always div\n * Slot<'button', 'a'> // Defaults to button, but allows as=\"a\" with anchor-specific props\n * Slot<'span', 'div' | 'pre'> // Defaults to span, but allows as=\"div\" or as=\"pre\"\n * NonNullable<Slot<'div'>> // Slot that will always be rendered (can't be set to null by the user)\n *\n * // Component examples:\n * Slot<typeof Button> // Slot is always a Button, and accepts all of Button's Props\n * NonNullable<Slot<typeof Label>> // Slot is a Label and will always be rendered (can't be set to null by the user)\n * ```\n */\nexport type Slot<\n  Type extends keyof JSX.IntrinsicElements | React.ComponentType | UnknownSlotProps,\n  AlternateAs extends keyof JSX.IntrinsicElements = never\n> = IsSingleton<Extract<Type, string>> extends true\n  ?\n      | WithSlotShorthandValue<\n          Type extends keyof JSX.IntrinsicElements // Intrinsic elements like `div`\n            ? { as?: Type } & WithSlotRenderFunction<IntrisicElementProps<Type>>\n            : Type extends React.ComponentType<infer Props> // Component types like `typeof Button`\n            ? WithSlotRenderFunction<Props>\n            : Type // Props types like `ButtonProps`\n        >\n      | {\n          [As in AlternateAs]: { as: As } & WithSlotRenderFunction<IntrisicElementProps<As>>;\n        }[AlternateAs]\n      | null\n  : 'Error: First parameter to Slot must not be not a union of types. See documentation of Slot type.';\n\n/**\n * Evaluates to true if the given type contains exactly one string, or false if it is a union of strings.\n *\n * ```\n * IsSingleton<'a'> // true\n * IsSingleton<'a' | 'b' | 'c'> // false\n * ```\n */\nexport type IsSingleton<T extends string> = { [K in T]: Exclude<T, K> extends never ? true : false }[T];\n\n/**\n * Helper type for inferring the type of the as prop from a Props type.\n *\n * For example:\n * ```\n * type Example<T> = T extends AsIntrinsicElement<infer As> ? As : never;\n * ```\n */\nexport type AsIntrinsicElement<As extends keyof JSX.IntrinsicElements> = { as?: As };\n\n/**\n * Converts a union type (`A | B | C`) to an intersection type (`A & B & C`)\n */\nexport type UnionToIntersection<U> = (U extends unknown ? (x: U) => U : never) extends (x: infer I) => U ? I : never;\n\n/**\n * Removes the 'ref' prop from the given Props type, leaving unions intact (such as the discriminated union created by\n * IntrinsicSlotProps). This allows IntrinsicSlotProps to be used with React.forwardRef.\n *\n * The conditional \"extends unknown\" (always true) exploits a quirk in the way TypeScript handles conditional\n * types, to prevent unions from being expanded.\n */\nexport type PropsWithoutRef<P> = 'ref' extends keyof P ? (P extends unknown ? Omit<P, 'ref'> : P) : P;\n\n/**\n * Removes SlotShorthandValue and null from the slot type, extracting just the slot's Props object.\n */\nexport type ExtractSlotProps<S> = Exclude<S, SlotShorthandValue | null | undefined>;\n\n/**\n * Defines the Props type for a component given its slots and the definition of which one is the primary slot,\n * defaulting to root if one is not provided.\n */\nexport type ComponentProps<Slots extends SlotPropsRecord, Primary extends keyof Slots = 'root'> =\n  // Include a prop for each slot (see note below about the Omit)\n  Omit<Slots, Primary & 'root'> &\n    // Include all of the props of the primary slot inline in the component's props\n    PropsWithoutRef<ExtractSlotProps<Slots[Primary]>>;\n\n// Note: the `Omit<Slots, Primary & 'root'>` above is a little tricky. Here's what it's doing:\n// * If the Primary slot is 'root', then omit the `root` slot prop.\n// * Otherwise, don't omit any props: include *both* the Primary and `root` props.\n//   We need both props to allow the user to specify native props for either slot because the `root` slot is\n//   special and always gets className and style props, per RFC https://github.com/microsoft/fluentui/pull/18983\n\n/**\n * If type T includes `null`, remove it and add `undefined` instead.\n */\nexport type ReplaceNullWithUndefined<T> = T extends null ? Exclude<T, null> | undefined : T;\n\n/**\n * Defines the State object of a component given its slots.\n */\nexport type ComponentState<Slots extends SlotPropsRecord> = {\n  components: {\n    [Key in keyof Slots]-?:\n      | React.ComponentType<ExtractSlotProps<Slots[Key]>>\n      | (ExtractSlotProps<Slots[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  };\n} & {\n  // Include a prop for each slot, with the shorthand resolved to a props object\n  // The root slot can never be null, so also exclude null from it\n  [Key in keyof Slots]: ReplaceNullWithUndefined<\n    Exclude<Slots[Key], SlotShorthandValue | (Key extends 'root' ? null : never)>\n  >;\n};\n\n/**\n * This is part of a hack to infer the element type from a native element *props* type.\n * The only place the original element is found in a native props type (at least that's workable\n * for inference) is in the event handlers, so some of the helper types use this event handler\n * name to infer the original element type.\n *\n * Notes:\n * - Using an extremely obscure event handler reduces the likelihood that its signature will be\n *   modified in any component's props.\n * - Inferring based on a single prop name instead of a larger type like `DOMAttributes<T>` should be\n *   less expensive for typescript to evaluate and is less likely to result in type expansion in .d.ts.\n */\ntype ObscureEventName = 'onLostPointerCaptureCapture';\n\n/**\n * Return type for `React.forwardRef`, including inference of the proper typing for the ref.\n */\nexport type ForwardRefComponent<Props> = ObscureEventName extends keyof Props\n  ? Required<Props>[ObscureEventName] extends React.PointerEventHandler<infer Element>\n    ? React.ForwardRefExoticComponent<Props & React.RefAttributes<Element>>\n    : never\n  : never;\n// A definition like this would also work, but typescript is more likely to unnecessarily expand\n// the props type with this version (and it's likely much more expensive to evaluate)\n// export type ForwardRefComponent<Props> = Props extends React.DOMAttributes<infer Element>\n//   ? React.ForwardRefExoticComponent<Props> & React.RefAttributes<Element>\n//   : never;\n"],"sourceRoot":"../src/"}

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

@@ -1,11 +1,11 @@
 export * from './useControllableState';
 export * from './useBoolean';
 export * from './useConst';
-export * from './useControllableValue';
 export * from './useEventCallback';
 export * from './useFirstMount';
 export * from './useId';
 export * from './useIsomorphicLayoutEffect';
+export * from './useMergedEventCallbacks';
 export * from './useMergedRefs';
 export * from './useMount';
 export * from './useOnClickOutside';

package/lib-commonjs/hooks/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./useControllableState"), exports);
 
@@ -12,8 +12,6 @@ tslib_1.__exportStar(require("./useBoolean"), exports);
 
 tslib_1.__exportStar(require("./useConst"), exports);
 
-tslib_1.__exportStar(require("./useControllableValue"), exports);
-
 tslib_1.__exportStar(require("./useEventCallback"), exports);
 
 tslib_1.__exportStar(require("./useFirstMount"), exports);
@@ -22,6 +20,8 @@ tslib_1.__exportStar(require("./useId"), exports);
 
 tslib_1.__exportStar(require("./useIsomorphicLayoutEffect"), exports);
 
+tslib_1.__exportStar(require("./useMergedEventCallbacks"), exports);
+
 tslib_1.__exportStar(require("./useMergedRefs"), exports);
 
 tslib_1.__exportStar(require("./useMount"), 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,wBAAA,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":["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,2BAAA,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","sourcesContent":["export * from './useControllableState';\nexport * from './useBoolean';\nexport * from './useConst';\nexport * from './useEventCallback';\nexport * from './useFirstMount';\nexport * from './useId';\nexport * from './useIsomorphicLayoutEffect';\nexport * from './useMergedEventCallbacks';\nexport * from './useMergedRefs';\nexport * from './useMount';\nexport * from './useOnClickOutside';\nexport * from './useOnScrollOutside';\nexport * from './usePrevious';\nexport * from './useTimeout';\nexport * from './useUnmount';\nexport * from './useForceUpdate';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useBoolean.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useBoolean = void 0;
 
-var React = /*#__PURE__*/require("react");
+const React = /*#__PURE__*/require("react");
 
-var useConst_1 = /*#__PURE__*/require("./useConst");
+const useConst_1 = /*#__PURE__*/require("./useConst");
 /**
  * Hook to store a value and generate callbacks for setting the value to true or false.
  * The identity of the callbacks will always stay the same.
@@ -18,31 +18,20 @@ var useConst_1 = /*#__PURE__*/require("./useConst");
 
 
 function useBoolean(initialState) {
-  var _a = React.useState(initialState),
-      value = _a[0],
-      setValue = _a[1];
-
-  var setTrue = useConst_1.useConst(function () {
-    return function () {
-      setValue(true);
-    };
+  const [value, setValue] = React.useState(initialState);
+  const setTrue = useConst_1.useConst(() => () => {
+    setValue(true);
   });
-  var setFalse = useConst_1.useConst(function () {
-    return function () {
-      setValue(false);
-    };
+  const setFalse = useConst_1.useConst(() => () => {
+    setValue(false);
   });
-  var toggle = useConst_1.useConst(function () {
-    return function () {
-      setValue(function (currentValue) {
-        return !currentValue;
-      });
-    };
+  const toggle = useConst_1.useConst(() => () => {
+    setValue(currentValue => !currentValue);
   });
   return [value, {
-    setTrue: setTrue,
-    setFalse: setFalse,
-    toggle: toggle
+    setTrue,
+    setFalse,
+    toggle
   }];
 }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useBoolean.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;AAYA;;;;;;AAMG;;;AACH,SAAgB,UAAhB,CAA2B,YAA3B,EAAgD;AACxC,MAAA,EAAA,GAAoB,KAAK,CAAC,QAAN,CAAe,YAAf,CAApB;AAAA,MAAC,KAAK,GAAA,EAAA,CAAA,CAAA,CAAN;AAAA,MAAQ,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAhB;;AAEN,MAAM,OAAO,GAAG,UAAA,CAAA,QAAA,CAAS,YAAA;AAAM,WAAA,YAAA;AAC7B,MAAA,QAAQ,CAAC,IAAD,CAAR;AAD6B,KAAA;AAE9B,GAFe,CAAhB;AAGA,MAAM,QAAQ,GAAG,UAAA,CAAA,QAAA,CAAS,YAAA;AAAM,WAAA,YAAA;AAC9B,MAAA,QAAQ,CAAC,KAAD,CAAR;AAD8B,KAAA;AAE/B,GAFgB,CAAjB;AAGA,MAAM,MAAM,GAAG,UAAA,CAAA,QAAA,CAAS,YAAA;AAAM,WAAA,YAAA;AAC5B,MAAA,QAAQ,CAAC,UAAA,YAAA,EAAY;AAAI,eAAA,CAAA,YAAA;AAAa,OAA9B,CAAR;AAD4B,KAAA;AAE7B,GAFc,CAAf;AAIA,SAAO,CAAC,KAAD,EAAQ;AAAE,IAAA,OAAO,EAAA,OAAT;AAAW,IAAA,QAAQ,EAAA,QAAnB;AAAqB,IAAA,MAAM,EAAA;AAA3B,GAAR,CAAP;AACD;;AAdD,OAAA,CAAA,UAAA,GAAA,UAAA","sourceRoot":""}
+{"version":3,"sources":["hooks/useBoolean.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;AAYA;;;;;;AAMG;;;AACH,SAAgB,UAAhB,CAA2B,YAA3B,EAAgD;AAC9C,QAAM,CAAC,KAAD,EAAQ,QAAR,IAAoB,KAAK,CAAC,QAAN,CAAe,YAAf,CAA1B;AAEA,QAAM,OAAO,GAAG,UAAA,CAAA,QAAA,CAAS,MAAM,MAAK;AAClC,IAAA,QAAQ,CAAC,IAAD,CAAR;AACD,GAFe,CAAhB;AAGA,QAAM,QAAQ,GAAG,UAAA,CAAA,QAAA,CAAS,MAAM,MAAK;AACnC,IAAA,QAAQ,CAAC,KAAD,CAAR;AACD,GAFgB,CAAjB;AAGA,QAAM,MAAM,GAAG,UAAA,CAAA,QAAA,CAAS,MAAM,MAAK;AACjC,IAAA,QAAQ,CAAC,YAAY,IAAI,CAAC,YAAlB,CAAR;AACD,GAFc,CAAf;AAIA,SAAO,CAAC,KAAD,EAAQ;AAAE,IAAA,OAAF;AAAW,IAAA,QAAX;AAAqB,IAAA;AAArB,GAAR,CAAP;AACD;;AAdD,OAAA,CAAA,UAAA,GAAA,UAAA","sourcesContent":["import * as React from 'react';\nimport { useConst } from './useConst';\n\n/** Updater callbacks returned by `useBoolean`. */\nexport type UseBooleanCallbacks = {\n  /** Set the value to true. Always has the same identity. */\n  setTrue: () => void;\n  /** Set the value to false. Always has the same identity. */\n  setFalse: () => void;\n  /** Toggle the value. Always has the same identity. */\n  toggle: () => void;\n};\n\n/**\n * Hook to store a value and generate callbacks for setting the value to true or false.\n * The identity of the callbacks will always stay the same.\n *\n * @param initialState - Initial value\n * @returns Array with the current value and an object containing the updater callbacks.\n */\nexport function useBoolean(initialState: boolean): [boolean, UseBooleanCallbacks] {\n  const [value, setValue] = React.useState(initialState);\n\n  const setTrue = useConst(() => () => {\n    setValue(true);\n  });\n  const setFalse = useConst(() => () => {\n    setValue(false);\n  });\n  const toggle = useConst(() => () => {\n    setValue(currentValue => !currentValue);\n  });\n\n  return [value, { setTrue, setFalse, toggle }];\n}\n"],"sourceRoot":"../src/"}

package/lib-commonjs/hooks/useConst.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useConst = void 0;
 
-var React = /*#__PURE__*/require("react");
+const React = /*#__PURE__*/require("react");
 /**
  * Hook to initialize and return a constant value. Unlike `React.useMemo`, this is guaranteed to
  * always return the same value (and if the initializer is a function, only call it once).
@@ -23,7 +23,7 @@ function useConst(initialValue) {
   // Use useRef to store the value because it's the least expensive built-in hook that works here
   // (we could also use `const [value] = React.useState(initialValue)` but that's more expensive
   // internally due to reducer handling which we don't need)
-  var ref = React.useRef();
+  const ref = React.useRef();
 
   if (ref.current === undefined) {
     // Box the value in an object so we can tell if it's initialized even if the initializer

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useConst.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;;;;;;;;;AAUG;;;AACH,SAAgB,QAAhB,CAA4B,YAA5B,EAAuD;AACrD;AACA;AACA;AACA,MAAM,GAAG,GAAG,KAAK,CAAC,MAAN,EAAZ;;AACA,MAAI,GAAG,CAAC,OAAJ,KAAgB,SAApB,EAA+B;AAC7B;AACA;AACA,IAAA,GAAG,CAAC,OAAJ,GAAc;AACZ,MAAA,KAAK,EAAE,OAAO,YAAP,KAAwB,UAAxB,GAAsC,YAAyB,EAA/D,GAAoE;AAD/D,KAAd;AAGD;;AACD,SAAO,GAAG,CAAC,OAAJ,CAAY,KAAnB;AACD;;AAbD,OAAA,CAAA,QAAA,GAAA,QAAA","sourceRoot":""}
+{"version":3,"sources":["hooks/useConst.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;;;;;;;;;AAUG;;;AACH,SAAgB,QAAhB,CAA4B,YAA5B,EAAuD;AACrD;AACA;AACA;AACA,QAAM,GAAG,GAAG,KAAK,CAAC,MAAN,EAAZ;;AACA,MAAI,GAAG,CAAC,OAAJ,KAAgB,SAApB,EAA+B;AAC7B;AACA;AACA,IAAA,GAAG,CAAC,OAAJ,GAAc;AACZ,MAAA,KAAK,EAAE,OAAO,YAAP,KAAwB,UAAxB,GAAsC,YAAyB,EAA/D,GAAoE;AAD/D,KAAd;AAGD;;AACD,SAAO,GAAG,CAAC,OAAJ,CAAY,KAAnB;AACD;;AAbD,OAAA,CAAA,QAAA,GAAA,QAAA","sourcesContent":["import * as React from 'react';\n\n/**\n * Hook to initialize and return a constant value. Unlike `React.useMemo`, this is guaranteed to\n * always return the same value (and if the initializer is a function, only call it once).\n * This is similar to setting a private member in a class constructor.\n *\n * If the value should ever change based on dependencies, use `React.useMemo` instead.\n *\n * @param initialValue - Initial value, or function to get the initial value. Similar to `useState`,\n * only the value/function passed in the first time this is called is respected.\n * @returns The value. The identity of this value will always be the same.\n */\nexport function useConst<T>(initialValue: T | (() => T)): T {\n  // Use useRef to store the value because it's the least expensive built-in hook that works here\n  // (we could also use `const [value] = React.useState(initialValue)` but that's more expensive\n  // internally due to reducer handling which we don't need)\n  const ref = React.useRef<{ value: T }>();\n  if (ref.current === undefined) {\n    // Box the value in an object so we can tell if it's initialized even if the initializer\n    // returns/is undefined\n    ref.current = {\n      value: typeof initialValue === 'function' ? (initialValue as Function)() : initialValue,\n    };\n  }\n  return ref.current.value;\n}\n"],"sourceRoot":"../src/"}

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

@@ -1,21 +1,31 @@
 import * as React from 'react';
 export declare type UseControllableStateOptions<State> = {
     /**
-     * User provided default state or factory initializer
+     * User-provided default state or initializer, for uncontrolled usage.
      */
     defaultState?: State | (() => State);
     /**
-     * User provided controllable state, undefined state means internal state will be used
+     * User-provided controlled state. `undefined` means internal state will be used.
      */
     state: State | undefined;
     /**
-     * Used to initialize state if all user provided states are undefined
+     * Used as the initial state if `state` and `defaultState` are both `undefined`.
+     * If `undefined` is the correct initial state, pass that here.
      */
     initialState: State;
 };
 /**
- * A useState 'like' hook that allows optional user control
- * Useful for components which allow uncontrolled and controlled behaviour for users
- * @returns - https://reactjs.org/docs/hooks-state.html
+ * A `useState`-like hook to manage a value that could be either controlled or uncontrolled,
+ * such as a checked state or text input string.
+ *
+ * Unlike `setState`, it's okay to call the returned updater (dispatch) function for either a
+ * controlled or uncontrolled component. Calls will only be respected if the component is uncontrolled.
+ *
+ * @returns Same as [`useState`](https://reactjs.org/docs/hooks-reference.html#usestate): an array
+ * of the current value and an updater (dispatch) function. The updater function is referentially
+ * stable (won't change during the component's lifecycle). It can take either a new value, or a
+ * function which is passed the previous value and returns the new value. Unlike `setState`, calls
+ * to the updater function will only be respected if the component is uncontrolled.
+ * @see https://reactjs.org/docs/uncontrolled-components.html
  */
 export declare const useControllableState: <State>(options: UseControllableStateOptions<State>) => [State, React.Dispatch<React.SetStateAction<State>>];

package/lib-commonjs/hooks/useControllableState.js

@@ -5,40 +5,41 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useControllableState = void 0;
 
-var React = /*#__PURE__*/require("react");
+const React = /*#__PURE__*/require("react");
 
-var useConst_1 = /*#__PURE__*/require("./useConst");
-
-function isUndefined(state) {
-  return typeof state === 'undefined';
-}
+const useConst_1 = /*#__PURE__*/require("./useConst");
 
 function isFactoryDispatch(newState) {
   return typeof newState === 'function';
 }
 /**
- * A useState 'like' hook that allows optional user control
- * Useful for components which allow uncontrolled and controlled behaviour for users
- * @returns - https://reactjs.org/docs/hooks-state.html
+ * A `useState`-like hook to manage a value that could be either controlled or uncontrolled,
+ * such as a checked state or text input string.
+ *
+ * Unlike `setState`, it's okay to call the returned updater (dispatch) function for either a
+ * controlled or uncontrolled component. Calls will only be respected if the component is uncontrolled.
+ *
+ * @returns Same as [`useState`](https://reactjs.org/docs/hooks-reference.html#usestate): an array
+ * of the current value and an updater (dispatch) function. The updater function is referentially
+ * stable (won't change during the component's lifecycle). It can take either a new value, or a
+ * function which is passed the previous value and returns the new value. Unlike `setState`, calls
+ * to the updater function will only be respected if the component is uncontrolled.
+ * @see https://reactjs.org/docs/uncontrolled-components.html
  */
 
 
-var useControllableState = function (options) {
-  var isControlled = useIsControlled(options.state);
-  var initialState = isUndefined(options.defaultState) ? options.initialState : options.defaultState;
-
-  var _a = React.useState(initialState),
-      internalState = _a[0],
-      setInternalState = _a[1];
-
-  var state = isControlled ? options.state : internalState;
-  var stateRef = React.useRef(state);
-  React.useEffect(function () {
+const useControllableState = options => {
+  const isControlled = useIsControlled(options.state);
+  const initialState = typeof options.defaultState === 'undefined' ? options.initialState : options.defaultState;
+  const [internalState, setInternalState] = React.useState(initialState);
+  const state = isControlled ? options.state : internalState;
+  const stateRef = React.useRef(state);
+  React.useEffect(() => {
     stateRef.current = state;
   }, [state]); // To match the behavior of the setter returned by React.useState, this callback's identity
   // should never change. This means it MUST NOT directly reference variables that can change.
 
-  var setState = React.useCallback(function (newState) {
+  const setState = React.useCallback(newState => {
     // React dispatch can use a factory
     // https://reactjs.org/docs/hooks-reference.html#functional-updates
     if (isFactoryDispatch(newState)) {
@@ -59,17 +60,17 @@ exports.useControllableState = useControllableState;
  * @returns - whether the value is controlled
  */
 
-var useIsControlled = function (controlledValue) {
-  var isControlled = useConst_1.useConst(controlledValue !== undefined);
+const useIsControlled = controlledValue => {
+  const isControlled = useConst_1.useConst(controlledValue !== undefined);
 
   if (process.env.NODE_ENV !== 'production') {
     // We don't want these warnings in production even though it is against native behaviour
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    React.useEffect(function () {
+    React.useEffect(() => {
       if (isControlled !== (controlledValue !== undefined)) {
-        var error = new Error();
-        var controlWarning = isControlled ? 'a controlled value to be uncontrolled' : 'an uncontrolled value to be controlled';
-        var undefinedWarning = isControlled ? 'defined to an undefined' : 'undefined to a defined'; // eslint-disable-next-line no-console
+        const error = new Error();
+        const controlWarning = isControlled ? 'a controlled value to be uncontrolled' : 'an uncontrolled value to be controlled';
+        const undefinedWarning = isControlled ? 'defined to an undefined' : 'undefined to a defined'; // eslint-disable-next-line no-console
 
         console.error([// Default react error
         'A component is changing ' + controlWarning + '. This is likely caused by the value', 'changing from ' + undefinedWarning + ' value, which should not happen.', 'Decide between using a controlled or uncontrolled input element for the lifetime of the component.', 'More info: https://reactjs.org/link/controlled-components', error.stack].join(' '));