@fluentui/react-utilities 9.0.0-alpha.9 → 9.0.0-beta.4

package/lib-commonjs/compose/getSlots.js

@@ -1,13 +1,20 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var index_1 = require("../utils/index");
-var nullRender_1 = require("./nullRender");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSlots = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const nullRender_1 = /*#__PURE__*/require("./nullRender");
+
+const omit_1 = /*#__PURE__*/require("../utils/omit");
 /**
  * Given the state and an array of slot names, will break out `slots` and `slotProps`
  * collections.
  *
- * The root is always derived from the `as` prop.
+ * The root is derived from a mix of `components` props and `as` prop.
  *
  * Slots will render as null if they are rendered as primitives with undefined children.
  *
@@ -19,34 +26,49 @@ var nullRender_1 = require("./nullRender");
  * @param slotNames - Name of which props are slots
  * @returns An object containing the `slots` map and `slotProps` map.
  */
-exports.getSlots = function (state, slotNames) {
-    var slots = {
-        root: state.as || 'div',
-    };
-    var slotProps = {
-        root: typeof slots.root === 'string' ? index_1.getNativeElementProps(slots.root, state) : index_1.omit(state, ['as']),
-    };
-    if (slotNames) {
-        for (var _i = 0, slotNames_1 = slotNames; _i < slotNames_1.length; _i++) {
-            var name_1 = slotNames_1[_i];
-            var slotDefinition = state[name_1] || {};
-            var _a = slotDefinition.as, slotAs = _a === void 0 ? 'span' : _a, children = slotDefinition.children;
-            var isSlotPrimitive = typeof slotAs === 'string';
-            var isSlotEmpty = isSlotPrimitive && slotDefinition.children === undefined;
-            slots[name_1] = isSlotEmpty ? nullRender_1.nullRender : slotAs;
-            if (typeof children === 'function') {
-                slotProps[name_1] = {
-                    children: children(slots[name_1], index_1.omit(slotDefinition, ['as', 'children'])),
-                };
-                slots[name_1] = React.Fragment;
-            }
-            else if (slots[name_1] !== nullRender_1.nullRender) {
-                slotProps[name_1] = isSlotPrimitive
-                    ? index_1.getNativeElementProps(slotAs, slotDefinition)
-                    : index_1.omit(slotDefinition, ['as']);
-            }
-        }
-    }
-    return { slots: slots, slotProps: slotProps };
-};
+
+
+function getSlots(state, slotNames = ['root']) {
+  const slots = {};
+  const slotProps = {};
+
+  for (const slotName of slotNames) {
+    const [slot, props] = getSlot(state, slotName);
+    slots[slotName] = slot;
+    slotProps[slotName] = props;
+  }
+
+  return {
+    slots,
+    slotProps: slotProps
+  };
+}
+
+exports.getSlots = getSlots;
+
+function getSlot(state, slotName) {
+  var _a, _b, _c;
+
+  if (state[slotName] === undefined) {
+    return [nullRender_1.nullRender, undefined];
+  }
+
+  const {
+    children,
+    as: asProp,
+    ...rest
+  } = state[slotName];
+  const slot = ((_a = state.components) === null || _a === void 0 ? void 0 : _a[slotName]) === undefined || typeof state.components[slotName] === 'string' ? asProp || ((_b = state.components) === null || _b === void 0 ? void 0 : _b[slotName]) || 'div' : state.components[slotName];
+
+  if (typeof children === 'function') {
+    const render = children;
+    return [React.Fragment, {
+      children: render(slot, rest)
+    }];
+  }
+
+  const shouldOmitAsProp = typeof slot === 'string' && ((_c = state[slotName]) === null || _c === void 0 ? void 0 : _c.as);
+  const slotProps = shouldOmitAsProp ? omit_1.omit(state[slotName], ['as']) : state[slotName];
+  return [slot, slotProps];
+}
 //# sourceMappingURL=getSlots.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"getSlots.js","sourceRoot":"../src/","sources":["compose/getSlots.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAE/B,wCAA6D;AAE7D,2CAA0C;AAE1C;;;;;;;;;;;;;;;GAeG;AACU,QAAA,QAAQ,GAAG,UAAC,KAAwB,EAAE,SAAgC;IACjF,IAAM,KAAK,GAAsB;QAC/B,IAAI,EAAE,KAAK,CAAC,EAAE,IAAI,KAAK;KACxB,CAAC;IAEF,IAAM,SAAS,GAAsB;QACnC,IAAI,EAAE,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,6BAAqB,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,YAAI,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC;KACtG,CAAC;IAEF,IAAI,SAAS,EAAE;QACb,KAAmB,UAAS,EAAT,uBAAS,EAAT,uBAAS,EAAT,IAAS,EAAE;YAAzB,IAAM,MAAI,kBAAA;YACb,IAAM,cAAc,GAAG,KAAK,CAAC,MAAI,CAAC,IAAI,EAAE,CAAC;YACjC,IAAA,sBAAmB,EAAnB,oCAAmB,EAAE,kCAAQ,CAAoB;YACzD,IAAM,eAAe,GAAG,OAAO,MAAM,KAAK,QAAQ,CAAC;YACnD,IAAM,WAAW,GAAG,eAAe,IAAI,cAAc,CAAC,QAAQ,KAAK,SAAS,CAAC;YAE7E,KAAK,CAAC,MAAI,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,uBAAU,CAAC,CAAC,CAAC,MAAM,CAAC;YAEhD,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE;gBAClC,SAAS,CAAC,MAAI,CAAC,GAAG;oBAChB,QAAQ,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAI,CAAC,EAAE,YAAI,CAAC,cAAc,EAAE,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC;iBAC1E,CAAC;gBACF,KAAK,CAAC,MAAI,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC;aAC9B;iBAAM,IAAI,KAAK,CAAC,MAAI,CAAC,KAAK,uBAAU,EAAE;gBACrC,SAAS,CAAC,MAAI,CAAC,GAAG,eAAe;oBAC/B,CAAC,CAAC,6BAAqB,CAAC,MAAM,EAAE,cAAc,CAAC;oBAC/C,CAAC,CAAC,YAAI,CAAC,cAAc,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;aAClC;SACF;KACF;IAED,OAAO,EAAE,KAAK,OAAA,EAAE,SAAS,WAAA,EAAE,CAAC;AAC9B,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport { getNativeElementProps, omit } from '../utils/index';\nimport { GenericDictionary } from './types';\nimport { nullRender } from './nullRender';\n\n/**\n * Given the state and an array of slot names, will break out `slots` and `slotProps`\n * collections.\n *\n * The root is always derived from the `as` prop.\n *\n * Slots will render as null if they are rendered as primitives with undefined children.\n *\n * The slotProps will always omit the `as` prop within them, and for slots that are string\n * primitives, the props will be filtered according the the slot type. For example, if the\n * slot is rendered `as: 'a'`, the props will be filtered for acceptable anchor props.\n *\n * @param state - State including slot definitions\n * @param slotNames - Name of which props are slots\n * @returns An object containing the `slots` map and `slotProps` map.\n */\nexport const getSlots = (state: GenericDictionary, slotNames?: string[] | undefined) => {\n  const slots: GenericDictionary = {\n    root: state.as || 'div',\n  };\n\n  const slotProps: GenericDictionary = {\n    root: typeof slots.root === 'string' ? getNativeElementProps(slots.root, state) : omit(state, ['as']),\n  };\n\n  if (slotNames) {\n    for (const name of slotNames) {\n      const slotDefinition = state[name] || {};\n      const { as: slotAs = 'span', children } = slotDefinition;\n      const isSlotPrimitive = typeof slotAs === 'string';\n      const isSlotEmpty = isSlotPrimitive && slotDefinition.children === undefined;\n\n      slots[name] = isSlotEmpty ? nullRender : slotAs;\n\n      if (typeof children === 'function') {\n        slotProps[name] = {\n          children: children(slots[name], omit(slotDefinition, ['as', 'children'])),\n        };\n        slots[name] = React.Fragment;\n      } else if (slots[name] !== nullRender) {\n        slotProps[name] = isSlotPrimitive\n          ? getNativeElementProps(slotAs, slotDefinition)\n          : omit(slotDefinition, ['as']);\n      }\n    }\n  }\n\n  return { slots, slotProps };\n};\n"]}
+{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAUA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,MAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;AAqBA;;;;;;;;;;;;;;;AAeG;;;AACH,SAAgB,QAAhB,CACE,KADF,EAEE,SAAA,GAAyB,CAAC,MAAD,CAF3B,EAEmC;AAKjC,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;;AAEA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAhBD,OAAA,CAAA,QAAA,GAAA,QAAA;;AAkBA,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,YAAA,CAAA,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAA,CAAA,EAAA,GAAI,KAAK,CAAC,UAAV,MAAoB,IAApB,IAAoB,EAAA,KAAA,KAAA,CAApB,GAAoB,KAAA,CAApB,GAAoB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAAwB,CAAA,EAAA,GAAI,KAAK,CAAC,QAAD,CAAT,MAAmB,IAAnB,IAAmB,EAAA,KAAA,KAAA,CAAnB,GAAmB,KAAA,CAAnB,GAAmB,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,MAAA,CAAA,IAAA,CAAK,KAAK,CAAC,QAAD,CAAV,EAAuB,CAAC,IAAD,CAAvB,CAAH,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}

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

@@ -1,5 +1,4 @@
 export * from './getSlots';
-export * from './makeMergeProps';
 export * from './nullRender';
-export * from './resolveShorthandProps';
+export * from './resolveShorthand';
 export * from './types';

package/lib-commonjs/compose/index.js

@@ -1,8 +1,16 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+const tslib_1 = /*#__PURE__*/require("tslib");
+
 tslib_1.__exportStar(require("./getSlots"), exports);
-tslib_1.__exportStar(require("./makeMergeProps"), exports);
+
 tslib_1.__exportStar(require("./nullRender"), exports);
-tslib_1.__exportStar(require("./resolveShorthandProps"), exports);
+
+tslib_1.__exportStar(require("./resolveShorthand"), exports);
+
+tslib_1.__exportStar(require("./types"), exports);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["compose/index.ts"],"names":[],"mappings":";;;AAAA,qDAA2B;AAC3B,2DAAiC;AACjC,uDAA6B;AAC7B,kEAAwC","sourcesContent":["export * from './getSlots';\nexport * from './makeMergeProps';\nexport * from './nullRender';\nexport * from './resolveShorthandProps';\nexport * from './types';\n"]}
+{"version":3,"sources":["../../src/compose/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA","sourceRoot":""}

package/lib-commonjs/compose/nullRender.js

@@ -1,7 +1,14 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.nullRender = void 0;
 /**
  * Simple constant function for returning null, used to render empty templates in JSX.
  */
-exports.nullRender = function () { return null; };
+
+const nullRender = () => null;
+
+exports.nullRender = nullRender;
 //# sourceMappingURL=nullRender.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"nullRender.js","sourceRoot":"../src/","sources":["compose/nullRender.tsx"],"names":[],"mappings":";;AAAA;;GAEG;AACU,QAAA,UAAU,GAAG,cAAM,OAAA,IAAI,EAAJ,CAAI,CAAC","sourcesContent":["/**\n * Simple constant function for returning null, used to render empty templates in JSX.\n */\nexport const nullRender = () => null;\n"]}
+{"version":3,"sources":["../../src/compose/nullRender.tsx"],"names":[],"mappings":";;;;;;AAAA;;AAEG;;AACI,MAAM,UAAU,GAAG,MAAM,IAAzB;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourceRoot":""}

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

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

package/lib-commonjs/compose/resolveShorthand.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resolveShorthand = void 0;
+
+const react_1 = /*#__PURE__*/require("react");
+/**
+ * Resolves ShorthandProps into ObjectShorthandProps, to ensure normalization of the signature
+ * being passed down to getSlots method
+ * @param value - the base ShorthandProps
+ * @param options - options to resolve ShorthandProps
+ */
+
+
+function resolveShorthand(value, options) {
+  const {
+    required = false,
+    defaultProps
+  } = options || {};
+
+  if (value === null || value === undefined && !required) {
+    return undefined;
+  }
+
+  let resolvedShorthand = {};
+
+  if (typeof value === 'string' || typeof value === 'number' || Array.isArray(value) || react_1.isValidElement(value)) {
+    resolvedShorthand.children = value;
+  } else if (typeof value === 'object') {
+    resolvedShorthand = value;
+  }
+
+  return defaultProps ? { ...defaultProps,
+    ...resolvedShorthand
+  } : resolvedShorthand;
+}
+
+exports.resolveShorthand = resolveShorthand;
+//# sourceMappingURL=resolveShorthand.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/compose/resolveShorthand.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AASA;;;;;AAKG;;;AACH,SAAgB,gBAAhB,CACE,KADF,EAEE,OAFF,EAEoD;AAElD,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,SAAQ,YAAY,GAAG,EAAE,GAAG,YAAL;AAAmB,OAAG;AAAtB,GAAH,GAA+C,iBAAnE;AAGD;;AApBD,OAAA,CAAA,gBAAA,GAAA,gBAAA","sourceRoot":""}

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

@@ -1,29 +1,103 @@
 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;
 /**
- * Generic name to any dictionary.
+ * Matches any shorthand props type.
+ *
+ * This should ONLY be used in type templates as in `extends DefaultObjectShorthandProps`;
+ * it shouldn't be used as the type of a slot.
  */
-export declare type GenericDictionary = Record<string, any>;
+export declare type DefaultObjectShorthandProps = ObjectShorthandProps<Pick<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {
+    as?: keyof JSX.IntrinsicElements;
+}>;
 /**
- * Class dictionary.
+ * Defines the slot props for a slot that supports a Component type.
+ *
+ * For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
  */
-export declare type ClassDictionary = Record<string, string>;
-export interface ComponentProps {
-    as?: React.ElementType;
-    className?: string;
+export declare type ObjectShorthandProps<Props extends {
     children?: React.ReactNode;
-}
-export declare type ShorthandRenderFunction<TProps> = (Component: React.ElementType<TProps>, props: TProps) => React.ReactNode;
-export declare type ShorthandProps<TProps extends ComponentProps = {}> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | boolean | number | null | undefined | (TProps & ComponentProps & {
-    children?: TProps['children'] | ShorthandRenderFunction<TProps>;
-});
-export declare type ObjectShorthandProps<TProps extends ComponentProps = {}> = TProps & {
-    children?: TProps['children'] | ShorthandRenderFunction<TProps>;
+} = {}> = Props & {
+    children?: Props['children'] | ShorthandRenderFunction<Props>;
 };
-export interface BaseSlots {
-    root: React.ElementType;
-}
-export declare type SlotProps<TSlots extends BaseSlots, TProps, TRootProps extends React.HTMLAttributes<HTMLElement>> = {
-    [key in keyof Omit<TSlots, 'root'>]: key extends keyof TProps ? TProps[key] : any;
-} & {
-    root: TRootProps;
+/**
+ * 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.
+ *
+ * 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.
+ *
+ * ```
+ * 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"
+ * ```
+ */
+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]>>) | {
+    [As in AlternateAs]: {
+        as: As;
+    } & ObjectShorthandProps<React.PropsWithRef<JSX.IntrinsicElements[As]>>;
+}[AlternateAs];
+/**
+ * Evaluates to true if the given type contains exactly one string, or false if it is a union of strings.
+ *
+ * ```
+ * IsSingleton<'a'> // true
+ * IsSingleton<'a' | 'b' | 'c'> // false
+ * ```
+ */
+export declare type IsSingleton<T extends string> = {
+    [K in T]: Exclude<T, K> extends never ? true : false;
+}[T];
+/**
+ * Helper type for inferring the type of the as prop from a Props type.
+ *
+ * For example:
+ * ```
+ * type Example<T> = T extends AsIntrinsicElement<infer As> ? As : never;
+ * ```
+ */
+export declare type AsIntrinsicElement<As extends keyof JSX.IntrinsicElements> = {
+    as?: As;
 };
+/**
+ * Converts a union type (`A | B | C`) to an intersection type (`A & B & C`)
+ */
+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.
+ *
+ * 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 & 'root'> & 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);
+    };
+} & Shorthands;
+/**
+ * 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
+ * for inference) is in the event handlers, so some of the helper types use this event handler
+ * name to infer the original element type.
+ *
+ * Notes:
+ * - Using an extremely obscure event handler reduces the likelihood that its signature will be
+ *   modified in any component's props.
+ * - Inferring based on a single prop name instead of a larger type like `DOMAttributes<T>` should be
+ *   less expensive for typescript to evaluate and is less likely to result in type expansion in .d.ts.
+ */
+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 {};

package/lib-commonjs/compose/types.js

@@ -1,3 +1,10 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+
+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,"file":"types.js","sourceRoot":"../src/","sources":["compose/types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\n\n/**\n * Generic name to any dictionary.\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type GenericDictionary = Record<string, any>;\n\n/**\n * Class dictionary.\n */\nexport type ClassDictionary = Record<string, string>;\n\nexport interface ComponentProps {\n  as?: React.ElementType;\n  className?: string;\n  children?: React.ReactNode;\n}\n\n// Shorthand types\n\nexport type ShorthandRenderFunction<TProps> = (Component: React.ElementType<TProps>, props: TProps) => React.ReactNode;\n\nexport type ShorthandProps<TProps extends ComponentProps = {}> =\n  | React.ReactChild\n  | React.ReactNodeArray\n  | React.ReactPortal\n  | boolean\n  | number\n  | null\n  | undefined\n  | (TProps &\n      ComponentProps & {\n        children?: TProps['children'] | ShorthandRenderFunction<TProps>;\n      });\n\nexport type ObjectShorthandProps<TProps extends ComponentProps = {}> = TProps & {\n  children?: TProps['children'] | ShorthandRenderFunction<TProps>;\n};\n\nexport interface BaseSlots {\n  root: React.ElementType;\n}\n\nexport type SlotProps<TSlots extends BaseSlots, TProps, TRootProps extends React.HTMLAttributes<HTMLElement>> = {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  [key in keyof Omit<TSlots, 'root'>]: key extends keyof TProps ? TProps[key] : any;\n} & {\n  root: TRootProps;\n};\n"]}
+{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":";;;;IAgJA;AACA;AACA;AACA;AACA","sourceRoot":""}

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

@@ -1,8 +1,16 @@
+export * from './useControllableState';
 export * from './useBoolean';
 export * from './useConst';
 export * from './useControllableValue';
 export * from './useEventCallback';
-export { useId } from './useId';
+export * from './useFirstMount';
+export * from './useId';
 export * from './useIsomorphicLayoutEffect';
 export * from './useMergedRefs';
+export * from './useMount';
 export * from './useOnClickOutside';
+export * from './useOnScrollOutside';
+export * from './usePrevious';
+export * from './useTimeout';
+export * from './useUnmount';
+export * from './useForceUpdate';

package/lib-commonjs/hooks/index.js

@@ -1,13 +1,40 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+const tslib_1 = /*#__PURE__*/require("tslib");
+
+tslib_1.__exportStar(require("./useControllableState"), exports);
+
 tslib_1.__exportStar(require("./useBoolean"), exports);
+
 tslib_1.__exportStar(require("./useConst"), exports);
+
 tslib_1.__exportStar(require("./useControllableValue"), exports);
+
 tslib_1.__exportStar(require("./useEventCallback"), exports);
-var useId_1 = require("./useId");
-exports.useId = useId_1.useId;
+
+tslib_1.__exportStar(require("./useFirstMount"), exports);
+
+tslib_1.__exportStar(require("./useId"), exports);
+
 tslib_1.__exportStar(require("./useIsomorphicLayoutEffect"), exports);
+
 tslib_1.__exportStar(require("./useMergedRefs"), exports);
+
+tslib_1.__exportStar(require("./useMount"), exports);
+
 tslib_1.__exportStar(require("./useOnClickOutside"), exports);
+
+tslib_1.__exportStar(require("./useOnScrollOutside"), exports);
+
+tslib_1.__exportStar(require("./usePrevious"), exports);
+
+tslib_1.__exportStar(require("./useTimeout"), exports);
+
+tslib_1.__exportStar(require("./useUnmount"), exports);
+
+tslib_1.__exportStar(require("./useForceUpdate"), exports);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["hooks/index.ts"],"names":[],"mappings":";;;AAAA,uDAA6B;AAC7B,qDAA2B;AAC3B,iEAAuC;AACvC,6DAAmC;AACnC,iCAAgC;AAAvB,wBAAA,KAAK,CAAA;AACd,sEAA4C;AAC5C,0DAAgC;AAChC,8DAAoC","sourcesContent":["export * from './useBoolean';\nexport * from './useConst';\nexport * from './useControllableValue';\nexport * from './useEventCallback';\nexport { useId } from './useId';\nexport * from './useIsomorphicLayoutEffect';\nexport * from './useMergedRefs';\nexport * from './useOnClickOutside';\n"]}
+{"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":""}

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

@@ -1,12 +1,12 @@
 /** Updater callbacks returned by `useBoolean`. */
-export interface UseBooleanCallbacks {
+export declare type UseBooleanCallbacks = {
     /** Set the value to true. Always has the same identity. */
     setTrue: () => void;
     /** Set the value to false. Always has the same identity. */
     setFalse: () => void;
     /** Toggle the value. Always has the same identity. */
     toggle: () => void;
-}
+};
 /**
  * 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.

package/lib-commonjs/hooks/useBoolean.js

@@ -1,7 +1,13 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var useConst_1 = require("./useConst");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useBoolean = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+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.
@@ -9,18 +15,25 @@ var useConst_1 = require("./useConst");
  * @param initialState - Initial value
  * @returns Array with the current value and an object containing the updater callbacks.
  */
+
+
 function useBoolean(initialState) {
-    var _a = React.useState(initialState), value = _a[0], setValue = _a[1];
-    var setTrue = useConst_1.useConst(function () { return function () {
-        setValue(true);
-    }; });
-    var setFalse = useConst_1.useConst(function () { return function () {
-        setValue(false);
-    }; });
-    var toggle = useConst_1.useConst(function () { return function () {
-        setValue(function (currentValue) { return !currentValue; });
-    }; });
-    return [value, { setTrue: setTrue, setFalse: setFalse, toggle: toggle }];
+  const [value, setValue] = React.useState(initialState);
+  const setTrue = useConst_1.useConst(() => () => {
+    setValue(true);
+  });
+  const setFalse = useConst_1.useConst(() => () => {
+    setValue(false);
+  });
+  const toggle = useConst_1.useConst(() => () => {
+    setValue(currentValue => !currentValue);
+  });
+  return [value, {
+    setTrue,
+    setFalse,
+    toggle
+  }];
 }
+
 exports.useBoolean = useBoolean;
 //# sourceMappingURL=useBoolean.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useBoolean.js","sourceRoot":"../src/","sources":["hooks/useBoolean.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAC/B,uCAAsC;AAYtC;;;;;;GAMG;AACH,SAAgB,UAAU,CAAC,YAAqB;IACxC,IAAA,iCAAgD,EAA/C,aAAK,EAAE,gBAAwC,CAAC;IAEvD,IAAM,OAAO,GAAG,mBAAQ,CAAC,cAAM,OAAA;QAC7B,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,EAF8B,CAE9B,CAAC,CAAC;IACH,IAAM,QAAQ,GAAG,mBAAQ,CAAC,cAAM,OAAA;QAC9B,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClB,CAAC,EAF+B,CAE/B,CAAC,CAAC;IACH,IAAM,MAAM,GAAG,mBAAQ,CAAC,cAAM,OAAA;QAC5B,QAAQ,CAAC,UAAA,YAAY,IAAI,OAAA,CAAC,YAAY,EAAb,CAAa,CAAC,CAAC;IAC1C,CAAC,EAF6B,CAE7B,CAAC,CAAC;IAEH,OAAO,CAAC,KAAK,EAAE,EAAE,OAAO,SAAA,EAAE,QAAQ,UAAA,EAAE,MAAM,QAAA,EAAE,CAAC,CAAC;AAChD,CAAC;AAdD,gCAcC","sourcesContent":["import * as React from 'react';\nimport { useConst } from './useConst';\n\n/** Updater callbacks returned by `useBoolean`. */\nexport interface 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"]}
+{"version":3,"sources":["../../src/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","sourceRoot":""}

package/lib-commonjs/hooks/useConst.js

@@ -1,6 +1,11 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useConst = void 0;
+
+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).
@@ -12,19 +17,24 @@ var React = require("react");
  * only the value/function passed in the first time this is called is respected.
  * @returns The value. The identity of this value will always be the same.
  */
+
+
 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();
-    if (ref.current === undefined) {
-        // Box the value in an object so we can tell if it's initialized even if the initializer
-        // returns/is undefined
-        ref.current = {
-            value: typeof initialValue === 'function' ? initialValue() : initialValue,
-        };
-    }
-    return ref.current.value;
+  // 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)
+  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
+    // returns/is undefined
+    ref.current = {
+      value: typeof initialValue === 'function' ? initialValue() : initialValue
+    };
+  }
+
+  return ref.current.value;
 }
+
 exports.useConst = useConst;
 //# sourceMappingURL=useConst.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useConst.js","sourceRoot":"../src/","sources":["hooks/useConst.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAE/B;;;;;;;;;;GAUG;AACH,SAAgB,QAAQ,CAAI,YAA2B;IACrD,+FAA+F;IAC/F,8FAA8F;IAC9F,0DAA0D;IAC1D,IAAM,GAAG,GAAG,KAAK,CAAC,MAAM,EAAgB,CAAC;IACzC,IAAI,GAAG,CAAC,OAAO,KAAK,SAAS,EAAE;QAC7B,wFAAwF;QACxF,uBAAuB;QACvB,GAAG,CAAC,OAAO,GAAG;YACZ,KAAK,EAAE,OAAO,YAAY,KAAK,UAAU,CAAC,CAAC,CAAE,YAAyB,EAAE,CAAC,CAAC,CAAC,YAAY;SACxF,CAAC;KACH;IACD,OAAO,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC;AAC3B,CAAC;AAbD,4BAaC","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"]}
+{"version":3,"sources":["../../src/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","sourceRoot":""}