@fluentui/react-utilities 9.18.23 → 9.19.0

package/CHANGELOG.md

@@ -1,12 +1,21 @@
 # Change Log - @fluentui/react-utilities
 
-This log was last generated on Thu, 27 Mar 2025 21:08:38 GMT and should not be manually modified.
+This log was last generated on Wed, 16 Apr 2025 19:37:15 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.19.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.19.0)
+
+Wed, 16 Apr 2025 19:37:15 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.18.23..@fluentui/react-utilities_v9.19.0)
+
+### Minor changes
+
+- Add getSlotClassNameProp_unstable function to allow custom style hooks to preserve the original className while overriding the component default className. ([PR #34166](https://github.com/microsoft/fluentui/pull/34166) by behowell@microsoft.com)
+
 ## [9.18.23](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.18.23)
 
-Thu, 27 Mar 2025 21:08:38 GMT 
+Thu, 27 Mar 2025 21:12:51 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.18.22..@fluentui/react-utilities_v9.18.23)
 
 ### Patches

package/dist/index.d.ts

@@ -244,6 +244,23 @@ export declare const getPartitionedNativeProps: <Props extends Pick<React_2.HTML
  */
 export declare const getRTLSafeKey: (key: string, dir: 'ltr' | 'rtl') => string;
 
+/**
+ * Get the className prop set on the slot by the user, without including the default classes added by the component.
+ * Custom style hooks should merge this className _after_ any additional classes added by the hook, to ensure that
+ * classes added by the user take precedence over the custom style hook.
+ *
+ * Example usage in a custom style hook:
+ * ```ts
+ * state.root.className = mergeClasses(
+ *   state.root.className,
+ *   customStyles.root,
+ *   getSlotClassNameProp_unstable(state.root));
+ * ```
+ *
+ * @returns The className prop set on the slot by the user, or undefined if not set.
+ */
+export declare const getSlotClassNameProp_unstable: (slot: UnknownSlotProps) => string | undefined;
+
 /**
  * Given the state and an array of slot names, will break out `slots` and `slotProps`
  * collections.
@@ -684,6 +701,12 @@ declare namespace slot {
 }
 export { slot }
 
+/**
+ * @internal
+ * Internal cache of the original className prop for the slot, before being modified by the useStyles hook.
+ */
+export declare const SLOT_CLASS_NAME_PROP_SYMBOL: unique symbol;
+
 /**
  * @internal
  * Internal reference for the render function
@@ -724,6 +747,11 @@ export declare type SlotComponentType<Props> = Props & {
      * @internal
      */
     [SLOT_ELEMENT_TYPE_SYMBOL]: React_2.ComponentType<Props> | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
+    /**
+     * @internal
+     * The original className prop for the slot, before being modified by the useStyles hook.
+     */
+    [SLOT_CLASS_NAME_PROP_SYMBOL]?: string;
 };
 
 export declare type SlotOptions<Props extends UnknownSlotProps> = {

package/lib/compose/constants.js

@@ -6,3 +6,7 @@
  * @internal
  * Internal reference for the render function
  */ export const SLOT_ELEMENT_TYPE_SYMBOL = Symbol.for('fui.slotElementType');
+/**
+ * @internal
+ * Internal cache of the original className prop for the slot, before being modified by the useStyles hook.
+ */ export const SLOT_CLASS_NAME_PROP_SYMBOL = Symbol.for('fui.slotClassNameProp');

package/lib/compose/constants.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/constants.ts"],"sourcesContent":["/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_RENDER_FUNCTION_SYMBOL = Symbol.for('fui.slotRenderFunction');\n/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_ELEMENT_TYPE_SYMBOL = Symbol.for('fui.slotElementType');\n"],"names":["SLOT_RENDER_FUNCTION_SYMBOL","Symbol","for","SLOT_ELEMENT_TYPE_SYMBOL"],"rangeMappings":";;;;;;;","mappings":"AAAA;;;CAGC,GACD,OAAO,MAAMA,8BAA8BC,OAAOC,GAAG,CAAC,0BAA0B;AAChF;;;CAGC,GACD,OAAO,MAAMC,2BAA2BF,OAAOC,GAAG,CAAC,uBAAuB"}
+{"version":3,"sources":["../src/compose/constants.ts"],"sourcesContent":["/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_RENDER_FUNCTION_SYMBOL = Symbol.for('fui.slotRenderFunction');\n/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_ELEMENT_TYPE_SYMBOL = Symbol.for('fui.slotElementType');\n/**\n * @internal\n * Internal cache of the original className prop for the slot, before being modified by the useStyles hook.\n */\nexport const SLOT_CLASS_NAME_PROP_SYMBOL = Symbol.for('fui.slotClassNameProp');\n"],"names":["SLOT_RENDER_FUNCTION_SYMBOL","Symbol","for","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_CLASS_NAME_PROP_SYMBOL"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA;;;CAGC,GACD,OAAO,MAAMA,8BAA8BC,OAAOC,GAAG,CAAC,0BAA0B;AAChF;;;CAGC,GACD,OAAO,MAAMC,2BAA2BF,OAAOC,GAAG,CAAC,uBAAuB;AAC1E;;;CAGC,GACD,OAAO,MAAME,8BAA8BH,OAAOC,GAAG,CAAC,yBAAyB"}

package/lib/compose/getSlotClassNameProp.js

@@ -0,0 +1,21 @@
+import { SLOT_CLASS_NAME_PROP_SYMBOL } from '../compose/constants';
+/**
+ * Get the className prop set on the slot by the user, without including the default classes added by the component.
+ * Custom style hooks should merge this className _after_ any additional classes added by the hook, to ensure that
+ * classes added by the user take precedence over the custom style hook.
+ *
+ * Example usage in a custom style hook:
+ * ```ts
+ * state.root.className = mergeClasses(
+ *   state.root.className,
+ *   customStyles.root,
+ *   getSlotClassNameProp_unstable(state.root));
+ * ```
+ *
+ * @returns The className prop set on the slot by the user, or undefined if not set.
+ */ export const getSlotClassNameProp = (slot)=>{
+    if (SLOT_CLASS_NAME_PROP_SYMBOL in slot && typeof slot[SLOT_CLASS_NAME_PROP_SYMBOL] === 'string') {
+        return slot[SLOT_CLASS_NAME_PROP_SYMBOL];
+    }
+    return undefined;
+};

package/lib/compose/getSlotClassNameProp.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/compose/getSlotClassNameProp.ts"],"sourcesContent":["import { SLOT_CLASS_NAME_PROP_SYMBOL } from '../compose/constants';\nimport type { UnknownSlotProps } from '../compose/types';\n\n/**\n * Get the className prop set on the slot by the user, without including the default classes added by the component.\n * Custom style hooks should merge this className _after_ any additional classes added by the hook, to ensure that\n * classes added by the user take precedence over the custom style hook.\n *\n * Example usage in a custom style hook:\n * ```ts\n * state.root.className = mergeClasses(\n *   state.root.className,\n *   customStyles.root,\n *   getSlotClassNameProp_unstable(state.root));\n * ```\n *\n * @returns The className prop set on the slot by the user, or undefined if not set.\n */\nexport const getSlotClassNameProp = (slot: UnknownSlotProps) => {\n  if (SLOT_CLASS_NAME_PROP_SYMBOL in slot && typeof slot[SLOT_CLASS_NAME_PROP_SYMBOL] === 'string') {\n    return slot[SLOT_CLASS_NAME_PROP_SYMBOL];\n  }\n  return undefined;\n};\n"],"names":["SLOT_CLASS_NAME_PROP_SYMBOL","getSlotClassNameProp","slot","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,2BAA2B,QAAQ,uBAAuB;AAGnE;;;;;;;;;;;;;;CAcC,GACD,OAAO,MAAMC,uBAAuB,CAACC;IACnC,IAAIF,+BAA+BE,QAAQ,OAAOA,IAAI,CAACF,4BAA4B,KAAK,UAAU;QAChG,OAAOE,IAAI,CAACF,4BAA4B;IAC1C;IACA,OAAOG;AACT,EAAE"}

package/lib/compose/index.js

@@ -1,9 +1,10 @@
 import * as slot from './slot';
 export { isResolvedShorthand } from './isResolvedShorthand';
-export { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';
+export { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';
 export { isSlot } from './isSlot';
 export { assertSlots } from './assertSlots';
 export { getIntrinsicElementProps } from './getIntrinsicElementProps';
+export { getSlotClassNameProp as getSlotClassNameProp_unstable } from './getSlotClassNameProp';
 // eslint-disable-next-line @typescript-eslint/no-deprecated
 export { getSlots } from './deprecated/getSlots';
 // eslint-disable-next-line @typescript-eslint/no-deprecated

package/lib/compose/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/index.ts"],"sourcesContent":["import * as slot from './slot';\n\nexport type {\n  AsIntrinsicElement,\n  ComponentProps,\n  ComponentState,\n  EventData,\n  EventHandler,\n  ExtractSlotProps,\n  ForwardRefComponent,\n  InferredElementRefType,\n  IsSingleton,\n  PropsWithoutChildren,\n  PropsWithoutRef,\n  Slot,\n  SlotClassNames,\n  SlotComponentType,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nexport { isResolvedShorthand } from './isResolvedShorthand';\nexport { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nexport { isSlot } from './isSlot';\nexport { assertSlots } from './assertSlots';\nexport { getIntrinsicElementProps } from './getIntrinsicElementProps';\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ObjectSlotProps, Slots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ResolveShorthandFunction, ResolveShorthandOptions } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { resolveShorthand } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlotsNext } from './deprecated/getSlotsNext';\n\nexport { slot };\nexport type { SlotOptions } from './slot';\n"],"names":["slot","isResolvedShorthand","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","isSlot","assertSlots","getIntrinsicElementProps","getSlots","resolveShorthand","getSlotsNext"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,YAAYA,UAAU,SAAS;AAsB/B,SAASC,mBAAmB,QAAQ,wBAAwB;AAC5D,SAASC,wBAAwB,EAAEC,2BAA2B,QAAQ,cAAc;AACpF,SAASC,MAAM,QAAQ,WAAW;AAClC,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,SAASC,wBAAwB,QAAQ,6BAA6B;AAItE,4DAA4D;AAC5D,SAASC,QAAQ,QAAQ,wBAAwB;AAGjD,4DAA4D;AAC5D,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,4DAA4D;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAEzD,SAAST,IAAI,GAAG"}
+{"version":3,"sources":["../src/compose/index.ts"],"sourcesContent":["import * as slot from './slot';\n\nexport type {\n  AsIntrinsicElement,\n  ComponentProps,\n  ComponentState,\n  EventData,\n  EventHandler,\n  ExtractSlotProps,\n  ForwardRefComponent,\n  InferredElementRefType,\n  IsSingleton,\n  PropsWithoutChildren,\n  PropsWithoutRef,\n  Slot,\n  SlotClassNames,\n  SlotComponentType,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nexport { isResolvedShorthand } from './isResolvedShorthand';\nexport { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nexport { isSlot } from './isSlot';\nexport { assertSlots } from './assertSlots';\nexport { getIntrinsicElementProps } from './getIntrinsicElementProps';\nexport { getSlotClassNameProp as getSlotClassNameProp_unstable } from './getSlotClassNameProp';\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ObjectSlotProps, Slots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ResolveShorthandFunction, ResolveShorthandOptions } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { resolveShorthand } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlotsNext } from './deprecated/getSlotsNext';\n\nexport { slot };\nexport type { SlotOptions } from './slot';\n"],"names":["slot","isResolvedShorthand","SLOT_CLASS_NAME_PROP_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","isSlot","assertSlots","getIntrinsicElementProps","getSlotClassNameProp","getSlotClassNameProp_unstable","getSlots","resolveShorthand","getSlotsNext"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,UAAU,SAAS;AAsB/B,SAASC,mBAAmB,QAAQ,wBAAwB;AAC5D,SAASC,2BAA2B,EAAEC,wBAAwB,EAAEC,2BAA2B,QAAQ,cAAc;AACjH,SAASC,MAAM,QAAQ,WAAW;AAClC,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,SAASC,wBAAwB,QAAQ,6BAA6B;AACtE,SAASC,wBAAwBC,6BAA6B,QAAQ,yBAAyB;AAI/F,4DAA4D;AAC5D,SAASC,QAAQ,QAAQ,wBAAwB;AAGjD,4DAA4D;AAC5D,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,4DAA4D;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAEzD,SAASZ,IAAI,GAAG"}

package/lib/compose/slot.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';
+import { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';
 /**
  * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)
  * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties
@@ -18,7 +18,8 @@ import { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constan
    */ const propsWithMetadata = {
         ...defaultProps,
         ...props,
-        [SLOT_ELEMENT_TYPE_SYMBOL]: elementType
+        [SLOT_ELEMENT_TYPE_SYMBOL]: elementType,
+        [SLOT_CLASS_NAME_PROP_SYMBOL]: props === null || props === void 0 ? void 0 : props.className
     };
     if (props && typeof props.children === 'function') {
         propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = props.children;

package/lib/compose/slot.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/slot.ts"],"sourcesContent":["import type {\n  AsIntrinsicElement,\n  SlotComponentType,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nimport * as React from 'react';\nimport { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\n\nexport type SlotOptions<Props extends UnknownSlotProps> = {\n  elementType:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  defaultProps?: Partial<Props>;\n};\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided.\n */\nexport function always<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined,\n  options: SlotOptions<Props>,\n): SlotComponentType<Props> {\n  const { defaultProps, elementType } = options;\n\n  const props = resolveShorthand(value);\n\n  /**\n   * Casting is required here as SlotComponentType is a function, not an object.\n   * Although SlotComponentType has a function signature, it is still just an object.\n   * This is required to make a slot callable (JSX compatible), this is the exact same approach\n   * that is used on `@types/react` components\n   */\n  const propsWithMetadata = {\n    ...defaultProps,\n    ...props,\n    [SLOT_ELEMENT_TYPE_SYMBOL]: elementType,\n  } as SlotComponentType<Props>;\n\n  if (props && typeof props.children === 'function') {\n    propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = props.children as SlotRenderFunction<Props>;\n    propsWithMetadata.children = defaultProps?.children;\n  }\n\n  return propsWithMetadata;\n}\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided\n * * `renderByDefault` - a boolean that indicates if a slot will be rendered even if it's base value is `undefined`.\n * By default if `props.SLOT_NAME` is `undefined` then `state.SLOT_NAME` becomes `undefined`\n * and nothing will be rendered, but if `renderByDefault = true` then `state.SLOT_NAME` becomes an object\n * with the values provided by `options.defaultProps` (or `{}`). This is useful for cases such as providing a default content\n * in case no shorthand is provided, like the case of the `expandIcon` slot for the `AccordionHeader`\n */\nexport function optional<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined | null,\n  options: { renderByDefault?: boolean } & SlotOptions<Props>,\n): SlotComponentType<Props> | undefined {\n  if (value === null || (value === undefined && !options.renderByDefault)) {\n    return undefined;\n  }\n  return always(value, options);\n}\n\n/**\n * Helper function that converts a slot shorthand or properties to a slot properties object\n * The main difference between this function and `slot` is that this function does not return the metadata required for a slot to be considered a properly renderable slot, it only converts the value to a slot properties object\n * @param value - the value of the slot, it can be a slot shorthand or a slot properties object\n */\nexport function resolveShorthand<Props extends UnknownSlotProps | null | undefined>(\n  value: Props | SlotShorthandValue,\n): Props {\n  if (\n    typeof value === 'string' ||\n    typeof value === 'number' ||\n    Array.isArray(value) ||\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    React.isValidElement<any>(value)\n  ) {\n    return { children: value } as Props;\n  }\n  if (value && typeof value !== 'object' && process.env.NODE_ENV !== 'production') {\n    // TODO: would be nice to have a link to slot documentation in this error message\n    // eslint-disable-next-line no-console\n    console.error(/** #__DE-INDENT__ */ `\n      @fluentui/react-utilities [slot.${resolveShorthand.name}]:\n      A slot got an invalid value \"${value}\" (${typeof value}).\n      A valid value for a slot is a slot shorthand or slot properties object.\n      Slot shorthands can be strings, numbers, arrays or JSX elements\n    `);\n  }\n\n  return value;\n}\n"],"names":["React","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","always","value","options","defaultProps","elementType","props","resolveShorthand","propsWithMetadata","children","optional","undefined","renderByDefault","Array","isArray","isValidElement","process","env","NODE_ENV","console","error","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAOA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,2BAA2B,QAAQ,cAAc;AASpF;;;;;;;CAOC,GACD,OAAO,SAASC,OACdC,KAA6C,EAC7CC,OAA2B;IAE3B,MAAM,EAAEC,YAAY,EAAEC,WAAW,EAAE,GAAGF;IAEtC,MAAMG,QAAQC,iBAAiBL;IAE/B;;;;;GAKC,GACD,MAAMM,oBAAoB;QACxB,GAAGJ,YAAY;QACf,GAAGE,KAAK;QACR,CAACP,yBAAyB,EAAEM;IAC9B;IAEA,IAAIC,SAAS,OAAOA,MAAMG,QAAQ,KAAK,YAAY;QACjDD,iBAAiB,CAACR,4BAA4B,GAAGM,MAAMG,QAAQ;QAC/DD,kBAAkBC,QAAQ,GAAGL,yBAAAA,mCAAAA,aAAcK,QAAQ;IACrD;IAEA,OAAOD;AACT;AAEA;;;;;;;;;;;;CAYC,GACD,OAAO,SAASE,SACdR,KAAoD,EACpDC,OAA2D;IAE3D,IAAID,UAAU,QAASA,UAAUS,aAAa,CAACR,QAAQS,eAAe,EAAG;QACvE,OAAOD;IACT;IACA,OAAOV,OAAOC,OAAOC;AACvB;AAEA;;;;CAIC,GACD,OAAO,SAASI,iBACdL,KAAiC;IAEjC,IACE,OAAOA,UAAU,YACjB,OAAOA,UAAU,YACjBW,MAAMC,OAAO,CAACZ,UACd,8DAA8D;IAC9DJ,MAAMiB,cAAc,CAAMb,QAC1B;QACA,OAAO;YAAEO,UAAUP;QAAM;IAC3B;IACA,IAAIA,SAAS,OAAOA,UAAU,YAAYc,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QAC/E,iFAAiF;QACjF,sCAAsC;QACtCC,QAAQC,KAAK,CAAuB,CAAC,gCACH,EAAEb,iBAAiBc,IAAI,CAAC;6BAC3B,EAAEnB,MAAM,GAAG,EAAE,OAAOA,MAAM;;+DAGzD,CAAC;IACH;IAEA,OAAOA;AACT"}
+{"version":3,"sources":["../src/compose/slot.ts"],"sourcesContent":["import type {\n  AsIntrinsicElement,\n  SlotComponentType,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nimport * as React from 'react';\nimport { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\n\nexport type SlotOptions<Props extends UnknownSlotProps> = {\n  elementType:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  defaultProps?: Partial<Props>;\n};\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided.\n */\nexport function always<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined,\n  options: SlotOptions<Props>,\n): SlotComponentType<Props> {\n  const { defaultProps, elementType } = options;\n\n  const props = resolveShorthand(value);\n\n  /**\n   * Casting is required here as SlotComponentType is a function, not an object.\n   * Although SlotComponentType has a function signature, it is still just an object.\n   * This is required to make a slot callable (JSX compatible), this is the exact same approach\n   * that is used on `@types/react` components\n   */\n  const propsWithMetadata = {\n    ...defaultProps,\n    ...props,\n    [SLOT_ELEMENT_TYPE_SYMBOL]: elementType,\n    [SLOT_CLASS_NAME_PROP_SYMBOL]: props?.className,\n  } as SlotComponentType<Props>;\n\n  if (props && typeof props.children === 'function') {\n    propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = props.children as SlotRenderFunction<Props>;\n    propsWithMetadata.children = defaultProps?.children;\n  }\n\n  return propsWithMetadata;\n}\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided\n * * `renderByDefault` - a boolean that indicates if a slot will be rendered even if it's base value is `undefined`.\n * By default if `props.SLOT_NAME` is `undefined` then `state.SLOT_NAME` becomes `undefined`\n * and nothing will be rendered, but if `renderByDefault = true` then `state.SLOT_NAME` becomes an object\n * with the values provided by `options.defaultProps` (or `{}`). This is useful for cases such as providing a default content\n * in case no shorthand is provided, like the case of the `expandIcon` slot for the `AccordionHeader`\n */\nexport function optional<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined | null,\n  options: { renderByDefault?: boolean } & SlotOptions<Props>,\n): SlotComponentType<Props> | undefined {\n  if (value === null || (value === undefined && !options.renderByDefault)) {\n    return undefined;\n  }\n  return always(value, options);\n}\n\n/**\n * Helper function that converts a slot shorthand or properties to a slot properties object\n * The main difference between this function and `slot` is that this function does not return the metadata required for a slot to be considered a properly renderable slot, it only converts the value to a slot properties object\n * @param value - the value of the slot, it can be a slot shorthand or a slot properties object\n */\nexport function resolveShorthand<Props extends UnknownSlotProps | null | undefined>(\n  value: Props | SlotShorthandValue,\n): Props {\n  if (\n    typeof value === 'string' ||\n    typeof value === 'number' ||\n    Array.isArray(value) ||\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    React.isValidElement<any>(value)\n  ) {\n    return { children: value } as Props;\n  }\n  if (value && typeof value !== 'object' && process.env.NODE_ENV !== 'production') {\n    // TODO: would be nice to have a link to slot documentation in this error message\n    // eslint-disable-next-line no-console\n    console.error(/** #__DE-INDENT__ */ `\n      @fluentui/react-utilities [slot.${resolveShorthand.name}]:\n      A slot got an invalid value \"${value}\" (${typeof value}).\n      A valid value for a slot is a slot shorthand or slot properties object.\n      Slot shorthands can be strings, numbers, arrays or JSX elements\n    `);\n  }\n\n  return value;\n}\n"],"names":["React","SLOT_CLASS_NAME_PROP_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","always","value","options","defaultProps","elementType","props","resolveShorthand","propsWithMetadata","className","children","optional","undefined","renderByDefault","Array","isArray","isValidElement","process","env","NODE_ENV","console","error","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAOA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,2BAA2B,EAAEC,wBAAwB,EAAEC,2BAA2B,QAAQ,cAAc;AASjH;;;;;;;CAOC,GACD,OAAO,SAASC,OACdC,KAA6C,EAC7CC,OAA2B;IAE3B,MAAM,EAAEC,YAAY,EAAEC,WAAW,EAAE,GAAGF;IAEtC,MAAMG,QAAQC,iBAAiBL;IAE/B;;;;;GAKC,GACD,MAAMM,oBAAoB;QACxB,GAAGJ,YAAY;QACf,GAAGE,KAAK;QACR,CAACP,yBAAyB,EAAEM;QAC5B,CAACP,4BAA4B,EAAEQ,kBAAAA,4BAAAA,MAAOG,SAAS;IACjD;IAEA,IAAIH,SAAS,OAAOA,MAAMI,QAAQ,KAAK,YAAY;QACjDF,iBAAiB,CAACR,4BAA4B,GAAGM,MAAMI,QAAQ;QAC/DF,kBAAkBE,QAAQ,GAAGN,yBAAAA,mCAAAA,aAAcM,QAAQ;IACrD;IAEA,OAAOF;AACT;AAEA;;;;;;;;;;;;CAYC,GACD,OAAO,SAASG,SACdT,KAAoD,EACpDC,OAA2D;IAE3D,IAAID,UAAU,QAASA,UAAUU,aAAa,CAACT,QAAQU,eAAe,EAAG;QACvE,OAAOD;IACT;IACA,OAAOX,OAAOC,OAAOC;AACvB;AAEA;;;;CAIC,GACD,OAAO,SAASI,iBACdL,KAAiC;IAEjC,IACE,OAAOA,UAAU,YACjB,OAAOA,UAAU,YACjBY,MAAMC,OAAO,CAACb,UACd,8DAA8D;IAC9DL,MAAMmB,cAAc,CAAMd,QAC1B;QACA,OAAO;YAAEQ,UAAUR;QAAM;IAC3B;IACA,IAAIA,SAAS,OAAOA,UAAU,YAAYe,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QAC/E,iFAAiF;QACjF,sCAAsC;QACtCC,QAAQC,KAAK,CAAuB,CAAC,gCACH,EAAEd,iBAAiBe,IAAI,CAAC;6BAC3B,EAAEpB,MAAM,GAAG,EAAE,OAAOA,MAAM;;+DAGzD,CAAC;IACH;IAEA,OAAOA;AACT"}

package/lib/compose/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nimport { DistributiveOmit, ReplaceNullWithUndefined } from '../utils/types';\n\nexport type SlotRenderFunction<Props> = (\n  Component: React.ElementType<Props>,\n  props: Omit<Props, '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.ReactNode[] | 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> =\n  | Props\n  | ('children' extends keyof Props ? Extract<SlotShorthandValue, Props['children']> : never);\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> = Props & {\n  children?: ('children' extends keyof Props ? Props['children'] : never) | 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 EmptyIntrinsicElements =\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 IntrinsicElementProps<Type extends keyof JSX.IntrinsicElements> = Type extends EmptyIntrinsicElements\n  ? PropsWithoutChildren<React.PropsWithRef<JSX.IntrinsicElements[Type]>>\n  : React.PropsWithRef<JSX.IntrinsicElements[Type]>;\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 | React.VoidFunctionComponent | 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<IntrinsicElementProps<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<IntrinsicElementProps<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 * 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 ? DistributiveOmit<P, 'ref'> : P;\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 PropsWithoutChildren<P> = 'children' extends keyof P ? DistributiveOmit<P, 'children'> : 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 * 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 * Infers the element type from props that are declared using ComponentProps.\n */\nexport type InferredElementRefType<Props> = ObscureEventName extends keyof Props\n  ? Required<Props>[ObscureEventName] extends React.PointerEventHandler<infer Element>\n    ? Element\n    : never\n  : never;\n\n/**\n * Return type for `React.forwardRef`, including inference of the proper typing for the ref.\n */\nexport type ForwardRefComponent<Props> = React.ForwardRefExoticComponent<\n  Props & React.RefAttributes<InferredElementRefType<Props>>\n>;\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\n/**\n * Helper type to correctly define the slot class names object.\n */\nexport type SlotClassNames<Slots> = {\n  [SlotName in keyof Slots]-?: string;\n};\n\n/**\n * A definition of a slot, as a component, very similar to how a React component is declared,\n * but with some additional metadata that is used to determine how to render the slot.\n */\nexport type SlotComponentType<Props> = Props & {\n  /**\n   * **NOTE**: Slot components are not callable.\n   */\n  (props: React.PropsWithChildren<{}>): React.ReactElement | null;\n  /**\n   * @internal\n   */\n  [SLOT_RENDER_FUNCTION_SYMBOL]?: SlotRenderFunction<Props>;\n  /**\n   * @internal\n   */\n  [SLOT_ELEMENT_TYPE_SYMBOL]:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n};\n\n/**\n * Data type for event handlers. It makes data a discriminated union, where each object requires `event` and `type` property.\n * - `event` is the specific event type\n * - `type` is a string literal. It serves as a clear identifier of the event type that reflects the component's state when the event occurred.\n *    For example, the Tree component's `onNavigation` event handler has different `type` for different key presses: `{ event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight } | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }`.\n *    Developers can use the `type` property to identify and filter events of interest.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnOpenChangeData = (\n *   | EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\>\n *   | EventData\\<'keydown', React.KeyboardEvent\\<MyComponentElement\\>\\>\n * ) & \\{ open: boolean; \\};\n */\nexport type EventData<Type extends string, TEvent> =\n  | { type: undefined; event: React.SyntheticEvent | Event }\n  | { type: Type; event: TEvent };\n\n/**\n * Type for props that are event handlers.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnSomeEventData = EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\> & \\{ open: boolean; \\};\n * type SomeProps = \\{ onSomeEvent?: EventHandler\\<OnSomeEventData\\>; \\};\n */\nexport type EventHandler<TData extends EventData<string, unknown>> = (\n  ev: React.SyntheticEvent | Event,\n  data: TData,\n) => void;\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../src/compose/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nimport { DistributiveOmit, ReplaceNullWithUndefined } from '../utils/types';\n\nexport type SlotRenderFunction<Props> = (\n  Component: React.ElementType<Props>,\n  props: Omit<Props, '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.ReactNode[] | 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> =\n  | Props\n  | ('children' extends keyof Props ? Extract<SlotShorthandValue, Props['children']> : never);\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> = Props & {\n  children?: ('children' extends keyof Props ? Props['children'] : never) | 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 EmptyIntrinsicElements =\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 IntrinsicElementProps<Type extends keyof JSX.IntrinsicElements> = Type extends EmptyIntrinsicElements\n  ? PropsWithoutChildren<React.PropsWithRef<JSX.IntrinsicElements[Type]>>\n  : React.PropsWithRef<JSX.IntrinsicElements[Type]>;\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 | React.VoidFunctionComponent | 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<IntrinsicElementProps<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<IntrinsicElementProps<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 * 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 ? DistributiveOmit<P, 'ref'> : P;\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 PropsWithoutChildren<P> = 'children' extends keyof P ? DistributiveOmit<P, 'children'> : 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 * 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 * Infers the element type from props that are declared using ComponentProps.\n */\nexport type InferredElementRefType<Props> = ObscureEventName extends keyof Props\n  ? Required<Props>[ObscureEventName] extends React.PointerEventHandler<infer Element>\n    ? Element\n    : never\n  : never;\n\n/**\n * Return type for `React.forwardRef`, including inference of the proper typing for the ref.\n */\nexport type ForwardRefComponent<Props> = React.ForwardRefExoticComponent<\n  Props & React.RefAttributes<InferredElementRefType<Props>>\n>;\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\n/**\n * Helper type to correctly define the slot class names object.\n */\nexport type SlotClassNames<Slots> = {\n  [SlotName in keyof Slots]-?: string;\n};\n\n/**\n * A definition of a slot, as a component, very similar to how a React component is declared,\n * but with some additional metadata that is used to determine how to render the slot.\n */\nexport type SlotComponentType<Props> = Props & {\n  /**\n   * **NOTE**: Slot components are not callable.\n   */\n  (props: React.PropsWithChildren<{}>): React.ReactElement | null;\n  /**\n   * @internal\n   */\n  [SLOT_RENDER_FUNCTION_SYMBOL]?: SlotRenderFunction<Props>;\n  /**\n   * @internal\n   */\n  [SLOT_ELEMENT_TYPE_SYMBOL]:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  /**\n   * @internal\n   * The original className prop for the slot, before being modified by the useStyles hook.\n   */\n  [SLOT_CLASS_NAME_PROP_SYMBOL]?: string;\n};\n\n/**\n * Data type for event handlers. It makes data a discriminated union, where each object requires `event` and `type` property.\n * - `event` is the specific event type\n * - `type` is a string literal. It serves as a clear identifier of the event type that reflects the component's state when the event occurred.\n *    For example, the Tree component's `onNavigation` event handler has different `type` for different key presses: `{ event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight } | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }`.\n *    Developers can use the `type` property to identify and filter events of interest.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnOpenChangeData = (\n *   | EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\>\n *   | EventData\\<'keydown', React.KeyboardEvent\\<MyComponentElement\\>\\>\n * ) & \\{ open: boolean; \\};\n */\nexport type EventData<Type extends string, TEvent> =\n  | { type: undefined; event: React.SyntheticEvent | Event }\n  | { type: Type; event: TEvent };\n\n/**\n * Type for props that are event handlers.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnSomeEventData = EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\> & \\{ open: boolean; \\};\n * type SomeProps = \\{ onSomeEvent?: EventHandler\\<OnSomeEventData\\>; \\};\n */\nexport type EventHandler<TData extends EventData<string, unknown>> = (\n  ev: React.SyntheticEvent | Event,\n  data: TData,\n) => void;\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/lib/index.js

@@ -1,7 +1,7 @@
 export { slot, isSlot, // eslint-disable-next-line @typescript-eslint/no-deprecated
 getSlots, // eslint-disable-next-line @typescript-eslint/no-deprecated
 getSlotsNext, assertSlots, // eslint-disable-next-line @typescript-eslint/no-deprecated
-resolveShorthand, isResolvedShorthand, getIntrinsicElementProps, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './compose/index';
+resolveShorthand, isResolvedShorthand, getIntrinsicElementProps, getSlotClassNameProp_unstable, SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './compose/index';
 export { IdPrefixProvider, resetIdsForTests, useAnimationFrame, useControllableState, useEventCallback, useFirstMount, useForceUpdate, useId, useIsomorphicLayoutEffect, useMergedRefs, useOnClickOutside, useOnScrollOutside, usePrevious, useScrollbarWidth, useTimeout } from './hooks/index';
 export { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';
 export { clamp, // eslint-disable-next-line @typescript-eslint/no-deprecated

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  slot,\n  isSlot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlotsNext,\n  assertSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  resolveShorthand,\n  isResolvedShorthand,\n  getIntrinsicElementProps,\n  SLOT_ELEMENT_TYPE_SYMBOL,\n  SLOT_RENDER_FUNCTION_SYMBOL,\n} from './compose/index';\nexport type {\n  ExtractSlotProps,\n  ComponentProps,\n  ComponentState,\n  ForwardRefComponent,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandFunction,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandOptions,\n  Slot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  Slots,\n  SlotClassNames,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n  SlotComponentType,\n  SlotOptions,\n  InferredElementRefType,\n  EventData,\n  EventHandler,\n} from './compose/index';\n\nexport {\n  IdPrefixProvider,\n  resetIdsForTests,\n  useAnimationFrame,\n  useControllableState,\n  useEventCallback,\n  useFirstMount,\n  useForceUpdate,\n  useId,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n  useOnClickOutside,\n  useOnScrollOutside,\n  usePrevious,\n  useScrollbarWidth,\n  useTimeout,\n} from './hooks/index';\nexport type { RefObjectFunction, UseControllableStateOptions, UseOnClickOrScrollOutsideOptions } from './hooks/index';\n\nexport { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';\n\nexport {\n  clamp,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getNativeElementProps,\n  getPartitionedNativeProps,\n  getRTLSafeKey,\n  mergeCallbacks,\n  isHTMLElement,\n  isInteractiveHTMLElement,\n  omit,\n  createPriorityQueue,\n} from './utils/index';\n\nexport type { DistributiveOmit, UnionToIntersection } from './utils/types';\n\nexport type { PriorityQueue } from './utils/priorityQueue';\n\nexport { applyTriggerPropsToChildren, getTriggerChild, isFluentTrigger } from './trigger/index';\n\nexport type { FluentTriggerComponent, TriggerProps } from './trigger/index';\n\n/**\n * Event utils\n */\nexport type { NativeTouchOrMouseEvent, ReactTouchOrMouseEvent, TouchOrMouseEvent } from './events/index';\nexport { isTouchEvent, isMouseEvent, getEventClientCoords } from './events/index';\n\nexport type {\n  SelectionMode,\n  OnSelectionChangeCallback,\n  OnSelectionChangeData,\n  SelectionItemId,\n  SelectionHookParams,\n  SelectionMethods,\n} from './selection/index';\nexport { useSelection } from './selection/index';\n\nexport { elementContains, setVirtualParent, getParent } from './virtualParent/index';\n"],"names":["slot","isSlot","getSlots","getSlotsNext","assertSlots","resolveShorthand","isResolvedShorthand","getIntrinsicElementProps","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","IdPrefixProvider","resetIdsForTests","useAnimationFrame","useControllableState","useEventCallback","useFirstMount","useForceUpdate","useId","useIsomorphicLayoutEffect","useMergedRefs","useOnClickOutside","useOnScrollOutside","usePrevious","useScrollbarWidth","useTimeout","canUseDOM","useIsSSR","SSRProvider","clamp","getNativeElementProps","getPartitionedNativeProps","getRTLSafeKey","mergeCallbacks","isHTMLElement","isInteractiveHTMLElement","omit","createPriorityQueue","applyTriggerPropsToChildren","getTriggerChild","isFluentTrigger","isTouchEvent","isMouseEvent","getEventClientCoords","useSelection","elementContains","setVirtualParent","getParent"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,SACEA,IAAI,EACJC,MAAM,EACN,4DAA4D;AAC5DC,QAAQ,EACR,4DAA4D;AAC5DC,YAAY,EACZC,WAAW,EACX,4DAA4D;AAC5DC,gBAAgB,EAChBC,mBAAmB,EACnBC,wBAAwB,EACxBC,wBAAwB,EACxBC,2BAA2B,QACtB,kBAAkB;AAyBzB,SACEC,gBAAgB,EAChBC,gBAAgB,EAChBC,iBAAiB,EACjBC,oBAAoB,EACpBC,gBAAgB,EAChBC,aAAa,EACbC,cAAc,EACdC,KAAK,EACLC,yBAAyB,EACzBC,aAAa,EACbC,iBAAiB,EACjBC,kBAAkB,EAClBC,WAAW,EACXC,iBAAiB,EACjBC,UAAU,QACL,gBAAgB;AAGvB,SAASC,SAAS,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,cAAc;AAE/D,SACEC,KAAK,EACL,4DAA4D;AAC5DC,qBAAqB,EACrBC,yBAAyB,EACzBC,aAAa,EACbC,cAAc,EACdC,aAAa,EACbC,wBAAwB,EACxBC,IAAI,EACJC,mBAAmB,QACd,gBAAgB;AAMvB,SAASC,2BAA2B,EAAEC,eAAe,EAAEC,eAAe,QAAQ,kBAAkB;AAQhG,SAASC,YAAY,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,iBAAiB;AAUlF,SAASC,YAAY,QAAQ,oBAAoB;AAEjD,SAASC,eAAe,EAAEC,gBAAgB,EAAEC,SAAS,QAAQ,wBAAwB"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  slot,\n  isSlot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlotsNext,\n  assertSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  resolveShorthand,\n  isResolvedShorthand,\n  getIntrinsicElementProps,\n  getSlotClassNameProp_unstable,\n  SLOT_CLASS_NAME_PROP_SYMBOL,\n  SLOT_ELEMENT_TYPE_SYMBOL,\n  SLOT_RENDER_FUNCTION_SYMBOL,\n} from './compose/index';\nexport type {\n  ExtractSlotProps,\n  ComponentProps,\n  ComponentState,\n  ForwardRefComponent,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandFunction,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandOptions,\n  Slot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  Slots,\n  SlotClassNames,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n  SlotComponentType,\n  SlotOptions,\n  InferredElementRefType,\n  EventData,\n  EventHandler,\n} from './compose/index';\n\nexport {\n  IdPrefixProvider,\n  resetIdsForTests,\n  useAnimationFrame,\n  useControllableState,\n  useEventCallback,\n  useFirstMount,\n  useForceUpdate,\n  useId,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n  useOnClickOutside,\n  useOnScrollOutside,\n  usePrevious,\n  useScrollbarWidth,\n  useTimeout,\n} from './hooks/index';\nexport type { RefObjectFunction, UseControllableStateOptions, UseOnClickOrScrollOutsideOptions } from './hooks/index';\n\nexport { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';\n\nexport {\n  clamp,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getNativeElementProps,\n  getPartitionedNativeProps,\n  getRTLSafeKey,\n  mergeCallbacks,\n  isHTMLElement,\n  isInteractiveHTMLElement,\n  omit,\n  createPriorityQueue,\n} from './utils/index';\n\nexport type { DistributiveOmit, UnionToIntersection } from './utils/types';\n\nexport type { PriorityQueue } from './utils/priorityQueue';\n\nexport { applyTriggerPropsToChildren, getTriggerChild, isFluentTrigger } from './trigger/index';\n\nexport type { FluentTriggerComponent, TriggerProps } from './trigger/index';\n\n/**\n * Event utils\n */\nexport type { NativeTouchOrMouseEvent, ReactTouchOrMouseEvent, TouchOrMouseEvent } from './events/index';\nexport { isTouchEvent, isMouseEvent, getEventClientCoords } from './events/index';\n\nexport type {\n  SelectionMode,\n  OnSelectionChangeCallback,\n  OnSelectionChangeData,\n  SelectionItemId,\n  SelectionHookParams,\n  SelectionMethods,\n} from './selection/index';\nexport { useSelection } from './selection/index';\n\nexport { elementContains, setVirtualParent, getParent } from './virtualParent/index';\n"],"names":["slot","isSlot","getSlots","getSlotsNext","assertSlots","resolveShorthand","isResolvedShorthand","getIntrinsicElementProps","getSlotClassNameProp_unstable","SLOT_CLASS_NAME_PROP_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","IdPrefixProvider","resetIdsForTests","useAnimationFrame","useControllableState","useEventCallback","useFirstMount","useForceUpdate","useId","useIsomorphicLayoutEffect","useMergedRefs","useOnClickOutside","useOnScrollOutside","usePrevious","useScrollbarWidth","useTimeout","canUseDOM","useIsSSR","SSRProvider","clamp","getNativeElementProps","getPartitionedNativeProps","getRTLSafeKey","mergeCallbacks","isHTMLElement","isInteractiveHTMLElement","omit","createPriorityQueue","applyTriggerPropsToChildren","getTriggerChild","isFluentTrigger","isTouchEvent","isMouseEvent","getEventClientCoords","useSelection","elementContains","setVirtualParent","getParent"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,SACEA,IAAI,EACJC,MAAM,EACN,4DAA4D;AAC5DC,QAAQ,EACR,4DAA4D;AAC5DC,YAAY,EACZC,WAAW,EACX,4DAA4D;AAC5DC,gBAAgB,EAChBC,mBAAmB,EACnBC,wBAAwB,EACxBC,6BAA6B,EAC7BC,2BAA2B,EAC3BC,wBAAwB,EACxBC,2BAA2B,QACtB,kBAAkB;AAyBzB,SACEC,gBAAgB,EAChBC,gBAAgB,EAChBC,iBAAiB,EACjBC,oBAAoB,EACpBC,gBAAgB,EAChBC,aAAa,EACbC,cAAc,EACdC,KAAK,EACLC,yBAAyB,EACzBC,aAAa,EACbC,iBAAiB,EACjBC,kBAAkB,EAClBC,WAAW,EACXC,iBAAiB,EACjBC,UAAU,QACL,gBAAgB;AAGvB,SAASC,SAAS,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,cAAc;AAE/D,SACEC,KAAK,EACL,4DAA4D;AAC5DC,qBAAqB,EACrBC,yBAAyB,EACzBC,aAAa,EACbC,cAAc,EACdC,aAAa,EACbC,wBAAwB,EACxBC,IAAI,EACJC,mBAAmB,QACd,gBAAgB;AAMvB,SAASC,2BAA2B,EAAEC,eAAe,EAAEC,eAAe,QAAQ,kBAAkB;AAQhG,SAASC,YAAY,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,iBAAiB;AAUlF,SAASC,YAAY,QAAQ,oBAAoB;AAEjD,SAASC,eAAe,EAAEC,gBAAgB,EAAEC,SAAS,QAAQ,wBAAwB"}

package/lib-commonjs/compose/constants.js

@@ -12,6 +12,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    SLOT_CLASS_NAME_PROP_SYMBOL: function() {
+        return SLOT_CLASS_NAME_PROP_SYMBOL;
+    },
     SLOT_ELEMENT_TYPE_SYMBOL: function() {
         return SLOT_ELEMENT_TYPE_SYMBOL;
     },
@@ -21,3 +24,4 @@ _export(exports, {
 });
 const SLOT_RENDER_FUNCTION_SYMBOL = Symbol.for('fui.slotRenderFunction');
 const SLOT_ELEMENT_TYPE_SYMBOL = Symbol.for('fui.slotElementType');
+const SLOT_CLASS_NAME_PROP_SYMBOL = Symbol.for('fui.slotClassNameProp');

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/constants.ts"],"sourcesContent":["/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_RENDER_FUNCTION_SYMBOL = Symbol.for('fui.slotRenderFunction');\n/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_ELEMENT_TYPE_SYMBOL = Symbol.for('fui.slotElementType');\n"],"names":["SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","Symbol","for"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;;CAGC;;;;;;;;;;;IAMYA,wBAAwB;eAAxBA;;IALAC,2BAA2B;eAA3BA;;;AAAN,MAAMA,8BAA8BC,OAAOC,GAAG,CAAC;AAK/C,MAAMH,2BAA2BE,OAAOC,GAAG,CAAC"}
+{"version":3,"sources":["../src/compose/constants.ts"],"sourcesContent":["/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_RENDER_FUNCTION_SYMBOL = Symbol.for('fui.slotRenderFunction');\n/**\n * @internal\n * Internal reference for the render function\n */\nexport const SLOT_ELEMENT_TYPE_SYMBOL = Symbol.for('fui.slotElementType');\n/**\n * @internal\n * Internal cache of the original className prop for the slot, before being modified by the useStyles hook.\n */\nexport const SLOT_CLASS_NAME_PROP_SYMBOL = Symbol.for('fui.slotClassNameProp');\n"],"names":["SLOT_CLASS_NAME_PROP_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","Symbol","for"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;;CAGC;;;;;;;;;;;IAWYA,2BAA2B;eAA3BA;;IALAC,wBAAwB;eAAxBA;;IALAC,2BAA2B;eAA3BA;;;AAAN,MAAMA,8BAA8BC,OAAOC,GAAG,CAAC;AAK/C,MAAMH,2BAA2BE,OAAOC,GAAG,CAAC;AAK5C,MAAMJ,8BAA8BG,OAAOC,GAAG,CAAC"}

package/lib-commonjs/compose/getSlotClassNameProp.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "getSlotClassNameProp", {
+    enumerable: true,
+    get: function() {
+        return getSlotClassNameProp;
+    }
+});
+const _constants = require("../compose/constants");
+const getSlotClassNameProp = (slot)=>{
+    if (_constants.SLOT_CLASS_NAME_PROP_SYMBOL in slot && typeof slot[_constants.SLOT_CLASS_NAME_PROP_SYMBOL] === 'string') {
+        return slot[_constants.SLOT_CLASS_NAME_PROP_SYMBOL];
+    }
+    return undefined;
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/compose/getSlotClassNameProp.ts"],"sourcesContent":["import { SLOT_CLASS_NAME_PROP_SYMBOL } from '../compose/constants';\nimport type { UnknownSlotProps } from '../compose/types';\n\n/**\n * Get the className prop set on the slot by the user, without including the default classes added by the component.\n * Custom style hooks should merge this className _after_ any additional classes added by the hook, to ensure that\n * classes added by the user take precedence over the custom style hook.\n *\n * Example usage in a custom style hook:\n * ```ts\n * state.root.className = mergeClasses(\n *   state.root.className,\n *   customStyles.root,\n *   getSlotClassNameProp_unstable(state.root));\n * ```\n *\n * @returns The className prop set on the slot by the user, or undefined if not set.\n */\nexport const getSlotClassNameProp = (slot: UnknownSlotProps) => {\n  if (SLOT_CLASS_NAME_PROP_SYMBOL in slot && typeof slot[SLOT_CLASS_NAME_PROP_SYMBOL] === 'string') {\n    return slot[SLOT_CLASS_NAME_PROP_SYMBOL];\n  }\n  return undefined;\n};\n"],"names":["getSlotClassNameProp","slot","SLOT_CLASS_NAME_PROP_SYMBOL","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":";;;;+BAkBaA;;;eAAAA;;;2BAlB+B;AAkBrC,MAAMA,uBAAuB,CAACC;IACnC,IAAIC,sCAA2B,IAAID,QAAQ,OAAOA,IAAI,CAACC,sCAA2B,CAAC,KAAK,UAAU;QAChG,OAAOD,IAAI,CAACC,sCAA2B,CAAC;IAC1C;IACA,OAAOC;AACT"}

package/lib-commonjs/compose/index.js

@@ -9,6 +9,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    SLOT_CLASS_NAME_PROP_SYMBOL: function() {
+        return _constants.SLOT_CLASS_NAME_PROP_SYMBOL;
+    },
     SLOT_ELEMENT_TYPE_SYMBOL: function() {
         return _constants.SLOT_ELEMENT_TYPE_SYMBOL;
     },
@@ -21,6 +24,9 @@ _export(exports, {
     getIntrinsicElementProps: function() {
         return _getIntrinsicElementProps.getIntrinsicElementProps;
     },
+    getSlotClassNameProp_unstable: function() {
+        return _getSlotClassNameProp.getSlotClassNameProp;
+    },
     getSlots: function() {
         return _getSlots.getSlots;
     },
@@ -47,6 +53,7 @@ const _constants = require("./constants");
 const _isSlot = require("./isSlot");
 const _assertSlots = require("./assertSlots");
 const _getIntrinsicElementProps = require("./getIntrinsicElementProps");
+const _getSlotClassNameProp = require("./getSlotClassNameProp");
 const _getSlots = require("./deprecated/getSlots");
 const _resolveShorthand = require("./deprecated/resolveShorthand");
 const _getSlotsNext = require("./deprecated/getSlotsNext");

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/index.ts"],"sourcesContent":["import * as slot from './slot';\n\nexport type {\n  AsIntrinsicElement,\n  ComponentProps,\n  ComponentState,\n  EventData,\n  EventHandler,\n  ExtractSlotProps,\n  ForwardRefComponent,\n  InferredElementRefType,\n  IsSingleton,\n  PropsWithoutChildren,\n  PropsWithoutRef,\n  Slot,\n  SlotClassNames,\n  SlotComponentType,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nexport { isResolvedShorthand } from './isResolvedShorthand';\nexport { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nexport { isSlot } from './isSlot';\nexport { assertSlots } from './assertSlots';\nexport { getIntrinsicElementProps } from './getIntrinsicElementProps';\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ObjectSlotProps, Slots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ResolveShorthandFunction, ResolveShorthandOptions } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { resolveShorthand } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlotsNext } from './deprecated/getSlotsNext';\n\nexport { slot };\nexport type { SlotOptions } from './slot';\n"],"names":["SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","assertSlots","getIntrinsicElementProps","getSlots","getSlotsNext","isResolvedShorthand","isSlot","resolveShorthand","slot"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAuBSA,wBAAwB;eAAxBA,mCAAwB;;IAAEC,2BAA2B;eAA3BA,sCAA2B;;IAErDC,WAAW;eAAXA,wBAAW;;IACXC,wBAAwB;eAAxBA,kDAAwB;;IAKxBC,QAAQ;eAARA,kBAAQ;;IAMRC,YAAY;eAAZA,0BAAY;;IAfZC,mBAAmB;eAAnBA,wCAAmB;;IAEnBC,MAAM;eAANA,cAAM;;IAWNC,gBAAgB;eAAhBA,kCAAgB;;IAIhBC,IAAI;eAAJA;;;;gEAvCa;qCAsBc;2BACkC;wBAC/C;6BACK;0CACa;0BAKhB;kCAIQ;8BAEJ"}
+{"version":3,"sources":["../src/compose/index.ts"],"sourcesContent":["import * as slot from './slot';\n\nexport type {\n  AsIntrinsicElement,\n  ComponentProps,\n  ComponentState,\n  EventData,\n  EventHandler,\n  ExtractSlotProps,\n  ForwardRefComponent,\n  InferredElementRefType,\n  IsSingleton,\n  PropsWithoutChildren,\n  PropsWithoutRef,\n  Slot,\n  SlotClassNames,\n  SlotComponentType,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nexport { isResolvedShorthand } from './isResolvedShorthand';\nexport { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nexport { isSlot } from './isSlot';\nexport { assertSlots } from './assertSlots';\nexport { getIntrinsicElementProps } from './getIntrinsicElementProps';\nexport { getSlotClassNameProp as getSlotClassNameProp_unstable } from './getSlotClassNameProp';\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ObjectSlotProps, Slots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlots } from './deprecated/getSlots';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { ResolveShorthandFunction, ResolveShorthandOptions } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { resolveShorthand } from './deprecated/resolveShorthand';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport { getSlotsNext } from './deprecated/getSlotsNext';\n\nexport { slot };\nexport type { SlotOptions } from './slot';\n"],"names":["SLOT_CLASS_NAME_PROP_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","assertSlots","getIntrinsicElementProps","getSlotClassNameProp_unstable","getSlotClassNameProp","getSlots","getSlotsNext","isResolvedShorthand","isSlot","resolveShorthand","slot"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAuBSA,2BAA2B;eAA3BA,sCAA2B;;IAAEC,wBAAwB;eAAxBA,mCAAwB;;IAAEC,2BAA2B;eAA3BA,sCAA2B;;IAElFC,WAAW;eAAXA,wBAAW;;IACXC,wBAAwB;eAAxBA,kDAAwB;;IACAC,6BAA6B;eAArDC,0CAAoB;;IAKpBC,QAAQ;eAARA,kBAAQ;;IAMRC,YAAY;eAAZA,0BAAY;;IAhBZC,mBAAmB;eAAnBA,wCAAmB;;IAEnBC,MAAM;eAANA,cAAM;;IAYNC,gBAAgB;eAAhBA,kCAAgB;;IAIhBC,IAAI;eAAJA;;;;gEAxCa;qCAsBc;2BAC+D;wBAC5E;6BACK;0CACa;sCAC6B;0BAK7C;kCAIQ;8BAEJ"}

package/lib-commonjs/compose/slot.js

@@ -33,7 +33,8 @@ function always(value, options) {
    */ const propsWithMetadata = {
         ...defaultProps,
         ...props,
-        [_constants.SLOT_ELEMENT_TYPE_SYMBOL]: elementType
+        [_constants.SLOT_ELEMENT_TYPE_SYMBOL]: elementType,
+        [_constants.SLOT_CLASS_NAME_PROP_SYMBOL]: props === null || props === void 0 ? void 0 : props.className
     };
     if (props && typeof props.children === 'function') {
         propsWithMetadata[_constants.SLOT_RENDER_FUNCTION_SYMBOL] = props.children;

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/slot.ts"],"sourcesContent":["import type {\n  AsIntrinsicElement,\n  SlotComponentType,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nimport * as React from 'react';\nimport { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\n\nexport type SlotOptions<Props extends UnknownSlotProps> = {\n  elementType:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  defaultProps?: Partial<Props>;\n};\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided.\n */\nexport function always<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined,\n  options: SlotOptions<Props>,\n): SlotComponentType<Props> {\n  const { defaultProps, elementType } = options;\n\n  const props = resolveShorthand(value);\n\n  /**\n   * Casting is required here as SlotComponentType is a function, not an object.\n   * Although SlotComponentType has a function signature, it is still just an object.\n   * This is required to make a slot callable (JSX compatible), this is the exact same approach\n   * that is used on `@types/react` components\n   */\n  const propsWithMetadata = {\n    ...defaultProps,\n    ...props,\n    [SLOT_ELEMENT_TYPE_SYMBOL]: elementType,\n  } as SlotComponentType<Props>;\n\n  if (props && typeof props.children === 'function') {\n    propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = props.children as SlotRenderFunction<Props>;\n    propsWithMetadata.children = defaultProps?.children;\n  }\n\n  return propsWithMetadata;\n}\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided\n * * `renderByDefault` - a boolean that indicates if a slot will be rendered even if it's base value is `undefined`.\n * By default if `props.SLOT_NAME` is `undefined` then `state.SLOT_NAME` becomes `undefined`\n * and nothing will be rendered, but if `renderByDefault = true` then `state.SLOT_NAME` becomes an object\n * with the values provided by `options.defaultProps` (or `{}`). This is useful for cases such as providing a default content\n * in case no shorthand is provided, like the case of the `expandIcon` slot for the `AccordionHeader`\n */\nexport function optional<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined | null,\n  options: { renderByDefault?: boolean } & SlotOptions<Props>,\n): SlotComponentType<Props> | undefined {\n  if (value === null || (value === undefined && !options.renderByDefault)) {\n    return undefined;\n  }\n  return always(value, options);\n}\n\n/**\n * Helper function that converts a slot shorthand or properties to a slot properties object\n * The main difference between this function and `slot` is that this function does not return the metadata required for a slot to be considered a properly renderable slot, it only converts the value to a slot properties object\n * @param value - the value of the slot, it can be a slot shorthand or a slot properties object\n */\nexport function resolveShorthand<Props extends UnknownSlotProps | null | undefined>(\n  value: Props | SlotShorthandValue,\n): Props {\n  if (\n    typeof value === 'string' ||\n    typeof value === 'number' ||\n    Array.isArray(value) ||\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    React.isValidElement<any>(value)\n  ) {\n    return { children: value } as Props;\n  }\n  if (value && typeof value !== 'object' && process.env.NODE_ENV !== 'production') {\n    // TODO: would be nice to have a link to slot documentation in this error message\n    // eslint-disable-next-line no-console\n    console.error(/** #__DE-INDENT__ */ `\n      @fluentui/react-utilities [slot.${resolveShorthand.name}]:\n      A slot got an invalid value \"${value}\" (${typeof value}).\n      A valid value for a slot is a slot shorthand or slot properties object.\n      Slot shorthands can be strings, numbers, arrays or JSX elements\n    `);\n  }\n\n  return value;\n}\n"],"names":["always","optional","resolveShorthand","value","options","defaultProps","elementType","props","propsWithMetadata","SLOT_ELEMENT_TYPE_SYMBOL","children","SLOT_RENDER_FUNCTION_SYMBOL","undefined","renderByDefault","Array","isArray","React","isValidElement","process","env","NODE_ENV","console","error","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAyBgBA,MAAM;eAANA;;IAyCAC,QAAQ;eAARA;;IAeAC,gBAAgB;eAAhBA;;;;iEA1EO;2BAC+C;AAiB/D,SAASF,OACdG,KAA6C,EAC7CC,OAA2B;IAE3B,MAAM,EAAEC,YAAY,EAAEC,WAAW,EAAE,GAAGF;IAEtC,MAAMG,QAAQL,iBAAiBC;IAE/B;;;;;GAKC,GACD,MAAMK,oBAAoB;QACxB,GAAGH,YAAY;QACf,GAAGE,KAAK;QACR,CAACE,mCAAwB,CAAC,EAAEH;IAC9B;IAEA,IAAIC,SAAS,OAAOA,MAAMG,QAAQ,KAAK,YAAY;QACjDF,iBAAiB,CAACG,sCAA2B,CAAC,GAAGJ,MAAMG,QAAQ;QAC/DF,kBAAkBE,QAAQ,GAAGL,yBAAAA,mCAAAA,aAAcK,QAAQ;IACrD;IAEA,OAAOF;AACT;AAeO,SAASP,SACdE,KAAoD,EACpDC,OAA2D;IAE3D,IAAID,UAAU,QAASA,UAAUS,aAAa,CAACR,QAAQS,eAAe,EAAG;QACvE,OAAOD;IACT;IACA,OAAOZ,OAAOG,OAAOC;AACvB;AAOO,SAASF,iBACdC,KAAiC;IAEjC,IACE,OAAOA,UAAU,YACjB,OAAOA,UAAU,YACjBW,MAAMC,OAAO,CAACZ,UACd,8DAA8D;IAC9Da,OAAMC,cAAc,CAAMd,QAC1B;QACA,OAAO;YAAEO,UAAUP;QAAM;IAC3B;IACA,IAAIA,SAAS,OAAOA,UAAU,YAAYe,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QAC/E,iFAAiF;QACjF,sCAAsC;QACtCC,QAAQC,KAAK,CAAuB,CAAC,gCACH,EAAEpB,iBAAiBqB,IAAI,CAAC;6BAC3B,EAAEpB,MAAM,GAAG,EAAE,OAAOA,MAAM;;+DAGzD,CAAC;IACH;IAEA,OAAOA;AACT"}
+{"version":3,"sources":["../src/compose/slot.ts"],"sourcesContent":["import type {\n  AsIntrinsicElement,\n  SlotComponentType,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n} from './types';\nimport * as React from 'react';\nimport { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\n\nexport type SlotOptions<Props extends UnknownSlotProps> = {\n  elementType:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  defaultProps?: Partial<Props>;\n};\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided.\n */\nexport function always<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined,\n  options: SlotOptions<Props>,\n): SlotComponentType<Props> {\n  const { defaultProps, elementType } = options;\n\n  const props = resolveShorthand(value);\n\n  /**\n   * Casting is required here as SlotComponentType is a function, not an object.\n   * Although SlotComponentType has a function signature, it is still just an object.\n   * This is required to make a slot callable (JSX compatible), this is the exact same approach\n   * that is used on `@types/react` components\n   */\n  const propsWithMetadata = {\n    ...defaultProps,\n    ...props,\n    [SLOT_ELEMENT_TYPE_SYMBOL]: elementType,\n    [SLOT_CLASS_NAME_PROP_SYMBOL]: props?.className,\n  } as SlotComponentType<Props>;\n\n  if (props && typeof props.children === 'function') {\n    propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = props.children as SlotRenderFunction<Props>;\n    propsWithMetadata.children = defaultProps?.children;\n  }\n\n  return propsWithMetadata;\n}\n\n/**\n * Creates a slot from a slot shorthand or properties (`props.SLOT_NAME` or `props` itself)\n * @param value - the value of the slot, it can be a slot shorthand, a slot component or a slot properties\n * @param options - values you can pass to alter the signature of a slot, those values are:\n *\n * * `elementType` - the base element type of a slot, defaults to `'div'`\n * * `defaultProps` - similar to a React component declaration, you can provide a slot default properties to be merged with the shorthand/properties provided\n * * `renderByDefault` - a boolean that indicates if a slot will be rendered even if it's base value is `undefined`.\n * By default if `props.SLOT_NAME` is `undefined` then `state.SLOT_NAME` becomes `undefined`\n * and nothing will be rendered, but if `renderByDefault = true` then `state.SLOT_NAME` becomes an object\n * with the values provided by `options.defaultProps` (or `{}`). This is useful for cases such as providing a default content\n * in case no shorthand is provided, like the case of the `expandIcon` slot for the `AccordionHeader`\n */\nexport function optional<Props extends UnknownSlotProps>(\n  value: Props | SlotShorthandValue | undefined | null,\n  options: { renderByDefault?: boolean } & SlotOptions<Props>,\n): SlotComponentType<Props> | undefined {\n  if (value === null || (value === undefined && !options.renderByDefault)) {\n    return undefined;\n  }\n  return always(value, options);\n}\n\n/**\n * Helper function that converts a slot shorthand or properties to a slot properties object\n * The main difference between this function and `slot` is that this function does not return the metadata required for a slot to be considered a properly renderable slot, it only converts the value to a slot properties object\n * @param value - the value of the slot, it can be a slot shorthand or a slot properties object\n */\nexport function resolveShorthand<Props extends UnknownSlotProps | null | undefined>(\n  value: Props | SlotShorthandValue,\n): Props {\n  if (\n    typeof value === 'string' ||\n    typeof value === 'number' ||\n    Array.isArray(value) ||\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    React.isValidElement<any>(value)\n  ) {\n    return { children: value } as Props;\n  }\n  if (value && typeof value !== 'object' && process.env.NODE_ENV !== 'production') {\n    // TODO: would be nice to have a link to slot documentation in this error message\n    // eslint-disable-next-line no-console\n    console.error(/** #__DE-INDENT__ */ `\n      @fluentui/react-utilities [slot.${resolveShorthand.name}]:\n      A slot got an invalid value \"${value}\" (${typeof value}).\n      A valid value for a slot is a slot shorthand or slot properties object.\n      Slot shorthands can be strings, numbers, arrays or JSX elements\n    `);\n  }\n\n  return value;\n}\n"],"names":["always","optional","resolveShorthand","value","options","defaultProps","elementType","props","propsWithMetadata","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_CLASS_NAME_PROP_SYMBOL","className","children","SLOT_RENDER_FUNCTION_SYMBOL","undefined","renderByDefault","Array","isArray","React","isValidElement","process","env","NODE_ENV","console","error","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAyBgBA,MAAM;eAANA;;IA0CAC,QAAQ;eAARA;;IAeAC,gBAAgB;eAAhBA;;;;iEA3EO;2BAC4E;AAiB5F,SAASF,OACdG,KAA6C,EAC7CC,OAA2B;IAE3B,MAAM,EAAEC,YAAY,EAAEC,WAAW,EAAE,GAAGF;IAEtC,MAAMG,QAAQL,iBAAiBC;IAE/B;;;;;GAKC,GACD,MAAMK,oBAAoB;QACxB,GAAGH,YAAY;QACf,GAAGE,KAAK;QACR,CAACE,mCAAwB,CAAC,EAAEH;QAC5B,CAACI,sCAA2B,CAAC,EAAEH,kBAAAA,4BAAAA,MAAOI,SAAS;IACjD;IAEA,IAAIJ,SAAS,OAAOA,MAAMK,QAAQ,KAAK,YAAY;QACjDJ,iBAAiB,CAACK,sCAA2B,CAAC,GAAGN,MAAMK,QAAQ;QAC/DJ,kBAAkBI,QAAQ,GAAGP,yBAAAA,mCAAAA,aAAcO,QAAQ;IACrD;IAEA,OAAOJ;AACT;AAeO,SAASP,SACdE,KAAoD,EACpDC,OAA2D;IAE3D,IAAID,UAAU,QAASA,UAAUW,aAAa,CAACV,QAAQW,eAAe,EAAG;QACvE,OAAOD;IACT;IACA,OAAOd,OAAOG,OAAOC;AACvB;AAOO,SAASF,iBACdC,KAAiC;IAEjC,IACE,OAAOA,UAAU,YACjB,OAAOA,UAAU,YACjBa,MAAMC,OAAO,CAACd,UACd,8DAA8D;IAC9De,OAAMC,cAAc,CAAMhB,QAC1B;QACA,OAAO;YAAES,UAAUT;QAAM;IAC3B;IACA,IAAIA,SAAS,OAAOA,UAAU,YAAYiB,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QAC/E,iFAAiF;QACjF,sCAAsC;QACtCC,QAAQC,KAAK,CAAuB,CAAC,gCACH,EAAEtB,iBAAiBuB,IAAI,CAAC;6BAC3B,EAAEtB,MAAM,GAAG,EAAE,OAAOA,MAAM;;+DAGzD,CAAC;IACH;IAEA,OAAOA;AACT"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/compose/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nimport { DistributiveOmit, ReplaceNullWithUndefined } from '../utils/types';\n\nexport type SlotRenderFunction<Props> = (\n  Component: React.ElementType<Props>,\n  props: Omit<Props, '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.ReactNode[] | 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> =\n  | Props\n  | ('children' extends keyof Props ? Extract<SlotShorthandValue, Props['children']> : never);\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> = Props & {\n  children?: ('children' extends keyof Props ? Props['children'] : never) | 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 EmptyIntrinsicElements =\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 IntrinsicElementProps<Type extends keyof JSX.IntrinsicElements> = Type extends EmptyIntrinsicElements\n  ? PropsWithoutChildren<React.PropsWithRef<JSX.IntrinsicElements[Type]>>\n  : React.PropsWithRef<JSX.IntrinsicElements[Type]>;\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 | React.VoidFunctionComponent | 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<IntrinsicElementProps<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<IntrinsicElementProps<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 * 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 ? DistributiveOmit<P, 'ref'> : P;\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 PropsWithoutChildren<P> = 'children' extends keyof P ? DistributiveOmit<P, 'children'> : 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 * 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 * Infers the element type from props that are declared using ComponentProps.\n */\nexport type InferredElementRefType<Props> = ObscureEventName extends keyof Props\n  ? Required<Props>[ObscureEventName] extends React.PointerEventHandler<infer Element>\n    ? Element\n    : never\n  : never;\n\n/**\n * Return type for `React.forwardRef`, including inference of the proper typing for the ref.\n */\nexport type ForwardRefComponent<Props> = React.ForwardRefExoticComponent<\n  Props & React.RefAttributes<InferredElementRefType<Props>>\n>;\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\n/**\n * Helper type to correctly define the slot class names object.\n */\nexport type SlotClassNames<Slots> = {\n  [SlotName in keyof Slots]-?: string;\n};\n\n/**\n * A definition of a slot, as a component, very similar to how a React component is declared,\n * but with some additional metadata that is used to determine how to render the slot.\n */\nexport type SlotComponentType<Props> = Props & {\n  /**\n   * **NOTE**: Slot components are not callable.\n   */\n  (props: React.PropsWithChildren<{}>): React.ReactElement | null;\n  /**\n   * @internal\n   */\n  [SLOT_RENDER_FUNCTION_SYMBOL]?: SlotRenderFunction<Props>;\n  /**\n   * @internal\n   */\n  [SLOT_ELEMENT_TYPE_SYMBOL]:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n};\n\n/**\n * Data type for event handlers. It makes data a discriminated union, where each object requires `event` and `type` property.\n * - `event` is the specific event type\n * - `type` is a string literal. It serves as a clear identifier of the event type that reflects the component's state when the event occurred.\n *    For example, the Tree component's `onNavigation` event handler has different `type` for different key presses: `{ event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight } | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }`.\n *    Developers can use the `type` property to identify and filter events of interest.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnOpenChangeData = (\n *   | EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\>\n *   | EventData\\<'keydown', React.KeyboardEvent\\<MyComponentElement\\>\\>\n * ) & \\{ open: boolean; \\};\n */\nexport type EventData<Type extends string, TEvent> =\n  | { type: undefined; event: React.SyntheticEvent | Event }\n  | { type: Type; event: TEvent };\n\n/**\n * Type for props that are event handlers.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnSomeEventData = EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\> & \\{ open: boolean; \\};\n * type SomeProps = \\{ onSomeEvent?: EventHandler\\<OnSomeEventData\\>; \\};\n */\nexport type EventHandler<TData extends EventData<string, unknown>> = (\n  ev: React.SyntheticEvent | Event,\n  data: TData,\n) => void;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
+{"version":3,"sources":["../src/compose/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { SLOT_CLASS_NAME_PROP_SYMBOL, SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from './constants';\nimport { DistributiveOmit, ReplaceNullWithUndefined } from '../utils/types';\n\nexport type SlotRenderFunction<Props> = (\n  Component: React.ElementType<Props>,\n  props: Omit<Props, '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.ReactNode[] | 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> =\n  | Props\n  | ('children' extends keyof Props ? Extract<SlotShorthandValue, Props['children']> : never);\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> = Props & {\n  children?: ('children' extends keyof Props ? Props['children'] : never) | 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 EmptyIntrinsicElements =\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 IntrinsicElementProps<Type extends keyof JSX.IntrinsicElements> = Type extends EmptyIntrinsicElements\n  ? PropsWithoutChildren<React.PropsWithRef<JSX.IntrinsicElements[Type]>>\n  : React.PropsWithRef<JSX.IntrinsicElements[Type]>;\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 | React.VoidFunctionComponent | 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<IntrinsicElementProps<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<IntrinsicElementProps<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 * 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 ? DistributiveOmit<P, 'ref'> : P;\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 PropsWithoutChildren<P> = 'children' extends keyof P ? DistributiveOmit<P, 'children'> : 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 * 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 * Infers the element type from props that are declared using ComponentProps.\n */\nexport type InferredElementRefType<Props> = ObscureEventName extends keyof Props\n  ? Required<Props>[ObscureEventName] extends React.PointerEventHandler<infer Element>\n    ? Element\n    : never\n  : never;\n\n/**\n * Return type for `React.forwardRef`, including inference of the proper typing for the ref.\n */\nexport type ForwardRefComponent<Props> = React.ForwardRefExoticComponent<\n  Props & React.RefAttributes<InferredElementRefType<Props>>\n>;\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\n/**\n * Helper type to correctly define the slot class names object.\n */\nexport type SlotClassNames<Slots> = {\n  [SlotName in keyof Slots]-?: string;\n};\n\n/**\n * A definition of a slot, as a component, very similar to how a React component is declared,\n * but with some additional metadata that is used to determine how to render the slot.\n */\nexport type SlotComponentType<Props> = Props & {\n  /**\n   * **NOTE**: Slot components are not callable.\n   */\n  (props: React.PropsWithChildren<{}>): React.ReactElement | null;\n  /**\n   * @internal\n   */\n  [SLOT_RENDER_FUNCTION_SYMBOL]?: SlotRenderFunction<Props>;\n  /**\n   * @internal\n   */\n  [SLOT_ELEMENT_TYPE_SYMBOL]:\n    | React.ComponentType<Props>\n    | (Props extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);\n  /**\n   * @internal\n   * The original className prop for the slot, before being modified by the useStyles hook.\n   */\n  [SLOT_CLASS_NAME_PROP_SYMBOL]?: string;\n};\n\n/**\n * Data type for event handlers. It makes data a discriminated union, where each object requires `event` and `type` property.\n * - `event` is the specific event type\n * - `type` is a string literal. It serves as a clear identifier of the event type that reflects the component's state when the event occurred.\n *    For example, the Tree component's `onNavigation` event handler has different `type` for different key presses: `{ event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight } | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }`.\n *    Developers can use the `type` property to identify and filter events of interest.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnOpenChangeData = (\n *   | EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\>\n *   | EventData\\<'keydown', React.KeyboardEvent\\<MyComponentElement\\>\\>\n * ) & \\{ open: boolean; \\};\n */\nexport type EventData<Type extends string, TEvent> =\n  | { type: undefined; event: React.SyntheticEvent | Event }\n  | { type: Type; event: TEvent };\n\n/**\n * Type for props that are event handlers.\n * See RFC event-handlers-event-type.md for more details.\n *\n * Example usage:\n * type OnSomeEventData = EventData\\<'click', React.MouseEvent\\<MyComponentElement\\>\\> & \\{ open: boolean; \\};\n * type SomeProps = \\{ onSomeEvent?: EventHandler\\<OnSomeEventData\\>; \\};\n */\nexport type EventHandler<TData extends EventData<string, unknown>> = (\n  ev: React.SyntheticEvent | Event,\n  data: TData,\n) => void;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}

package/lib-commonjs/index.js

@@ -12,6 +12,9 @@ _export(exports, {
     IdPrefixProvider: function() {
         return _index1.IdPrefixProvider;
     },
+    SLOT_CLASS_NAME_PROP_SYMBOL: function() {
+        return _index.SLOT_CLASS_NAME_PROP_SYMBOL;
+    },
     SLOT_ELEMENT_TYPE_SYMBOL: function() {
         return _index.SLOT_ELEMENT_TYPE_SYMBOL;
     },
@@ -58,6 +61,9 @@ _export(exports, {
     getRTLSafeKey: function() {
         return _index3.getRTLSafeKey;
     },
+    getSlotClassNameProp_unstable: function() {
+        return _index.getSlotClassNameProp_unstable;
+    },
     // eslint-disable-next-line @typescript-eslint/no-deprecated
     getSlots: function() {
         return _index.getSlots;

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  slot,\n  isSlot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlotsNext,\n  assertSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  resolveShorthand,\n  isResolvedShorthand,\n  getIntrinsicElementProps,\n  SLOT_ELEMENT_TYPE_SYMBOL,\n  SLOT_RENDER_FUNCTION_SYMBOL,\n} from './compose/index';\nexport type {\n  ExtractSlotProps,\n  ComponentProps,\n  ComponentState,\n  ForwardRefComponent,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandFunction,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandOptions,\n  Slot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  Slots,\n  SlotClassNames,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n  SlotComponentType,\n  SlotOptions,\n  InferredElementRefType,\n  EventData,\n  EventHandler,\n} from './compose/index';\n\nexport {\n  IdPrefixProvider,\n  resetIdsForTests,\n  useAnimationFrame,\n  useControllableState,\n  useEventCallback,\n  useFirstMount,\n  useForceUpdate,\n  useId,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n  useOnClickOutside,\n  useOnScrollOutside,\n  usePrevious,\n  useScrollbarWidth,\n  useTimeout,\n} from './hooks/index';\nexport type { RefObjectFunction, UseControllableStateOptions, UseOnClickOrScrollOutsideOptions } from './hooks/index';\n\nexport { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';\n\nexport {\n  clamp,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getNativeElementProps,\n  getPartitionedNativeProps,\n  getRTLSafeKey,\n  mergeCallbacks,\n  isHTMLElement,\n  isInteractiveHTMLElement,\n  omit,\n  createPriorityQueue,\n} from './utils/index';\n\nexport type { DistributiveOmit, UnionToIntersection } from './utils/types';\n\nexport type { PriorityQueue } from './utils/priorityQueue';\n\nexport { applyTriggerPropsToChildren, getTriggerChild, isFluentTrigger } from './trigger/index';\n\nexport type { FluentTriggerComponent, TriggerProps } from './trigger/index';\n\n/**\n * Event utils\n */\nexport type { NativeTouchOrMouseEvent, ReactTouchOrMouseEvent, TouchOrMouseEvent } from './events/index';\nexport { isTouchEvent, isMouseEvent, getEventClientCoords } from './events/index';\n\nexport type {\n  SelectionMode,\n  OnSelectionChangeCallback,\n  OnSelectionChangeData,\n  SelectionItemId,\n  SelectionHookParams,\n  SelectionMethods,\n} from './selection/index';\nexport { useSelection } from './selection/index';\n\nexport { elementContains, setVirtualParent, getParent } from './virtualParent/index';\n"],"names":["IdPrefixProvider","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","SSRProvider","applyTriggerPropsToChildren","assertSlots","canUseDOM","clamp","createPriorityQueue","elementContains","getEventClientCoords","getIntrinsicElementProps","getNativeElementProps","getParent","getPartitionedNativeProps","getRTLSafeKey","getSlots","getSlotsNext","getTriggerChild","isFluentTrigger","isHTMLElement","isInteractiveHTMLElement","isMouseEvent","isResolvedShorthand","isSlot","isTouchEvent","mergeCallbacks","omit","resetIdsForTests","resolveShorthand","setVirtualParent","slot","useAnimationFrame","useControllableState","useEventCallback","useFirstMount","useForceUpdate","useId","useIsSSR","useIsomorphicLayoutEffect","useMergedRefs","useOnClickOutside","useOnScrollOutside","usePrevious","useScrollbarWidth","useSelection","useTimeout"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAwCEA,gBAAgB;eAAhBA,wBAAgB;;IA5BhBC,wBAAwB;eAAxBA,+BAAwB;;IACxBC,2BAA2B;eAA3BA,kCAA2B;;IA6CCC,WAAW;eAAXA,mBAAW;;IAmBhCC,2BAA2B;eAA3BA,mCAA2B;;IAtElCC,WAAW;eAAXA,kBAAW;;IAmDJC,SAAS;eAATA,iBAAS;;IAGhBC,KAAK;eAALA,aAAK;;IASLC,mBAAmB;eAAnBA,2BAAmB;;IA2BZC,eAAe;eAAfA,uBAAe;;IAZaC,oBAAoB;eAApBA,4BAAoB;;IA1EvDC,wBAAwB;eAAxBA,+BAAwB;;IAmDxB,4DAA4D;IAC5DC,qBAAqB;eAArBA,6BAAqB;;IAkCqBC,SAAS;eAATA,iBAAS;;IAjCnDC,yBAAyB;eAAzBA,iCAAyB;;IACzBC,aAAa;eAAbA,qBAAa;;IA9Db,4DAA4D;IAC5DC,QAAQ;eAARA,eAAQ;;IACR,4DAA4D;IAC5DC,YAAY;eAAZA,mBAAY;;IAuEwBC,eAAe;eAAfA,uBAAe;;IAAEC,eAAe;eAAfA,uBAAe;;IAVpEC,aAAa;eAAbA,qBAAa;;IACbC,wBAAwB;eAAxBA,gCAAwB;;IAiBHC,YAAY;eAAZA,oBAAY;;IA3EjCC,mBAAmB;eAAnBA,0BAAmB;;IARnBC,MAAM;eAANA,aAAM;;IAmFCC,YAAY;eAAZA,oBAAY;;IAnBnBC,cAAc;eAAdA,sBAAc;;IAGdC,IAAI;eAAJA,YAAI;;IA5BJC,gBAAgB;eAAhBA,wBAAgB;;IAjChB,4DAA4D;IAC5DC,gBAAgB;eAAhBA,uBAAgB;;IAwFQC,gBAAgB;eAAhBA,wBAAgB;;IAhGxCC,IAAI;eAAJA,WAAI;;IAyCJC,iBAAiB;eAAjBA,yBAAiB;;IACjBC,oBAAoB;eAApBA,4BAAoB;;IACpBC,gBAAgB;eAAhBA,wBAAgB;;IAChBC,aAAa;eAAbA,qBAAa;;IACbC,cAAc;eAAdA,sBAAc;;IACdC,KAAK;eAALA,aAAK;;IAWaC,QAAQ;eAARA,gBAAQ;;IAV1BC,yBAAyB;eAAzBA,iCAAyB;;IACzBC,aAAa;eAAbA,qBAAa;;IACbC,iBAAiB;eAAjBA,yBAAiB;;IACjBC,kBAAkB;eAAlBA,0BAAkB;;IAClBC,WAAW;eAAXA,mBAAW;;IACXC,iBAAiB;eAAjBA,yBAAiB;;IA0CVC,YAAY;eAAZA,oBAAY;;IAzCnBC,UAAU;eAAVA,kBAAU;;;uBAxCL;wBAyCA;wBAG0C;wBAa1C;wBAMuE;wBAQb;wBAUpC;wBAEgC"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  slot,\n  isSlot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getSlotsNext,\n  assertSlots,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  resolveShorthand,\n  isResolvedShorthand,\n  getIntrinsicElementProps,\n  getSlotClassNameProp_unstable,\n  SLOT_CLASS_NAME_PROP_SYMBOL,\n  SLOT_ELEMENT_TYPE_SYMBOL,\n  SLOT_RENDER_FUNCTION_SYMBOL,\n} from './compose/index';\nexport type {\n  ExtractSlotProps,\n  ComponentProps,\n  ComponentState,\n  ForwardRefComponent,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandFunction,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ResolveShorthandOptions,\n  Slot,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  Slots,\n  SlotClassNames,\n  SlotPropsRecord,\n  SlotRenderFunction,\n  SlotShorthandValue,\n  UnknownSlotProps,\n  SlotComponentType,\n  SlotOptions,\n  InferredElementRefType,\n  EventData,\n  EventHandler,\n} from './compose/index';\n\nexport {\n  IdPrefixProvider,\n  resetIdsForTests,\n  useAnimationFrame,\n  useControllableState,\n  useEventCallback,\n  useFirstMount,\n  useForceUpdate,\n  useId,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n  useOnClickOutside,\n  useOnScrollOutside,\n  usePrevious,\n  useScrollbarWidth,\n  useTimeout,\n} from './hooks/index';\nexport type { RefObjectFunction, UseControllableStateOptions, UseOnClickOrScrollOutsideOptions } from './hooks/index';\n\nexport { canUseDOM, useIsSSR, SSRProvider } from './ssr/index';\n\nexport {\n  clamp,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  getNativeElementProps,\n  getPartitionedNativeProps,\n  getRTLSafeKey,\n  mergeCallbacks,\n  isHTMLElement,\n  isInteractiveHTMLElement,\n  omit,\n  createPriorityQueue,\n} from './utils/index';\n\nexport type { DistributiveOmit, UnionToIntersection } from './utils/types';\n\nexport type { PriorityQueue } from './utils/priorityQueue';\n\nexport { applyTriggerPropsToChildren, getTriggerChild, isFluentTrigger } from './trigger/index';\n\nexport type { FluentTriggerComponent, TriggerProps } from './trigger/index';\n\n/**\n * Event utils\n */\nexport type { NativeTouchOrMouseEvent, ReactTouchOrMouseEvent, TouchOrMouseEvent } from './events/index';\nexport { isTouchEvent, isMouseEvent, getEventClientCoords } from './events/index';\n\nexport type {\n  SelectionMode,\n  OnSelectionChangeCallback,\n  OnSelectionChangeData,\n  SelectionItemId,\n  SelectionHookParams,\n  SelectionMethods,\n} from './selection/index';\nexport { useSelection } from './selection/index';\n\nexport { elementContains, setVirtualParent, getParent } from './virtualParent/index';\n"],"names":["IdPrefixProvider","SLOT_CLASS_NAME_PROP_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","SSRProvider","applyTriggerPropsToChildren","assertSlots","canUseDOM","clamp","createPriorityQueue","elementContains","getEventClientCoords","getIntrinsicElementProps","getNativeElementProps","getParent","getPartitionedNativeProps","getRTLSafeKey","getSlotClassNameProp_unstable","getSlots","getSlotsNext","getTriggerChild","isFluentTrigger","isHTMLElement","isInteractiveHTMLElement","isMouseEvent","isResolvedShorthand","isSlot","isTouchEvent","mergeCallbacks","omit","resetIdsForTests","resolveShorthand","setVirtualParent","slot","useAnimationFrame","useControllableState","useEventCallback","useFirstMount","useForceUpdate","useId","useIsSSR","useIsomorphicLayoutEffect","useMergedRefs","useOnClickOutside","useOnScrollOutside","usePrevious","useScrollbarWidth","useSelection","useTimeout"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA0CEA,gBAAgB;eAAhBA,wBAAgB;;IA7BhBC,2BAA2B;eAA3BA,kCAA2B;;IAC3BC,wBAAwB;eAAxBA,+BAAwB;;IACxBC,2BAA2B;eAA3BA,kCAA2B;;IA6CCC,WAAW;eAAXA,mBAAW;;IAmBhCC,2BAA2B;eAA3BA,mCAA2B;;IAxElCC,WAAW;eAAXA,kBAAW;;IAqDJC,SAAS;eAATA,iBAAS;;IAGhBC,KAAK;eAALA,aAAK;;IASLC,mBAAmB;eAAnBA,2BAAmB;;IA2BZC,eAAe;eAAfA,uBAAe;;IAZaC,oBAAoB;eAApBA,4BAAoB;;IA5EvDC,wBAAwB;eAAxBA,+BAAwB;;IAqDxB,4DAA4D;IAC5DC,qBAAqB;eAArBA,6BAAqB;;IAkCqBC,SAAS;eAATA,iBAAS;;IAjCnDC,yBAAyB;eAAzBA,iCAAyB;;IACzBC,aAAa;eAAbA,qBAAa;;IAvDbC,6BAA6B;eAA7BA,oCAA6B;;IAT7B,4DAA4D;IAC5DC,QAAQ;eAARA,eAAQ;;IACR,4DAA4D;IAC5DC,YAAY;eAAZA,mBAAY;;IAyEwBC,eAAe;eAAfA,uBAAe;;IAAEC,eAAe;eAAfA,uBAAe;;IAVpEC,aAAa;eAAbA,qBAAa;;IACbC,wBAAwB;eAAxBA,gCAAwB;;IAiBHC,YAAY;eAAZA,oBAAY;;IA7EjCC,mBAAmB;eAAnBA,0BAAmB;;IARnBC,MAAM;eAANA,aAAM;;IAqFCC,YAAY;eAAZA,oBAAY;;IAnBnBC,cAAc;eAAdA,sBAAc;;IAGdC,IAAI;eAAJA,YAAI;;IA5BJC,gBAAgB;eAAhBA,wBAAgB;;IAnChB,4DAA4D;IAC5DC,gBAAgB;eAAhBA,uBAAgB;;IA0FQC,gBAAgB;eAAhBA,wBAAgB;;IAlGxCC,IAAI;eAAJA,WAAI;;IA2CJC,iBAAiB;eAAjBA,yBAAiB;;IACjBC,oBAAoB;eAApBA,4BAAoB;;IACpBC,gBAAgB;eAAhBA,wBAAgB;;IAChBC,aAAa;eAAbA,qBAAa;;IACbC,cAAc;eAAdA,sBAAc;;IACdC,KAAK;eAALA,aAAK;;IAWaC,QAAQ;eAARA,gBAAQ;;IAV1BC,yBAAyB;eAAzBA,iCAAyB;;IACzBC,aAAa;eAAbA,qBAAa;;IACbC,iBAAiB;eAAjBA,yBAAiB;;IACjBC,kBAAkB;eAAlBA,0BAAkB;;IAClBC,WAAW;eAAXA,mBAAW;;IACXC,iBAAiB;eAAjBA,yBAAiB;;IA0CVC,YAAY;eAAZA,oBAAY;;IAzCnBC,UAAU;eAAVA,kBAAU;;;uBAxCL;wBAyCA;wBAG0C;wBAa1C;wBAMuE;wBAQb;wBAUpC;wBAEgC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-utilities",
-  "version": "9.18.23",
+  "version": "9.19.0",
   "description": "A set of general React-specific utilities.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",