@fluentui/react-field 9.0.0-alpha.8 → 9.0.0-beta.1

package/lib-commonjs/util/makeDeprecatedField.js

@@ -0,0 +1,61 @@
+/* eslint-disable deprecation/deprecation */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    makeDeprecatedField: ()=>makeDeprecatedField,
+    getDeprecatedFieldClassNames: ()=>getDeprecatedFieldClassNames
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _field = require("../Field");
+/**
+ * Partition the props used by the Field itself, from the props that are passed to the underlying field component.
+ */ function getPartitionedFieldProps(props) {
+    const { className , control , hint , label , orientation , required , root , size , style , validationMessage , validationMessageIcon , validationState ='none' , ...restOfProps } = props;
+    return [
+        {
+            className,
+            hint,
+            label,
+            orientation,
+            required,
+            size,
+            style,
+            validationMessage,
+            validationMessageIcon,
+            validationState,
+            ...root
+        },
+        {
+            required,
+            size,
+            ...restOfProps,
+            ...control
+        }
+    ];
+}
+function makeDeprecatedField(Control, options = {}) {
+    const { mapProps =(props)=>props , displayName =`${Control.displayName}Field`  } = options;
+    const DeprecatedField = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+        const [fieldProps, controlProps] = getPartitionedFieldProps(mapProps(props));
+        return /*#__PURE__*/ _react.createElement(_field.Field, fieldProps, /*#__PURE__*/ _react.createElement(Control, {
+            ...controlProps,
+            ref: ref
+        }));
+    });
+    DeprecatedField.displayName = displayName;
+    return DeprecatedField;
+}
+const getDeprecatedFieldClassNames = (controlRootClassName)=>({
+        ..._field.fieldClassNames,
+        control: controlRootClassName
+    }); //# sourceMappingURL=makeDeprecatedField.js.map
+
+//# sourceMappingURL=makeDeprecatedField.js.map

package/lib-commonjs/util/makeDeprecatedField.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../lib/util/makeDeprecatedField.js"],"sourcesContent":["/* eslint-disable deprecation/deprecation */import * as React from 'react';\nimport { Field, fieldClassNames } from '../Field';\n/**\n * Partition the props used by the Field itself, from the props that are passed to the underlying field component.\n */\nfunction getPartitionedFieldProps(props) {\n  const {\n    className,\n    control,\n    hint,\n    label,\n    orientation,\n    required,\n    root,\n    size,\n    style,\n    validationMessage,\n    validationMessageIcon,\n    validationState = 'none',\n    ...restOfProps\n  } = props;\n  return [{\n    className,\n    hint,\n    label,\n    orientation,\n    required,\n    size,\n    style,\n    validationMessage,\n    validationMessageIcon,\n    validationState,\n    ...root\n  }, {\n    required,\n    size,\n    ...restOfProps,\n    ...control\n  }];\n}\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport function makeDeprecatedField(Control, options = {}) {\n  const {\n    mapProps = props => props,\n    displayName = `${Control.displayName}Field`\n  } = options;\n  const DeprecatedField = /*#__PURE__*/React.forwardRef((props, ref) => {\n    const [fieldProps, controlProps] = getPartitionedFieldProps(mapProps(props));\n    return /*#__PURE__*/React.createElement(Field, fieldProps, /*#__PURE__*/React.createElement(Control, {\n      ...controlProps,\n      ref: ref\n    }));\n  });\n  DeprecatedField.displayName = displayName;\n  return DeprecatedField;\n}\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport const getDeprecatedFieldClassNames = controlRootClassName => ({\n  ...fieldClassNames,\n  control: controlRootClassName\n});\n//# sourceMappingURL=makeDeprecatedField.js.map"],"names":["makeDeprecatedField","getDeprecatedFieldClassNames","getPartitionedFieldProps","props","className","control","hint","label","orientation","required","root","size","style","validationMessage","validationMessageIcon","validationState","restOfProps","Control","options","mapProps","displayName","DeprecatedField","React","forwardRef","ref","fieldProps","controlProps","createElement","Field","controlRootClassName","fieldClassNames"],"mappings":"AAAA,0CAA0C;;;;;;;;;;;IA4C1BA,mBAAmB,MAAnBA;IAmBHC,4BAA4B,MAA5BA;;;6DA/DsD;uBAC5B;AACvC;;CAEC,GACD,SAASC,yBAAyBC,KAAK,EAAE;IACvC,MAAM,EACJC,UAAS,EACTC,QAAO,EACPC,KAAI,EACJC,MAAK,EACLC,YAAW,EACXC,SAAQ,EACRC,KAAI,EACJC,KAAI,EACJC,MAAK,EACLC,kBAAiB,EACjBC,sBAAqB,EACrBC,iBAAkB,OAAM,EACxB,GAAGC,aACJ,GAAGb;IACJ,OAAO;QAAC;YACNC;YACAE;YACAC;YACAC;YACAC;YACAE;YACAC;YACAC;YACAC;YACAC;YACA,GAAGL,IAAI;QACT;QAAG;YACDD;YACAE;YACA,GAAGK,WAAW;YACd,GAAGX,OAAO;QACZ;KAAE;AACJ;AAKO,SAASL,oBAAoBiB,OAAO,EAAEC,UAAU,CAAC,CAAC,EAAE;IACzD,MAAM,EACJC,UAAWhB,CAAAA,QAASA,MAAK,EACzBiB,aAAc,CAAC,EAAEH,QAAQG,WAAW,CAAC,KAAK,CAAC,CAAA,EAC5C,GAAGF;IACJ,MAAMG,kBAAkB,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACpB,OAAOqB,MAAQ;QACpE,MAAM,CAACC,YAAYC,aAAa,GAAGxB,yBAAyBiB,SAAShB;QACrE,OAAO,WAAW,GAAEmB,OAAMK,aAAa,CAACC,YAAK,EAAEH,YAAY,WAAW,GAAEH,OAAMK,aAAa,CAACV,SAAS;YACnG,GAAGS,YAAY;YACfF,KAAKA;QACP;IACF;IACAH,gBAAgBD,WAAW,GAAGA;IAC9B,OAAOC;AACT;AAKO,MAAMpB,+BAA+B4B,CAAAA,uBAAyB,CAAA;QACnE,GAAGC,sBAAe;QAClBzB,SAASwB;IACX,CAAA,GACA,+CAA+C"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-field",
-  "version": "9.0.0-alpha.8",
+  "version": "9.0.0-beta.1",
   "description": "Fluent UI Field components",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -13,6 +13,7 @@
   "license": "MIT",
   "scripts": {
     "build": "just-scripts build",
+    "bundle-size": "bundle-size measure",
     "clean": "just-scripts clean",
     "code-style": "just-scripts code-style",
     "just": "just-scripts",
@@ -20,24 +21,24 @@
     "start": "yarn storybook",
     "storybook": "start-storybook",
     "test": "jest --passWithNoTests",
-    "docs": "api-extractor run --config=config/api-extractor.local.json --local",
-    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/types/packages/react-components/react-field/src && yarn docs",
-    "type-check": "tsc -b tsconfig.json"
+    "type-check": "tsc -b tsconfig.json",
+    "generate-api": "just-scripts generate-api"
   },
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "9.0.0-beta.18",
-    "@fluentui/scripts": "^1.0.0"
+    "@fluentui/react-conformance-griffel": "9.0.0-beta.20",
+    "@fluentui/scripts-api-extractor": "*",
+    "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-context-selector": "^9.1.1",
-    "@fluentui/react-icons": "^2.0.175",
-    "@fluentui/react-label": "^9.0.10",
-    "@fluentui/react-theme": "^9.1.2",
-    "@fluentui/react-utilities": "^9.2.1",
-    "@griffel/react": "^1.4.2",
-    "tslib": "^2.1.0"
+    "@fluentui/react-context-selector": "^9.1.16",
+    "@fluentui/react-icons": "^2.0.196",
+    "@fluentui/react-label": "^9.1.7",
+    "@fluentui/react-theme": "^9.1.7",
+    "@fluentui/react-utilities": "^9.7.3",
+    "@griffel/react": "^1.5.2",
+    "@swc/helpers": "^0.4.14"
   },
   "peerDependencies": {
     "@types/react": ">=16.8.0 <19.0.0",
@@ -55,6 +56,7 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
+      "node": "./lib-commonjs/index.js",
       "import": "./lib/index.js",
       "require": "./lib-commonjs/index.js"
     },

package/Spec.md

@@ -1,354 +0,0 @@
-# @fluentui/react-field Spec
-
-## Background
-
-Field adds a label, validation text, and hint text to form input components. The existing input components (such as `Input` and `Combobox`) are wrapped to create field versions of them (such as `InputField` and `ComboboxField`).
-
-Epic issue tracking implementation: https://github.com/microsoft/fluentui/issues/19627
-
-## Prior Art
-
-Existing libraries tend to take one of the following approaches to field.
-
-1. Include support for label, error text, etc. in the base input component. Libraries using this approach include:
-   - **FluentUI v8** - [`TextField`](https://developer.microsoft.com/en-us/fluentui#/controls/web/textfield), [`Dropdown`](https://developer.microsoft.com/en-us/fluentui#/controls/web/dropdown), [`ChoiceGroup`](https://developer.microsoft.com/en-us/fluentui#/controls/web/choicegroup), etc.
-   - **Spectrum** - [`TextField`](https://react-spectrum.adobe.com/react-spectrum/TextField.html), [`Slider`](https://react-spectrum.adobe.com/react-spectrum/Slider.html), [`RadioGroup`](https://react-spectrum.adobe.com/react-spectrum/RadioGroup.html), etc.
-2. Provide a set of components that are manually constructed into a field. This requires manually hooking up the components using props like `htmlFor` and `aria-describedby`. Libraries using this approach include:
-   - **FluentUI v0** - [`FormField`](https://fluentsite.z22.web.core.windows.net/0.64.0/components/form/props#form-field), [`FormLabel`](https://fluentsite.z22.web.core.windows.net/0.64.0/components/form/props#form-label), [`FormMessage`](https://fluentsite.z22.web.core.windows.net/0.64.0/components/form/props#form-message)
-   - **Ant** - [`Form.Item`](https://ant.design/components/form/#Form.Item) (uses context to do some of the hooking up between the item and the field component).
-3. Provide base components without a label or descriptive text, and then Field versions of those controls. Libraries using this approach include:
-   - **FluentUI v0** - [`Input`](https://fluentsite.z22.web.core.windows.net/0.64.0/components/input/props) and [`FormInput`](https://fluentsite.z22.web.core.windows.net/0.64.0/components/form/props#form-input), for example.
-   - **Evergreen UI** - [`TextInput`](https://evergreen.segment.com/components/text-input) and [`TextInputField`](https://evergreen.segment.com/components/text-input#textinputfield), for example.
-
-The Field implementation in this spec follows pattern (3). There are Field versions of all components that can be used as form inputs. There are several reasons, including:
-
-- **Accessibility**: By combining a base component with the field props into a single component, all of the accessibility props like `htmlFor` and `aria-describedby` are set correctly for "free".
-- **Simplicity**: All props related to the component (such as `label`, `id`, `validationState="error"`, etc.) are on the same component, rather than split between multiple components (like separate `Field` and `Input` components).
-- **Consistency**: All of the Field components share a common set of props for the label, validationState, hint, etc.
-- **Bundle size**: When the label and other field functionality is not needed, it is still possible to use the base components without pulling in unnecessary dependencies (like `Label` and the field styling).
-
-## Sample Code
-
-Each input component has a field version (such as `InputField`, `ComboboxField`, etc.) that includes the features of Field added to that component.
-
-```jsx
-<>
-  <InputField
-    // Field-specific props
-    label="This is the field label"
-    orientation="horizontal"
-    validationState="error"
-    validationMessage="This is error text"
-    // All props and slots of the underlying Input component are supported
-    required
-    size="small"
-    contentBefore="$"
-    contentAfter=".00"
-  />
-  <RadioGroupField label="Radio group field">
-    <Radio value="one" label="Option one" />
-    <Radio value="two" label="Option two" />
-    <Radio value="three" label="Option three" />
-  </RadioGroupField>
-  <ComboboxField label="Combobox field" validationState="success" validationMessage="Success text">
-    <Option value="one">Option one</Option>
-    <Option value="two">Option two</Option>
-    <Option value="three">Option three</Option>
-  </ComboboxField>
-  <SliderField label="Slider field" validationState="warning" validationMessage="Warning text" />
-  <SpinButtonField label="Spin button field" hint="Hint text" />
-</>
-```
-
-These field versions of the components use a common set of Field hooks, and can be defined using very little code.
-
-```ts
-export type InputFieldProps = FieldProps<typeof Input>;
-
-export const InputField: ForwardRefComponent<InputFieldProps> = React.forwardRef((props, ref) => {
-  const state = useField_unstable(props, ref, Input);
-  useFieldStyles_unstable(state);
-  return renderField_unstable(state);
-});
-
-InputField.displayName = 'InputField';
-```
-
-## Components
-
-The following field components will be defined. If more form components are added in the future, they should also include a Field version.
-
-- `CheckboxField`
-- `ComboboxField`
-- `DropdownField`
-- `InputField`
-- `RadioGroupField`
-- `SelectField`
-- `SliderField`
-- `SpinButtonField`
-- `SwitchField`
-- `TextareaField`
-
-## Variants
-
-- **Orientation**: The `orientation` prop affects the layout of the label and field component:
-  - `'vertical'` (default) - label is above the field component
-  - `'horizontal'` - label is to the left of the field component, and is 33% the width of the field (this allows multiple stacked fields to all align their labels)
-- **Validation state**: The `validationState` prop affects the icon and color used by the `validationMessage`:
-  - `'error'` - Red x icon, red text color
-  - `'warning'` - Yellow exclamation icon, neutral color text
-  - `'success'` - Green check icon, neutral color text
-  - `undefined` (default): No validation message icon, neutral color text
-- **Error**: Some control types (like `Input` and `Combobox`) have a prop that makes the border red. This prop will be set `validationState="error"`.
-
-Field also forwards some props from the wrapped component to the label as well:
-
-- **Size**: If the wrapped component supports a `size` prop, it will also be applied to the field's label.
-- **Required**: If set, the Label will get a required asterisk: `*`
-
-## API
-
-### FieldComponent
-
-The `FieldComponent` type defines the minimum set of props that the wrapped component must support. This is used for the generic types as the requirement for the type parameter: `FieldProps<T extends FieldComponent>`
-
-```ts
-/**
- * The minimum requirement for a component used by Field.
- *
- * Note: the use of VoidFunctionComponent means that component is not *required* to have a children prop,
- * but it is still allowed to have a children prop.
- */
-export type FieldComponent = React.VoidFunctionComponent<
-  Pick<
-    React.HTMLAttributes<HTMLElement>,
-    'id' | 'className' | 'style' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-errormessage'
-  >
->;
-```
-
-### Slots
-
-_Note: TypeScript crashes if the `Slot` type is used with a template type parameter. The `SlotComponent` type is a simplified version of that type, which only supports `React.ComponentType`/`React.VoidFunctionComponent`._
-
-```ts
-export type FieldSlots<T extends FieldComponent> = {
-  root: NonNullable<Slot<'div'>>;
-
-  /**
-   * The underlying component wrapped by this field.
-   *
-   * This is the PRIMARY slot: all intrinsic HTML properties will be applied to this slot,
-   * except `className` and `style`, which remain on the root slot.
-   */
-  control: SlotComponent<T>;
-
-  /**
-   * The label associated with the field.
-   */
-  label?: Slot<typeof Label>;
-
-  /**
-   * A message about the validation state. The appearance of the `validationMessage` depends on `validationState`.
-   */
-  validationMessage?: Slot<'span'>;
-
-  /**
-   * The icon associated with the `validationMessage`. If the `validationState` prop is set, this will default to an
-   * icon corresponding to that state.
-   *
-   * This will only be displayed if `validationMessage` is set.
-   */
-  validationMessageIcon?: Slot<'span'>;
-
-  /**
-   * Additional hint text below the field.
-   */
-  hint?: Slot<'span'>;
-};
-```
-
-### Props
-
-```ts
-export type FieldProps<T extends FieldComponent> = ComponentProps<Partial<FieldSlots<T>>, 'control'> & {
-  /**
-   * The orientation of the label relative to the field component.
-   * This only affects the label, and not the validationMessage or hint (which always appear below the field component).
-   *
-   * @default vertical
-   */
-  orientation?: 'vertical' | 'horizontal';
-
-  /**
-   * The `validationState` affects the color of the `validationMessage`, the `validationMessageIcon`, and for some
-   * field components, an `validationState="error"` causes the border to become red.
-   *
-   * @default undefined
-   */
-  validationState?: 'error' | 'warning' | 'success';
-};
-```
-
-Field also reads some props from the underlying component. These are not part of `FieldProps` because they are not added to the components that don't support them. However, they are accepted by `useField`:
-
-```ts
-/**
- * Props that are supported by Field, but not required to be supported by the component that implements field.
- */
-export type OptionalFieldComponentProps = {
-  /**
-   * Whether the field label should be marked as required.
-   */
-  required?: boolean;
-
-  /**
-   * Size of the field label.
-   *
-   * Number sizes will be ignored, but are allowed because the HTML <input> element has a `size` prop of type `number`.
-   */
-  size?: 'small' | 'medium' | 'large' | number;
-};
-```
-
-### State
-
-```ts
-export type FieldState<T extends FieldComponent> = ComponentState<Required<FieldSlots<T>>> &
-  Pick<FieldProps<T>, 'orientation' | 'validationState'> & {
-    classNames: SlotClassNames<FieldSlots<T>>;
-  };
-```
-
-### Label for Checkbox and Switch
-
-The Checkbox and Switch components already have a `label` prop, which conflicts with the Field's `label`.
-
-#### `CheckboxField`
-
-- The `label` prop will go to the Checkbox and NOT the Field
-- New `fieldLabel` prop for the label of the Field
-
-#### `SwitchField`
-
-- The `label` prop will go to the Field and NOT the Switch
-- The Switch's `labelPosition` prop is therefore not supported, and is omitted from SwitchField.
-
-## Structure
-
-### Public API
-
-```jsx
-<InputField
-  label="This is the field label"
-  orientation="horizontal"
-  validationState="error"
-  validationMessage="This is a validation message"
-  hint="This is a hint message"
-/>
-```
-
-(similar API for other Field components)
-
-### Slot structure
-
-```jsx
-<slots.root>
-  <slots.label {...slotProps.label} />
-  <slots.control {...slotProps.control} />
-  <slots.validationMessage {...slotProps.validationMessage}>
-    <slots.validationMessageIcon {...slotProps.validationMessageIcon} />
-    {slotProps.validationMessage.children}
-  </slots.validationMessage>
-  <slots.hint {...slotProps.hint} />
-</slots.root>
-```
-
-### DOM structure
-
-```html
-<div className="fui-Field">
-  <label className="fui-Field__label fui-Label">This is the field label</label>
-  <!-- wrapped field component goes here -->
-  <span className="fui-Field__validationMessage">
-    <span className="fui-Field__validationMessageIcon"><svg>...</svg></span>
-    This is a validation message
-  </span>
-  <span className="fui-Field__hint">This is a hint message</span>
-</div>
-```
-
-## Migration
-
-### Migration from v8
-
-Migration from v8 will require picking between the normal and `Field` version of an input control, depending on whether the field-specific features are required: (`label`, `validationState="error"`, `validationMessage`, `hint`)
-
-See individual input components for more detailed migration guides.
-
-| v8 Control    | v9 Base control       | v9 Field control                | Notes                                                                                        |
-| ------------- | --------------------- | ------------------------------- | -------------------------------------------------------------------------------------------- |
-| `Checkbox`    | `Checkbox`            | `CheckboxField`                 | Only use `CheckboxField` if an error message is needed, or if required for layout in a form. |
-| `ChoiceGroup` | `RadioGroup`          | `RadioGroupField`               |                                                                                              |
-| `ComboBox`    | `Combobox`            | `ComboboxField`                 | `errorMessage="..."` is replaced by `validationState="error" validationMessage="..."`        |
-| `Dropdown`    | `Dropdown`            | `DropdownField`                 | `errorMessage="..."` is replaced by `validationState="error" validationMessage="..."`        |
-| `Slider`      | `Slider`              | `SliderField`                   |                                                                                              |
-| `SpinButton`  | `SpinButton`          | `SpinButtonField`               |                                                                                              |
-| `TextField`   | `Input` OR `Textarea` | `InputField` OR `TextareaField` | `errorMessage="..."` is replaced by `validationState="error" validationMessage="..."`        |
-| `Toggle`      | `Switch`              | `SwitchField`                   |                                                                                              |
-
-### Migration from v0
-
-Many components in v0 have `Form___` versions (such as `FormInput`). Those are replaced by the `___Field` equivalent. See the underlying component's migration guides for more detailed migration information.
-
-Component mapping:
-
-- `FormButton` => Not supported
-- `FormCheckbox` => `CheckboxField` OR `SwitchField`
-- `FormDatepicker` => _(Not yet implemented)_
-- `FormDropdown` => `DropdownField`
-- `FormField` => Not supported
-- `FormFieldCustom` => Not supported
-- `FormLabel` => The `label` prop of the field component
-- `FormMessage` => Either the `validationMessage` or `hint` prop of the field component
-- `FormRadioGroup` => `RadioGroupField`
-- `FormSlider` => `SliderField`
-- `FormTextArea` => `TextareaField`
-
-The following props are common to each of the `Form___` components:
-
-- `label` => `label`
-- `message` => either `validationMessage` or `hint`
-- `errorMessage` => `validationMessage` with `validationState="error"`
-
-## Behaviors
-
-### Form validation
-
-Field has no logic to perform input validation. It is expected that the validation will be done externally (possibly using a third party form validation library like Formik).
-
-### Interaction
-
-The Field itself is not interactive. The wrapped component has the same interactions as it does outside of a field.
-
-## Accessibility
-
-- **ARIA pattern**
-  - Field itself does not implement a defined ARIA pattern. It has no role applied to the root element.
-- **Attributes**
-  - The following are applied on the wrapped component:
-    - `aria-labelledby={label.id}`, if the label is present.
-    - `aria-describedby` is set to one of:
-      - `aria-describedby={validationMessage.id}`, if validationMessage is present, and _only if_ `validationState !== 'error'`
-      - `aria-describedby={hint.id}`, if hint is present
-      - `aria-describedby={validationMessage.id + ' ' + hint.id}`, if both conditions above apply
-    - `aria-errormessage={validationMessage.id}`, if validationMessage is present, and _only if_ `validationState === 'error'`
-    - `aria-invalid={true}`, _only if_ `validationState === 'error'`
-  - On the `label` slot:
-    - `htmlFor={control.id}` - the wrapped component's `id` (an ID is generated if not supplied via props).
-- **Live regions** (state change announcements)
-  - TBD: Need to determine if the validation message should be an aria live region.
-- **UI parts appearing on hover or focus**
-  - None.
-- **Focus behavior**
-  - No special focus behavior: no focus trapping or programmatic focus moving.

package/lib/components/Field/SlotComponent.types.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=SlotComponent.types.js.map

package/lib/components/Field/SlotComponent.types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SlotComponent.types.js","sourceRoot":"../src/","sources":["components/Field/SlotComponent.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { SlotShorthandValue, SlotRenderFunction } from '@fluentui/react-utilities';\n\n//\n// TEMPORARY definition of the SlotComponent type, until it is available from react-utilities\n//\n\nexport type SlotComponent<Type extends React.ComponentType | React.VoidFunctionComponent> = WithSlotShorthandValue<\n  Type extends React.ComponentType<infer Props>\n    ? // If this is a VoidFunctionComponent that doesn't allow children, add { children?: never }\n      WithSlotRenderFunction<Props extends { children?: unknown } ? Props : Props & { children?: never }>\n    : never\n>;\n\n//\n// TEMPORARY copied versions of the non-exported helper types from react-utilities\n//\n\ntype WithSlotShorthandValue<Props extends { children?: unknown }> =\n  | Props\n  | Extract<SlotShorthandValue, Props['children']>;\n\ntype WithSlotRenderFunction<Props extends { children?: unknown }> = Props & {\n  children?: Props['children'] | SlotRenderFunction<Props>;\n};\n"]}

package/lib-commonjs/components/Field/SlotComponent.types.js

@@ -1,6 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-//# sourceMappingURL=SlotComponent.types.js.map

package/lib-commonjs/components/Field/SlotComponent.types.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}