@fluentui/react-field 9.5.3 → 9.5.4

package/CHANGELOG.md

@@ -1,12 +1,27 @@
 # Change Log - @fluentui/react-field
 
-This log was last generated on Wed, 24 Jun 2026 11:03:32 GMT and should not be manually modified.
+<!-- This log was last generated on Tue, 11 Aug 2026 17:16:03 GMT and should not be manually modified. -->
 
 <!-- Start content -->
 
+## [9.5.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.5.4)
+
+Tue, 11 Aug 2026 17:16:03 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.5.3..@fluentui/react-field_v9.5.4)
+
+### Patches
+
+- Ship ESM-first (type:module): valid ESM under lib/, CommonJS under lib-commonjs/*.cjs, and drop the `node` export condition - bare-Node `import` resolves ESM, `require` resolves CJS; node-targeted bundlers tree-shake. ([PR #36327](https://github.com/microsoft/fluentui/pull/36327) by martinhochel@microsoft.com)
+- Bump @fluentui/react-context-selector to v9.2.19 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.4.5 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-label to v9.4.4 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.26.3 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-theme to v9.2.2 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-utilities to v9.26.6 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+
 ## [9.5.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.5.3)
 
-Wed, 24 Jun 2026 11:03:32 GMT 
+Wed, 24 Jun 2026 11:09:43 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.5.2..@fluentui/react-field_v9.5.3)
 
 ### Patches

package/dist/index.d.cts

@@ -0,0 +1,218 @@
+import type { ComponentProps } from '@fluentui/react-utilities';
+import type { ComponentState } from '@fluentui/react-utilities';
+import type { DistributiveOmit } from '@fluentui/react-utilities';
+import type { ForwardRefComponent } from '@fluentui/react-utilities';
+import type { JSXElement } from '@fluentui/react-utilities';
+import type { Label } from '@fluentui/react-label';
+import * as React_2 from 'react';
+import type { Slot } from '@fluentui/react-utilities';
+import type { SlotClassNames } from '@fluentui/react-utilities';
+
+export declare const Field: ForwardRefComponent<FieldProps>;
+
+export declare type FieldBaseProps = DistributiveOmit<FieldProps, 'orientation' | 'size'>;
+
+export declare type FieldBaseState = DistributiveOmit<FieldState, 'orientation' | 'size'>;
+
+export declare const fieldClassNames: SlotClassNames<FieldSlots>;
+
+export declare const FieldContextProvider: React_2.Provider<Readonly<Pick<FieldState, "required" | "size" | "orientation" | "validationState" | "generatedControlId"> & {
+    labelFor?: string;
+    labelId?: string;
+    validationMessageId?: string;
+    hintId?: string;
+}> | undefined>;
+
+export declare type FieldContextValue = Readonly<Pick<FieldState, 'generatedControlId' | 'orientation' | 'required' | 'size' | 'validationState'> & {
+    /** The label's for prop. Undefined if there is no label. */
+    labelFor?: string;
+    /** The label's id prop. Undefined if there is no label. */
+    labelId?: string;
+    /** The validationMessage's id prop. Undefined if there is no validationMessage. */
+    validationMessageId?: string;
+    /** The hint's id prop. Undefined if there is no hint. */
+    hintId?: string;
+}>;
+
+export declare type FieldContextValues = {
+    field: FieldContextValue;
+};
+
+/**
+ * The props added to the control inside the Field.
+ */
+export declare type FieldControlProps = Pick<React_2.HTMLAttributes<HTMLElement>, 'id' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-required'>;
+
+/**
+ * Options for `useFieldControlProps_unstable`.
+ */
+export declare type FieldControlPropsOptions = {
+    /**
+     * Skips setting `aria-labelledby` on the control if the `label.htmlFor` refers to the control.
+     *
+     * This should be used with controls that can be the target of a label's `for` prop:
+     * `<button>`, `<input>`, `<progress>`, `<select>`, `<textarea>`.
+     */
+    supportsLabelFor?: boolean;
+    /**
+     * Sets `required` instead of `aria-required` when the Field is marked required.
+     *
+     * This should be used with controls that support the `required` prop:
+     * `<input>` (except `range` or `color`), `<select>`, `<textarea>`.
+     */
+    supportsRequired?: boolean;
+    /**
+     * Sets the size prop on the control to match the Field's size: `'small' | 'medium' | 'large'`.
+     *
+     * This should be used with controls that have a custom size prop that matches the Field's size prop.
+     */
+    supportsSize?: boolean;
+};
+
+/**
+ * Field Props
+ */
+export declare type FieldProps = Omit<ComponentProps<FieldSlots>, 'children'> & {
+    /**
+     * The Field's child can be a single form control, or a render function that takes the props that should be spread on
+     * a form control.
+     *
+     * All form controls in this library can be used directly as children (such as `<Input>` or `<RadioGroup>`).
+     *
+     * For other controls, there are two options:
+     * 1. The child of Field can be a render function that is given the props that should be spread on the control.
+     *    `<Field>{(props) => <MyInput {...props} />}</Field>`
+     * 2. The control itself can merge props from field with useFieldControlProps_unstable().
+     *    `props = useFieldControlProps_unstable(props);`
+     */
+    children?: React_2.ReactNode | ((props: FieldControlProps) => React_2.ReactNode);
+    /**
+     * 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 display of the `validationMessage` and `validationMessageIcon`.
+     *
+     * * error: (default) The validation message has a red error icon and red text, with `role="alert"` so it is
+     *     announced by screen readers. Additionally, the control inside the field has `aria-invalid` set, which adds a
+     *     red border to some field components (such as `Input`).
+     * * success: The validation message has a green checkmark icon and gray text.
+     * * warning: The validation message has a yellow exclamation icon and gray text, with `role="alert"` so it is
+     *     announced by screen readers.
+     * * none: The validation message has no icon and gray text.
+     *
+     * @default error when validationMessage is set; none otherwise.
+     */
+    validationState?: 'error' | 'warning' | 'success' | 'none';
+    /**
+     * Marks the Field as required. If `true`, an asterisk will be appended to the label, and `aria-required` will be set
+     * on the Field's child.
+     */
+    required?: boolean;
+    /**
+     * The size of the Field's label.
+     *
+     * @default medium
+     */
+    size?: 'small' | 'medium' | 'large';
+};
+
+/**
+ * Slots of the Field component
+ */
+export declare type FieldSlots = {
+    root: NonNullable<Slot<'div'>>;
+    /**
+     * The label associated with the field.
+     */
+    label?: Slot<typeof Label>;
+    /**
+     * A message about the validation state. By default, this is an error message, but it can be a success, warning,
+     * or custom message by setting `validationState`.
+     */
+    validationMessage?: Slot<'div'>;
+    /**
+     * The icon associated with the `validationMessage`. This will only be displayed if `validationMessage` is set.
+     *
+     * The default depends on `validationState`:
+     * * error: `<ErrorCircle12Filled />`
+     * * warning: `<Warning12Filled />`
+     * * success: `<CheckmarkCircle12Filled />`
+     * * none: `null`
+     */
+    validationMessageIcon?: Slot<'span'>;
+    /**
+     * Additional hint text below the field.
+     */
+    hint?: Slot<'div'>;
+};
+
+/**
+ * State used in rendering Field
+ */
+export declare type FieldState = ComponentState<Required<FieldSlots>> & Required<Pick<FieldProps, 'orientation' | 'required' | 'size' | 'validationState'>> & Pick<FieldProps, 'children'> & {
+    /**
+     * The ID generated for the control inside the field, and the default value of label.htmlFor prop.
+     */
+    generatedControlId: string;
+};
+
+/**
+ * Render the final JSX of Field
+ */
+export declare const renderField_unstable: (state: FieldBaseState, contextValues: FieldContextValues) => JSXElement;
+
+/**
+ * Create the state required to render Field.
+ *
+ * The returned state can be modified with hooks such as useFieldStyles_unstable,
+ * before being passed to renderField_unstable.
+ *
+ * @param props - Props passed to this field
+ * @param ref - Ref to the root
+ */
+export declare const useField_unstable: (props: FieldProps, ref: React_2.Ref<HTMLDivElement>) => FieldState;
+
+/**
+ * Base hook for Field component, which manages state related to validation, ARIA attributes,
+ * ID generation, and slot structure without design props.
+ *
+ * @param props - Props passed to this field
+ * @param ref - Ref to the root
+ */
+export declare const useFieldBase_unstable: (props: FieldBaseProps, ref: React_2.Ref<HTMLDivElement>) => FieldBaseState;
+
+export declare const useFieldContext_unstable: () => FieldContextValue | undefined;
+
+/**
+ * Get the context values used when rendering Field.
+ */
+export declare const useFieldContextValues_unstable: (state: FieldState) => FieldContextValues;
+
+/**
+ * Gets the control props from the field context, if this inside a `<Field>`.
+ *
+ * When called with no arguments, returns the FieldControlProps that should be applied to the control.
+ *
+ * @returns A FieldControlProps object if inside a `<Field>`, otherwise undefined.
+ */
+export declare function useFieldControlProps_unstable(): FieldControlProps | undefined;
+
+/**
+ * Copies and merges the FieldControlProps with the given props, if this inside a `<Field>`.
+ *
+ * @param props - The existing props for the control. These will be merged with the control props from the field context.
+ * @param options - Option to include the size prop.
+ * @returns Merged props if inside a `<Field>`, otherwise the original props, or undefined if no props given.
+ */
+export declare function useFieldControlProps_unstable<Props extends FieldControlProps>(props: Props, options?: FieldControlPropsOptions): Props;
+
+/**
+ * Apply styling to the Field slots based on the state
+ */
+export declare const useFieldStyles_unstable: (state: FieldState) => FieldState;
+
+export { }

package/lib/Field.js

@@ -1 +1 @@
-export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable, useFieldBase_unstable } from './components/Field/index';
+export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable, useFieldBase_unstable } from "./components/Field/index.js";

package/lib/Field.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Field.ts"],"sourcesContent":["export type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './components/Field/index';\nexport {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './components/Field/index';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable"],"mappings":"AAUA,SACEA,KAAK,EACLC,eAAe,EACfC,oBAAoB,EACpBC,uBAAuB,EACvBC,iBAAiB,EACjBC,qBAAqB,QAChB,2BAA2B"}
+{"version":3,"sources":["../src/Field.ts"],"sourcesContent":["export type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './components/Field/index';\nexport {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './components/Field/index';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable"],"mappings":"AAUA,SACEA,KAAK,EACLC,eAAe,EACfC,oBAAoB,EACpBC,uBAAuB,EACvBC,iBAAiB,EACjBC,qBAAqB,QAChB,8BAA2B"}

package/lib/components/Field/Field.js

@@ -1,10 +1,10 @@
 'use client';
-import * as React from 'react';
-import { renderField_unstable } from './renderField';
-import { useField_unstable } from './useField';
-import { useFieldStyles_unstable } from './useFieldStyles.styles';
-import { useFieldContextValues_unstable } from '../../contexts/index';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { renderField_unstable } from "./renderField.js";
+import { useField_unstable } from "./useField.js";
+import { useFieldStyles_unstable } from "./useFieldStyles.styles.js";
+import { useFieldContextValues_unstable } from "../../contexts/index.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 export const Field = /*#__PURE__*/ React.forwardRef((props, ref)=>{
     const state = useField_unstable(props, ref);
     useFieldStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/Field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  useCustomStyleHook_unstable('useFieldStyles_unstable')(state);\n  const context = useFieldContextValues_unstable(state);\n  return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","useCustomStyleHook_unstable","Field","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,8BAA8B,QAAQ,uBAAuB;AACtE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,OAAO,MAAMC,sBAAyCN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC7E,MAAMC,QAAQR,kBAAkBM,OAAOC;IACvCN,wBAAwBO;IACxBL,4BAA4B,2BAA2BK;IACvD,MAAMC,UAAUP,+BAA+BM;IAC/C,OAAOT,qBAAqBS,OAAOC;AACrC,GAAG;AAEHL,MAAMM,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/Field/Field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  useCustomStyleHook_unstable('useFieldStyles_unstable')(state);\n  const context = useFieldContextValues_unstable(state);\n  return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","useCustomStyleHook_unstable","Field","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,oBAAoB,QAAQ,mBAAgB;AACrD,SAASC,iBAAiB,QAAQ,gBAAa;AAC/C,SAASC,uBAAuB,QAAQ,6BAA0B;AAClE,SAASC,8BAA8B,QAAQ,0BAAuB;AACtE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,OAAO,MAAMC,sBAAyCN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC7E,MAAMC,QAAQR,kBAAkBM,OAAOC;IACvCN,wBAAwBO;IACxBL,4BAA4B,2BAA2BK;IACvD,MAAMC,UAAUP,+BAA+BM;IAC/C,OAAOT,qBAAqBS,OAAOC;AACrC,GAAG;AAEHL,MAAMM,WAAW,GAAG"}

package/lib/components/Field/index.js

@@ -1,5 +1,5 @@
-export { Field } from './Field';
-export { renderField_unstable } from './renderField';
-export { useField_unstable } from './useField';
-export { useFieldBase_unstable } from './useFieldBase';
-export { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';
+export { Field } from "./Field.js";
+export { renderField_unstable } from "./renderField.js";
+export { useField_unstable } from "./useField.js";
+export { useFieldBase_unstable } from "./useFieldBase.js";
+export { fieldClassNames, useFieldStyles_unstable } from "./useFieldStyles.styles.js";

package/lib/components/Field/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/index.ts"],"sourcesContent":["export type {\n  FieldBaseProps,\n  FieldBaseState,\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n} from './Field.types';\nexport { Field } from './Field';\nexport { renderField_unstable } from './renderField';\nexport { useField_unstable } from './useField';\nexport { useFieldBase_unstable } from './useFieldBase';\nexport { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';\n"],"names":["Field","renderField_unstable","useField_unstable","useFieldBase_unstable","fieldClassNames","useFieldStyles_unstable"],"mappings":"AAUA,SAASA,KAAK,QAAQ,UAAU;AAChC,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,eAAe,EAAEC,uBAAuB,QAAQ,0BAA0B"}
+{"version":3,"sources":["../src/components/Field/index.ts"],"sourcesContent":["export type {\n  FieldBaseProps,\n  FieldBaseState,\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n} from './Field.types';\nexport { Field } from './Field';\nexport { renderField_unstable } from './renderField';\nexport { useField_unstable } from './useField';\nexport { useFieldBase_unstable } from './useFieldBase';\nexport { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';\n"],"names":["Field","renderField_unstable","useField_unstable","useFieldBase_unstable","fieldClassNames","useFieldStyles_unstable"],"mappings":"AAUA,SAASA,KAAK,QAAQ,aAAU;AAChC,SAASC,oBAAoB,QAAQ,mBAAgB;AACrD,SAASC,iBAAiB,QAAQ,gBAAa;AAC/C,SAASC,qBAAqB,QAAQ,oBAAiB;AACvD,SAASC,eAAe,EAAEC,uBAAuB,QAAQ,6BAA0B"}

package/lib/components/Field/renderField.js

@@ -1,6 +1,6 @@
   import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
-import { FieldContextProvider, getFieldControlProps } from '../../contexts/index';
+import { assertSlots } from "@fluentui/react-utilities";
+import { FieldContextProvider, getFieldControlProps } from "../../contexts/index.js";
 /**
  * Render the final JSX of Field
  */ export const renderField_unstable = (state, contextValues)=>{

package/lib/components/Field/renderField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/renderField.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldBaseState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldBaseState, contextValues: FieldContextValues): JSXElement => {\n  assertSlots<FieldSlots>(state);\n\n  let { children } = state;\n  if (typeof children === 'function') {\n    children = children(getFieldControlProps(contextValues.field) || {});\n  }\n\n  return (\n    <FieldContextProvider value={contextValues?.field}>\n      <state.root>\n        {state.label && <state.label />}\n        {children}\n        {state.validationMessage && (\n          <state.validationMessage>\n            {state.validationMessageIcon && <state.validationMessageIcon />}\n            {state.validationMessage.children}\n          </state.validationMessage>\n        )}\n\n        {state.hint && <state.hint />}\n      </state.root>\n    </FieldContextProvider>\n  );\n};\n"],"names":["assertSlots","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,oBAAoB,EAAEC,oBAAoB,QAAQ,uBAAuB;AAGlF;;CAEC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAuBC;IAC1DL,YAAwBI;IAExB,IAAI,EAAEE,QAAQ,EAAE,GAAGF;IACnB,IAAI,OAAOE,aAAa,YAAY;QAClCA,WAAWA,SAASJ,qBAAqBG,cAAcE,KAAK,KAAK,CAAC;IACpE;IAEA,qBACE,KAACN;QAAqBO,KAAK,EAAEH,0BAAAA,oCAAAA,cAAeE,KAAK;kBAC/C,cAAA,MAACH,MAAMK,IAAI;;gBACRL,MAAMM,KAAK,kBAAI,KAACN,MAAMM,KAAK;gBAC3BJ;gBACAF,MAAMO,iBAAiB,kBACtB,MAACP,MAAMO,iBAAiB;;wBACrBP,MAAMQ,qBAAqB,kBAAI,KAACR,MAAMQ,qBAAqB;wBAC3DR,MAAMO,iBAAiB,CAACL,QAAQ;;;gBAIpCF,MAAMS,IAAI,kBAAI,KAACT,MAAMS,IAAI;;;;AAIlC,EAAE"}
+{"version":3,"sources":["../src/components/Field/renderField.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldBaseState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldBaseState, contextValues: FieldContextValues): JSXElement => {\n  assertSlots<FieldSlots>(state);\n\n  let { children } = state;\n  if (typeof children === 'function') {\n    children = children(getFieldControlProps(contextValues.field) || {});\n  }\n\n  return (\n    <FieldContextProvider value={contextValues?.field}>\n      <state.root>\n        {state.label && <state.label />}\n        {children}\n        {state.validationMessage && (\n          <state.validationMessage>\n            {state.validationMessageIcon && <state.validationMessageIcon />}\n            {state.validationMessage.children}\n          </state.validationMessage>\n        )}\n\n        {state.hint && <state.hint />}\n      </state.root>\n    </FieldContextProvider>\n  );\n};\n"],"names":["assertSlots","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,oBAAoB,EAAEC,oBAAoB,QAAQ,0BAAuB;AAGlF;;CAEC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAuBC;IAC1DL,YAAwBI;IAExB,IAAI,EAAEE,QAAQ,EAAE,GAAGF;IACnB,IAAI,OAAOE,aAAa,YAAY;QAClCA,WAAWA,SAASJ,qBAAqBG,cAAcE,KAAK,KAAK,CAAC;IACpE;IAEA,qBACE,KAACN;QAAqBO,KAAK,EAAEH,0BAAAA,oCAAAA,cAAeE,KAAK;kBAC/C,cAAA,MAACH,MAAMK,IAAI;;gBACRL,MAAMM,KAAK,kBAAI,KAACN,MAAMM,KAAK;gBAC3BJ;gBACAF,MAAMO,iBAAiB,kBACtB,MAACP,MAAMO,iBAAiB;;wBACrBP,MAAMQ,qBAAqB,kBAAI,KAACR,MAAMQ,qBAAqB;wBAC3DR,MAAMO,iBAAiB,CAACL,QAAQ;;;gBAIpCF,MAAMS,IAAI,kBAAI,KAACT,MAAMS,IAAI;;;;AAIlC,EAAE"}

package/lib/components/Field/useField.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';
-import { Label } from '@fluentui/react-label';
-import { slot } from '@fluentui/react-utilities';
-import { useFieldBase_unstable } from './useFieldBase';
+import * as React from "react";
+import { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from "@fluentui/react-icons";
+import { Label } from "@fluentui/react-label";
+import { slot } from "@fluentui/react-utilities";
+import { useFieldBase_unstable } from "./useFieldBase.js";
 const validationMessageIcons = {
     error: /*#__PURE__*/ React.createElement(DiamondDismiss12Filled, null),
     warning: /*#__PURE__*/ React.createElement(Warning12Filled, null),

package/lib/components/Field/useField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { slot } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\nimport { useFieldBase_unstable } from './useFieldBase';\n\nconst validationMessageIcons = {\n  error: <DiamondDismiss12Filled />,\n  warning: <Warning12Filled />,\n  success: <CheckmarkCircle12Filled />,\n  none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n  const { orientation = 'vertical', size = 'medium', ...fieldProps } = props;\n  const state = useFieldBase_unstable(fieldProps, ref);\n\n  const defaultIcon = validationMessageIcons[state.validationState];\n\n  return {\n    ...state,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    components: { ...state.components, label: Label },\n    label: slot.optional(props.label, {\n      defaultProps: { size, ...state.label },\n      elementType: Label,\n    }),\n    validationMessageIcon: slot.optional(props.validationMessageIcon, {\n      renderByDefault: !!defaultIcon,\n      defaultProps: { children: defaultIcon },\n      elementType: 'span',\n    }),\n    orientation,\n    size,\n  };\n};\n"],"names":["React","CheckmarkCircle12Filled","DiamondDismiss12Filled","Warning12Filled","Label","slot","useFieldBase_unstable","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","orientation","size","fieldProps","state","defaultIcon","validationState","components","label","optional","defaultProps","elementType","validationMessageIcon","renderByDefault","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,EAAEC,sBAAsB,EAAEC,eAAe,QAAQ,wBAAwB;AACzG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,IAAI,QAAQ,4BAA4B;AAEjD,SAASC,qBAAqB,QAAQ,iBAAiB;AAEvD,MAAMC,yBAAyB;IAC7BC,qBAAO,oBAACN;IACRO,uBAAS,oBAACN;IACVO,uBAAS,oBAACT;IACVU,MAAMC;AACR;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGC,YAAY,GAAGJ;IACrE,MAAMK,QAAQb,sBAAsBY,YAAYH;IAEhD,MAAMK,cAAcb,sBAAsB,CAACY,MAAME,eAAe,CAAC;IAEjE,OAAO;QACL,GAAGF,KAAK;QACR,4DAA4D;QAC5DG,YAAY;YAAE,GAAGH,MAAMG,UAAU;YAAEC,OAAOnB;QAAM;QAChDmB,OAAOlB,KAAKmB,QAAQ,CAACV,MAAMS,KAAK,EAAE;YAChCE,cAAc;gBAAER;gBAAM,GAAGE,MAAMI,KAAK;YAAC;YACrCG,aAAatB;QACf;QACAuB,uBAAuBtB,KAAKmB,QAAQ,CAACV,MAAMa,qBAAqB,EAAE;YAChEC,iBAAiB,CAAC,CAACR;YACnBK,cAAc;gBAAEI,UAAUT;YAAY;YACtCM,aAAa;QACf;QACAV;QACAC;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { slot } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\nimport { useFieldBase_unstable } from './useFieldBase';\n\nconst validationMessageIcons = {\n  error: <DiamondDismiss12Filled />,\n  warning: <Warning12Filled />,\n  success: <CheckmarkCircle12Filled />,\n  none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n  const { orientation = 'vertical', size = 'medium', ...fieldProps } = props;\n  const state = useFieldBase_unstable(fieldProps, ref);\n\n  const defaultIcon = validationMessageIcons[state.validationState];\n\n  return {\n    ...state,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    components: { ...state.components, label: Label },\n    label: slot.optional(props.label, {\n      defaultProps: { size, ...state.label },\n      elementType: Label,\n    }),\n    validationMessageIcon: slot.optional(props.validationMessageIcon, {\n      renderByDefault: !!defaultIcon,\n      defaultProps: { children: defaultIcon },\n      elementType: 'span',\n    }),\n    orientation,\n    size,\n  };\n};\n"],"names":["React","CheckmarkCircle12Filled","DiamondDismiss12Filled","Warning12Filled","Label","slot","useFieldBase_unstable","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","orientation","size","fieldProps","state","defaultIcon","validationState","components","label","optional","defaultProps","elementType","validationMessageIcon","renderByDefault","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,EAAEC,sBAAsB,EAAEC,eAAe,QAAQ,wBAAwB;AACzG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,IAAI,QAAQ,4BAA4B;AAEjD,SAASC,qBAAqB,QAAQ,oBAAiB;AAEvD,MAAMC,yBAAyB;IAC7BC,qBAAO,oBAACN;IACRO,uBAAS,oBAACN;IACVO,uBAAS,oBAACT;IACVU,MAAMC;AACR;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGC,YAAY,GAAGJ;IACrE,MAAMK,QAAQb,sBAAsBY,YAAYH;IAEhD,MAAMK,cAAcb,sBAAsB,CAACY,MAAME,eAAe,CAAC;IAEjE,OAAO;QACL,GAAGF,KAAK;QACR,4DAA4D;QAC5DG,YAAY;YAAE,GAAGH,MAAMG,UAAU;YAAEC,OAAOnB;QAAM;QAChDmB,OAAOlB,KAAKmB,QAAQ,CAACV,MAAMS,KAAK,EAAE;YAChCE,cAAc;gBAAER;gBAAM,GAAGE,MAAMI,KAAK;YAAC;YACrCG,aAAatB;QACf;QACAuB,uBAAuBtB,KAAKmB,QAAQ,CAACV,MAAMa,qBAAqB,EAAE;YAChEC,iBAAiB,CAAC,CAACR;YACnBK,cAAc;gBAAEI,UAAUT;YAAY;YACtCM,aAAa;QACf;QACAV;QACAC;IACF;AACF,EAAE"}

package/lib/components/Field/useFieldBase.js

@@ -1,4 +1,4 @@
-import { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';
+import { getIntrinsicElementProps, useId, slot } from "@fluentui/react-utilities";
 /**
  * Base hook for Field component, which manages state related to validation, ARIA attributes,
  * ID generation, and slot structure without design props.

package/lib/components/Field/useFieldStyles.styles.js

@@ -1,7 +1,7 @@
 'use client';
 
-import { tokens, typographyStyles } from '@fluentui/react-theme';
-import { __resetStyles, __styles, mergeClasses } from '@griffel/react';
+import { tokens, typographyStyles } from "@fluentui/react-theme";
+import { __resetStyles, __styles, mergeClasses } from "@griffel/react";
 export const fieldClassNames = {
   root: `fui-Field`,
   label: `fui-Field__label`,

package/lib/components/Field/useFieldStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","B2u0y6b","Bxyxcbc","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","size","orientation","rootStyles","className","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["useFieldStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n    root: `fui-Field`,\n    label: `fui-Field__label`,\n    validationMessage: `fui-Field__validationMessage`,\n    validationMessageIcon: `fui-Field__validationMessageIcon`,\n    hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'grid'\n    },\n    // In horizontal layout, the field is a grid with the label taking up the entire first column.\n    // The last row is slack space in case the label is taller than the rest of the content.\n    horizontal: {\n        gridTemplateColumns: '33% 1fr',\n        gridTemplateRows: 'auto auto auto 1fr'\n    },\n    // In horizontal layout without a label, replace the label's column with padding.\n    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n    horizontalNoLabel: {\n        paddingLeft: '33%',\n        gridTemplateColumns: '1fr'\n    }\n});\nconst useLabelStyles = makeStyles({\n    base: {\n        maxWidth: 'max-content',\n        maxHeight: 'max-content'\n    },\n    vertical: {\n        paddingTop: tokens.spacingVerticalXXS,\n        paddingBottom: tokens.spacingVerticalXXS,\n        marginBottom: tokens.spacingVerticalXXS\n    },\n    verticalLarge: {\n        paddingTop: '1px',\n        paddingBottom: '1px',\n        marginBottom: tokens.spacingVerticalXS\n    },\n    horizontal: {\n        paddingTop: tokens.spacingVerticalSNudge,\n        paddingBottom: tokens.spacingVerticalSNudge,\n        marginRight: tokens.spacingHorizontalM,\n        gridRowStart: '1',\n        gridRowEnd: '-1'\n    },\n    horizontalSmall: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS\n    },\n    horizontalLarge: {\n        // To align the label text with the Input text, it should be centered within the 40px height of the Input.\n        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.\n        paddingTop: '9px',\n        paddingBottom: '9px'\n    }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n    marginTop: tokens.spacingVerticalXXS,\n    color: tokens.colorNeutralForeground3,\n    ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    withIcon: {\n        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n        paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n    }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n    display: 'inline-block',\n    fontSize: iconSize,\n    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n    marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n    marginRight: tokens.spacingHorizontalXS,\n    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n    lineHeight: '0',\n    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n    verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    warning: {\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    success: {\n        color: tokens.colorPaletteGreenForeground1\n    }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n    const { validationState, size } = state;\n    const horizontal = state.orientation === 'horizontal';\n    const rootStyles = useRootStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n    const labelStyles = useLabelStyles();\n    if (state.label) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.label.className = mergeClasses(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n    }\n    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n    const validationMessageIconStyles = useValidationMessageIconStyles();\n    if (state.validationMessageIcon) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n    }\n    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n    const secondaryTextStyles = useSecondaryTextStyles();\n    if (state.validationMessage) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n    }\n    if (state.hint) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n    }\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","B2u0y6b","Bxyxcbc","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","size","orientation","rootStyles","className","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["useFieldStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens, typographyStyles } from \"@fluentui/react-theme\";\nimport { makeResetStyles, makeStyles, mergeClasses } from \"@griffel/react\";\nexport const fieldClassNames = {\n    root: `fui-Field`,\n    label: `fui-Field__label`,\n    validationMessage: `fui-Field__validationMessage`,\n    validationMessageIcon: `fui-Field__validationMessageIcon`,\n    hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'grid'\n    },\n    // In horizontal layout, the field is a grid with the label taking up the entire first column.\n    // The last row is slack space in case the label is taller than the rest of the content.\n    horizontal: {\n        gridTemplateColumns: '33% 1fr',\n        gridTemplateRows: 'auto auto auto 1fr'\n    },\n    // In horizontal layout without a label, replace the label's column with padding.\n    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n    horizontalNoLabel: {\n        paddingLeft: '33%',\n        gridTemplateColumns: '1fr'\n    }\n});\nconst useLabelStyles = makeStyles({\n    base: {\n        maxWidth: 'max-content',\n        maxHeight: 'max-content'\n    },\n    vertical: {\n        paddingTop: tokens.spacingVerticalXXS,\n        paddingBottom: tokens.spacingVerticalXXS,\n        marginBottom: tokens.spacingVerticalXXS\n    },\n    verticalLarge: {\n        paddingTop: '1px',\n        paddingBottom: '1px',\n        marginBottom: tokens.spacingVerticalXS\n    },\n    horizontal: {\n        paddingTop: tokens.spacingVerticalSNudge,\n        paddingBottom: tokens.spacingVerticalSNudge,\n        marginRight: tokens.spacingHorizontalM,\n        gridRowStart: '1',\n        gridRowEnd: '-1'\n    },\n    horizontalSmall: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS\n    },\n    horizontalLarge: {\n        // To align the label text with the Input text, it should be centered within the 40px height of the Input.\n        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.\n        paddingTop: '9px',\n        paddingBottom: '9px'\n    }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n    marginTop: tokens.spacingVerticalXXS,\n    color: tokens.colorNeutralForeground3,\n    ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    withIcon: {\n        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n        paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n    }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n    display: 'inline-block',\n    fontSize: iconSize,\n    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n    marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n    marginRight: tokens.spacingHorizontalXS,\n    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n    lineHeight: '0',\n    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n    verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    warning: {\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    success: {\n        color: tokens.colorPaletteGreenForeground1\n    }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n    const { validationState, size } = state;\n    const horizontal = state.orientation === 'horizontal';\n    const rootStyles = useRootStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n    const labelStyles = useLabelStyles();\n    if (state.label) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.label.className = mergeClasses(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n    }\n    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n    const validationMessageIconStyles = useValidationMessageIconStyles();\n    if (state.validationMessageIcon) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n    }\n    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n    const secondaryTextStyles = useSecondaryTextStyles();\n    if (state.validationMessage) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n    }\n    if (state.hint) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAAAC,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,OAAO,MAAMC,eAAe,GAAG;EAC3BC,IAAI,EAAE,WAAW;EACjBC,KAAK,EAAE,kBAAkB;EACzBC,iBAAiB,EAAE,8BAA8B;EACjDC,qBAAqB,EAAE,kCAAkC;EACzDC,IAAI,EAAE;AACV,CAAC;AACD;AACA,MAAMC,QAAQ,GAAG,MAAM;AACvB;AACA;AACA;AAAI,MAAMC,aAAa,gBAAGT,QAAA;EAAAU,IAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,iBAAA;IAAAC,MAAA;IAAAH,OAAA;EAAA;AAAA;EAAAI,CAAA;AAAA,CAgBzB,CAAC;AACF,MAAMC,cAAc,gBAAGlB,QAAA;EAAAU,IAAA;IAAAS,OAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,aAAA;IAAAH,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAZ,UAAA;IAAAU,MAAA;IAAAC,OAAA;IAAAG,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,eAAA;IAAAP,MAAA;IAAAC,OAAA;EAAA;EAAAO,eAAA;IAAAR,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAN,CAAA;AAAA,CAgCtB,CAAC;AACF,MAAMc,6BAA6B,gBAAGhC,aAAA,uPAIrC,CAAC;AACF,MAAMiC,sBAAsB,gBAAGhC,QAAA;EAAAiC,KAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAnB,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAQ9B,CAAC;AACF,MAAMmB,qCAAqC,gBAAGrC,aAAA,2XAU7C,CAAC;AACF,MAAMsC,8BAA8B,gBAAGrC,QAAA;EAAAiC,KAAA;IAAAC,MAAA;EAAA;EAAAI,OAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;AAAA;EAAAjB,CAAA;AAAA,CAUtC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMuB,uBAAuB,GAAIC,KAAK,IAAG;EAChD,MAAM;IAAEC,eAAe;IAAEC;EAAK,CAAC,GAAGF,KAAK;EACvC,MAAM7B,UAAU,GAAG6B,KAAK,CAACG,WAAW,KAAK,YAAY;EACrD,MAAMC,UAAU,GAAGpC,aAAa,CAAC,CAAC;EAClC;EACAgC,KAAK,CAACtC,IAAI,CAAC2C,SAAS,GAAG7C,YAAY,CAACC,eAAe,CAACC,IAAI,EAAE0C,UAAU,CAACnC,IAAI,EAAEE,UAAU,IAAIiC,UAAU,CAACjC,UAAU,EAAEA,UAAU,IAAI,CAAC6B,KAAK,CAACrC,KAAK,IAAIyC,UAAU,CAAC9B,iBAAiB,EAAE0B,KAAK,CAACtC,IAAI,CAAC2C,SAAS,CAAC;EACjM,MAAMC,WAAW,GAAG7B,cAAc,CAAC,CAAC;EACpC,IAAIuB,KAAK,CAACrC,KAAK,EAAE;IACb;IACAqC,KAAK,CAACrC,KAAK,CAAC0C,SAAS,GAAG7C,YAAY,CAACC,eAAe,CAACE,KAAK,EAAE2C,WAAW,CAACrC,IAAI,EAAEE,UAAU,IAAImC,WAAW,CAACnC,UAAU,EAAEA,UAAU,IAAI+B,IAAI,KAAK,OAAO,IAAII,WAAW,CAAClB,eAAe,EAAEjB,UAAU,IAAI+B,IAAI,KAAK,OAAO,IAAII,WAAW,CAACjB,eAAe,EAAE,CAAClB,UAAU,IAAImC,WAAW,CAAC1B,QAAQ,EAAE,CAACT,UAAU,IAAI+B,IAAI,KAAK,OAAO,IAAII,WAAW,CAACtB,aAAa,EAAEgB,KAAK,CAACrC,KAAK,CAAC0C,SAAS,CAAC;EAC/W;EACA,MAAME,kCAAkC,GAAGZ,qCAAqC,CAAC,CAAC;EAClF,MAAMa,2BAA2B,GAAGZ,8BAA8B,CAAC,CAAC;EACpE,IAAII,KAAK,CAACnC,qBAAqB,EAAE;IAC7B;IACAmC,KAAK,CAACnC,qBAAqB,CAACwC,SAAS,GAAG7C,YAAY,CAACC,eAAe,CAACI,qBAAqB,EAAE0C,kCAAkC,EAAEN,eAAe,KAAK,MAAM,IAAIO,2BAA2B,CAACP,eAAe,CAAC,EAAED,KAAK,CAACnC,qBAAqB,CAACwC,SAAS,CAAC;EACtP;EACA,MAAMI,0BAA0B,GAAGnB,6BAA6B,CAAC,CAAC;EAClE,MAAMoB,mBAAmB,GAAGnB,sBAAsB,CAAC,CAAC;EACpD,IAAIS,KAAK,CAACpC,iBAAiB,EAAE;IACzB;IACAoC,KAAK,CAACpC,iBAAiB,CAACyC,SAAS,GAAG7C,YAAY,CAACC,eAAe,CAACG,iBAAiB,EAAE6C,0BAA0B,EAAER,eAAe,KAAK,OAAO,IAAIS,mBAAmB,CAAClB,KAAK,EAAE,CAAC,CAACQ,KAAK,CAACnC,qBAAqB,IAAI6C,mBAAmB,CAAChB,QAAQ,EAAEM,KAAK,CAACpC,iBAAiB,CAACyC,SAAS,CAAC;EAC/Q;EACA,IAAIL,KAAK,CAAClC,IAAI,EAAE;IACZ;IACAkC,KAAK,CAAClC,IAAI,CAACuC,SAAS,GAAG7C,YAAY,CAACC,eAAe,CAACK,IAAI,EAAE2C,0BAA0B,EAAET,KAAK,CAAClC,IAAI,CAACuC,SAAS,CAAC;EAC/G;EACA,OAAOL,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/Field/useFieldStyles.styles.raw.js

@@ -1,6 +1,6 @@
 'use client';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
-import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';
+import { tokens, typographyStyles } from "@fluentui/react-theme";
+import { makeResetStyles, makeStyles, mergeClasses } from "@griffel/react";
 export const fieldClassNames = {
     root: `fui-Field`,
     label: `fui-Field__label`,

package/lib/contexts/FieldContext.js

@@ -1,5 +1,5 @@
 'use client';
-import * as React from 'react';
+import * as React from "react";
 const FieldContext = React.createContext(undefined);
 export const FieldContextProvider = FieldContext.Provider;
 export const useFieldContext_unstable = ()=>React.useContext(FieldContext);

package/lib/contexts/index.js

@@ -1,3 +1,3 @@
-export { FieldContextProvider, useFieldContext_unstable } from './FieldContext';
-export { useFieldContextValues_unstable } from './useFieldContextValues';
-export { getFieldControlProps, useFieldControlProps_unstable } from './useFieldControlProps';
+export { FieldContextProvider, useFieldContext_unstable } from "./FieldContext.js";
+export { useFieldContextValues_unstable } from "./useFieldContextValues.js";
+export { getFieldControlProps, useFieldControlProps_unstable } from "./useFieldControlProps.js";

package/lib/contexts/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export { FieldContextProvider, useFieldContext_unstable } from './FieldContext';\nexport { useFieldContextValues_unstable } from './useFieldContextValues';\nexport type { FieldControlPropsOptions } from './useFieldControlProps';\nexport { getFieldControlProps, useFieldControlProps_unstable } from './useFieldControlProps';\n"],"names":["FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","getFieldControlProps","useFieldControlProps_unstable"],"mappings":"AAAA,SAASA,oBAAoB,EAAEC,wBAAwB,QAAQ,iBAAiB;AAChF,SAASC,8BAA8B,QAAQ,0BAA0B;AAEzE,SAASC,oBAAoB,EAAEC,6BAA6B,QAAQ,yBAAyB"}
+{"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export { FieldContextProvider, useFieldContext_unstable } from './FieldContext';\nexport { useFieldContextValues_unstable } from './useFieldContextValues';\nexport type { FieldControlPropsOptions } from './useFieldControlProps';\nexport { getFieldControlProps, useFieldControlProps_unstable } from './useFieldControlProps';\n"],"names":["FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","getFieldControlProps","useFieldControlProps_unstable"],"mappings":"AAAA,SAASA,oBAAoB,EAAEC,wBAAwB,QAAQ,oBAAiB;AAChF,SAASC,8BAA8B,QAAQ,6BAA0B;AAEzE,SAASC,oBAAoB,EAAEC,6BAA6B,QAAQ,4BAAyB"}

package/lib/contexts/useFieldContextValues.js

@@ -1,5 +1,5 @@
 'use client';
-import * as React from 'react';
+import * as React from "react";
 /**
  * Get the context values used when rendering Field.
  */ export const useFieldContextValues_unstable = (state)=>{

package/lib/contexts/useFieldControlProps.js

@@ -1,5 +1,5 @@
 'use client';
-import { useFieldContext_unstable } from './FieldContext';
+import { useFieldContext_unstable } from "./FieldContext.js";
 export function useFieldControlProps_unstable(props, options) {
     return getFieldControlProps(useFieldContext_unstable(), props, options);
 }

package/lib/contexts/useFieldControlProps.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/useFieldControlProps.ts"],"sourcesContent":["'use client';\n\nimport type { FieldContextValue, FieldControlProps } from '../Field';\nimport { useFieldContext_unstable } from './FieldContext';\n\n/**\n * Options for `useFieldControlProps_unstable`.\n */\nexport type FieldControlPropsOptions = {\n  /**\n   * Skips setting `aria-labelledby` on the control if the `label.htmlFor` refers to the control.\n   *\n   * This should be used with controls that can be the target of a label's `for` prop:\n   * `<button>`, `<input>`, `<progress>`, `<select>`, `<textarea>`.\n   */\n  supportsLabelFor?: boolean;\n\n  /**\n   * Sets `required` instead of `aria-required` when the Field is marked required.\n   *\n   * This should be used with controls that support the `required` prop:\n   * `<input>` (except `range` or `color`), `<select>`, `<textarea>`.\n   */\n  supportsRequired?: boolean;\n\n  /**\n   * Sets the size prop on the control to match the Field's size: `'small' | 'medium' | 'large'`.\n   *\n   * This should be used with controls that have a custom size prop that matches the Field's size prop.\n   */\n  supportsSize?: boolean;\n};\n\n/**\n * Gets the control props from the field context, if this inside a `<Field>`.\n *\n * When called with no arguments, returns the FieldControlProps that should be applied to the control.\n *\n * @returns A FieldControlProps object if inside a `<Field>`, otherwise undefined.\n */\nexport function useFieldControlProps_unstable(): FieldControlProps | undefined;\n\n/**\n * Copies and merges the FieldControlProps with the given props, if this inside a `<Field>`.\n *\n * @param props - The existing props for the control. These will be merged with the control props from the field context.\n * @param options - Option to include the size prop.\n * @returns Merged props if inside a `<Field>`, otherwise the original props, or undefined if no props given.\n */\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props: Props,\n  options?: FieldControlPropsOptions,\n): Props;\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\n\n/**\n * Implementation of useFieldControlProps_unstable.\n * Split out so it can be used directly in renderField_unstable.\n *\n * @internal\n */\nexport function getFieldControlProps<Props extends FieldControlProps>(\n  context: FieldContextValue | undefined,\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  if (!context) {\n    return props;\n  }\n\n  // Create a copy of props so we don't modify the original\n  props = { ...props } as Props;\n\n  const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;\n\n  if (generatedControlId) {\n    props.id ??= generatedControlId;\n  }\n\n  // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer\n  // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).\n  if (labelId && (!options?.supportsLabelFor || labelFor !== props.id)) {\n    props['aria-labelledby'] ??= labelId;\n  }\n\n  // The control is described by the validation message, or hint, or both.\n  // We also preserve and append any aria-describedby from props.\n  // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n  if (validationMessageId || hintId) {\n    // NOTE: Not using ??= since we're merging and overriding the user-provided value.\n    props['aria-describedby'] = [validationMessageId, hintId, props?.['aria-describedby']].filter(Boolean).join(' ');\n  }\n\n  if (validationState === 'error') {\n    props['aria-invalid'] ??= true;\n  }\n\n  if (required) {\n    if (options?.supportsRequired) {\n      (props as { required?: boolean }).required ??= true;\n    } else {\n      props['aria-required'] ??= true;\n    }\n  }\n\n  // Include the size prop if this control supports it\n  if (options?.supportsSize) {\n    (props as { size?: FieldContextValue['size'] }).size ??= context.size;\n  }\n\n  return props;\n}\n"],"names":["useFieldContext_unstable","useFieldControlProps_unstable","props","options","getFieldControlProps","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","id","supportsLabelFor","filter","Boolean","join","supportsRequired","supportsSize","size"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,QAAQ,iBAAiB;AAkD1D,OAAO,SAASC,8BACdC,KAAa,EACbC,OAAkC;IAElC,OAAOC,qBAAqBJ,4BAA4BE,OAAOC;AACjE;AAEA;;;;;CAKC,GACD,OAAO,SAASC,qBACdC,OAAsC,EACtCH,KAAa,EACbC,OAAkC;IAElC,IAAI,CAACE,SAAS;QACZ,OAAOH;IACT;IAEA,yDAAyD;IACzDA,QAAQ;QAAE,GAAGA,KAAK;IAAC;IAEnB,MAAM,EAAEI,kBAAkB,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,eAAe,EAAE,GAAGP;IAE1G,IAAIC,oBAAoB;YACtBJ;;QAAAA,QAAAA,SAAAA,OAAMW,uCAANX,OAAMW,KAAOP;IACf;IAEA,4GAA4G;IAC5G,6GAA6G;IAC7G,IAAIG,WAAY,CAAA,EAACN,oBAAAA,8BAAAA,QAASW,gBAAgB,KAAIN,aAAaN,MAAMW,EAAE,AAAD,GAAI;YACpEX,SAAM;;QAANA,MAAAA,UAAAA,MAAK,CAAC,kBAAA,kBAAkB,iCAAxBA,OAAK,CAAC,gBAAkB,GAAKO;IAC/B;IAEA,wEAAwE;IACxE,+DAA+D;IAC/D,yFAAyF;IACzF,IAAIE,uBAAuBJ,QAAQ;QACjC,kFAAkF;QAClFL,KAAK,CAAC,mBAAmB,GAAG;YAACS;YAAqBJ;YAAQL,kBAAAA,4BAAAA,KAAO,CAAC,mBAAmB;SAAC,CAACa,MAAM,CAACC,SAASC,IAAI,CAAC;IAC9G;IAEA,IAAIL,oBAAoB,SAAS;YAC/BV,SAAM;;QAANA,OAAAA,UAAAA,MAAK,CAAC,eAAA,eAAe,mCAArBA,OAAK,CAAC,aAAe,GAAK;IAC5B;IAEA,IAAIQ,UAAU;QACZ,IAAIP,oBAAAA,8BAAAA,QAASe,gBAAgB,EAAE;gBAC5BhB;;YAAD,cAACA,UAAAA,OAAiCQ,yDAAjCR,QAAiCQ,WAAa;QACjD,OAAO;gBACLR,SAAM;;YAANA,OAAAA,UAAAA,MAAK,CAAC,gBAAA,gBAAgB,mCAAtBA,OAAK,CAAC,cAAgB,GAAK;QAC7B;IACF;IAEA,oDAAoD;IACpD,IAAIC,oBAAAA,8BAAAA,QAASgB,YAAY,EAAE;YACxBjB;;QAAD,UAACA,UAAAA,OAA+CkB,6CAA/ClB,QAA+CkB,OAASf,QAAQe,IAAI;IACvE;IAEA,OAAOlB;AACT"}
+{"version":3,"sources":["../src/contexts/useFieldControlProps.ts"],"sourcesContent":["'use client';\n\nimport type { FieldContextValue, FieldControlProps } from '../Field';\nimport { useFieldContext_unstable } from './FieldContext';\n\n/**\n * Options for `useFieldControlProps_unstable`.\n */\nexport type FieldControlPropsOptions = {\n  /**\n   * Skips setting `aria-labelledby` on the control if the `label.htmlFor` refers to the control.\n   *\n   * This should be used with controls that can be the target of a label's `for` prop:\n   * `<button>`, `<input>`, `<progress>`, `<select>`, `<textarea>`.\n   */\n  supportsLabelFor?: boolean;\n\n  /**\n   * Sets `required` instead of `aria-required` when the Field is marked required.\n   *\n   * This should be used with controls that support the `required` prop:\n   * `<input>` (except `range` or `color`), `<select>`, `<textarea>`.\n   */\n  supportsRequired?: boolean;\n\n  /**\n   * Sets the size prop on the control to match the Field's size: `'small' | 'medium' | 'large'`.\n   *\n   * This should be used with controls that have a custom size prop that matches the Field's size prop.\n   */\n  supportsSize?: boolean;\n};\n\n/**\n * Gets the control props from the field context, if this inside a `<Field>`.\n *\n * When called with no arguments, returns the FieldControlProps that should be applied to the control.\n *\n * @returns A FieldControlProps object if inside a `<Field>`, otherwise undefined.\n */\nexport function useFieldControlProps_unstable(): FieldControlProps | undefined;\n\n/**\n * Copies and merges the FieldControlProps with the given props, if this inside a `<Field>`.\n *\n * @param props - The existing props for the control. These will be merged with the control props from the field context.\n * @param options - Option to include the size prop.\n * @returns Merged props if inside a `<Field>`, otherwise the original props, or undefined if no props given.\n */\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props: Props,\n  options?: FieldControlPropsOptions,\n): Props;\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\n\n/**\n * Implementation of useFieldControlProps_unstable.\n * Split out so it can be used directly in renderField_unstable.\n *\n * @internal\n */\nexport function getFieldControlProps<Props extends FieldControlProps>(\n  context: FieldContextValue | undefined,\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  if (!context) {\n    return props;\n  }\n\n  // Create a copy of props so we don't modify the original\n  props = { ...props } as Props;\n\n  const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;\n\n  if (generatedControlId) {\n    props.id ??= generatedControlId;\n  }\n\n  // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer\n  // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).\n  if (labelId && (!options?.supportsLabelFor || labelFor !== props.id)) {\n    props['aria-labelledby'] ??= labelId;\n  }\n\n  // The control is described by the validation message, or hint, or both.\n  // We also preserve and append any aria-describedby from props.\n  // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n  if (validationMessageId || hintId) {\n    // NOTE: Not using ??= since we're merging and overriding the user-provided value.\n    props['aria-describedby'] = [validationMessageId, hintId, props?.['aria-describedby']].filter(Boolean).join(' ');\n  }\n\n  if (validationState === 'error') {\n    props['aria-invalid'] ??= true;\n  }\n\n  if (required) {\n    if (options?.supportsRequired) {\n      (props as { required?: boolean }).required ??= true;\n    } else {\n      props['aria-required'] ??= true;\n    }\n  }\n\n  // Include the size prop if this control supports it\n  if (options?.supportsSize) {\n    (props as { size?: FieldContextValue['size'] }).size ??= context.size;\n  }\n\n  return props;\n}\n"],"names":["useFieldContext_unstable","useFieldControlProps_unstable","props","options","getFieldControlProps","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","id","supportsLabelFor","filter","Boolean","join","supportsRequired","supportsSize","size"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,QAAQ,oBAAiB;AAkD1D,OAAO,SAASC,8BACdC,KAAa,EACbC,OAAkC;IAElC,OAAOC,qBAAqBJ,4BAA4BE,OAAOC;AACjE;AAEA;;;;;CAKC,GACD,OAAO,SAASC,qBACdC,OAAsC,EACtCH,KAAa,EACbC,OAAkC;IAElC,IAAI,CAACE,SAAS;QACZ,OAAOH;IACT;IAEA,yDAAyD;IACzDA,QAAQ;QAAE,GAAGA,KAAK;IAAC;IAEnB,MAAM,EAAEI,kBAAkB,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,eAAe,EAAE,GAAGP;IAE1G,IAAIC,oBAAoB;YACtBJ;;QAAAA,QAAAA,SAAAA,OAAMW,uCAANX,OAAMW,KAAOP;IACf;IAEA,4GAA4G;IAC5G,6GAA6G;IAC7G,IAAIG,WAAY,CAAA,EAACN,oBAAAA,8BAAAA,QAASW,gBAAgB,KAAIN,aAAaN,MAAMW,EAAE,AAAD,GAAI;YACpEX,SAAM;;QAANA,MAAAA,UAAAA,MAAK,CAAC,kBAAA,kBAAkB,iCAAxBA,OAAK,CAAC,gBAAkB,GAAKO;IAC/B;IAEA,wEAAwE;IACxE,+DAA+D;IAC/D,yFAAyF;IACzF,IAAIE,uBAAuBJ,QAAQ;QACjC,kFAAkF;QAClFL,KAAK,CAAC,mBAAmB,GAAG;YAACS;YAAqBJ;YAAQL,kBAAAA,4BAAAA,KAAO,CAAC,mBAAmB;SAAC,CAACa,MAAM,CAACC,SAASC,IAAI,CAAC;IAC9G;IAEA,IAAIL,oBAAoB,SAAS;YAC/BV,SAAM;;QAANA,OAAAA,UAAAA,MAAK,CAAC,eAAA,eAAe,mCAArBA,OAAK,CAAC,aAAe,GAAK;IAC5B;IAEA,IAAIQ,UAAU;QACZ,IAAIP,oBAAAA,8BAAAA,QAASe,gBAAgB,EAAE;gBAC5BhB;;YAAD,cAACA,UAAAA,OAAiCQ,yDAAjCR,QAAiCQ,WAAa;QACjD,OAAO;gBACLR,SAAM;;YAANA,OAAAA,UAAAA,MAAK,CAAC,gBAAA,gBAAgB,mCAAtBA,OAAK,CAAC,cAAgB,GAAK;QAC7B;IACF;IAEA,oDAAoD;IACpD,IAAIC,oBAAAA,8BAAAA,QAASgB,YAAY,EAAE;YACxBjB;;QAAD,UAACA,UAAAA,OAA+CkB,6CAA/ClB,QAA+CkB,OAASf,QAAQe,IAAI;IACvE;IAEA,OAAOlB;AACT"}

package/lib/index.js

@@ -1,5 +1,5 @@
-export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable, useFieldBase_unstable } from './Field';
-export { FieldContextProvider, useFieldContext_unstable, useFieldContextValues_unstable, useFieldControlProps_unstable } from './contexts/index';
+export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable, useFieldBase_unstable } from "./Field.js";
+export { FieldContextProvider, useFieldContext_unstable, useFieldContextValues_unstable, useFieldControlProps_unstable } from "./contexts/index.js";
  // Experimental APIs - will be uncommented in the experimental release branch
  // export { useFieldBase_unstable } from './Field';
  // export type { FieldBaseProps, FieldBaseState } from './Field';

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './Field';\nexport type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './Field';\nexport {\n  FieldContextProvider,\n  useFieldContext_unstable,\n  useFieldContextValues_unstable,\n  useFieldControlProps_unstable,\n} from './contexts/index';\nexport type { FieldControlPropsOptions } from './contexts/index';\n\n// Experimental APIs - will be uncommented in the experimental release branch\n// export { useFieldBase_unstable } from './Field';\n// export type { FieldBaseProps, FieldBaseState } from './Field';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":"AAAA,SACEA,KAAK,EACLC,eAAe,EACfC,oBAAoB,EACpBC,uBAAuB,EACvBC,iBAAiB,EACjBC,qBAAqB,QAChB,UAAU;AAWjB,SACEC,oBAAoB,EACpBC,wBAAwB,EACxBC,8BAA8B,EAC9BC,6BAA6B,QACxB,mBAAmB;CAG1B,6EAA6E;CAC7E,mDAAmD;CACnD,iEAAiE"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './Field';\nexport type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './Field';\nexport {\n  FieldContextProvider,\n  useFieldContext_unstable,\n  useFieldContextValues_unstable,\n  useFieldControlProps_unstable,\n} from './contexts/index';\nexport type { FieldControlPropsOptions } from './contexts/index';\n\n// Experimental APIs - will be uncommented in the experimental release branch\n// export { useFieldBase_unstable } from './Field';\n// export type { FieldBaseProps, FieldBaseState } from './Field';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":"AAAA,SACEA,KAAK,EACLC,eAAe,EACfC,oBAAoB,EACpBC,uBAAuB,EACvBC,iBAAiB,EACjBC,qBAAqB,QAChB,aAAU;AAWjB,SACEC,oBAAoB,EACpBC,wBAAwB,EACxBC,8BAA8B,EAC9BC,6BAA6B,QACxB,sBAAmB;CAG1B,6EAA6E;CAC7E,mDAAmD;CACnD,iEAAiE"}

package/lib-commonjs/{Field.js → Field.cjs}

@@ -28,4 +28,4 @@ _export(exports, {
         return _index.useField_unstable;
     }
 });
-const _index = require("./components/Field/index");
+const _index = require("./components/Field/index.cjs");

package/lib-commonjs/{Field.js.map → Field.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/Field.ts"],"sourcesContent":["export type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './components/Field/index';\nexport {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './components/Field/index';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable"],"mappings":";;;;;;;;;;;;eAWEA,YAAK;;;eACLC,sBAAe;;;eACfC,2BAAoB;;;eAGpBG,4BAAqB;;;eAFrBF,8BAAuB;;;eACvBC,wBAAiB;;;uBAEZ,2BAA2B"}
+{"version":3,"sources":["../src/Field.ts"],"sourcesContent":["export type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './components/Field/index';\nexport {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './components/Field/index';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable"],"mappings":";;;;;;;;;;;;eAWEA,YAAK;;;eACLC,sBAAe;;;eACfC,2BAAoB;;;eAGpBG,4BAAqB;;;eAFrBF,8BAAuB;;;eACvBC,wBAAiB;;;uBAEZ,8BAA2B"}

package/lib-commonjs/components/Field/{Field.js → Field.cjs}

@@ -11,10 +11,10 @@ Object.defineProperty(exports, "Field", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const _renderField = require("./renderField");
-const _useField = require("./useField");
-const _useFieldStylesstyles = require("./useFieldStyles.styles");
-const _index = require("../../contexts/index");
+const _renderField = require("./renderField.cjs");
+const _useField = require("./useField.cjs");
+const _useFieldStylesstyles = require("./useFieldStyles.styles.cjs");
+const _index = require("../../contexts/index.cjs");
 const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const Field = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useField.useField_unstable)(props, ref);

package/lib-commonjs/components/Field/{Field.js.map → Field.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/Field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  useCustomStyleHook_unstable('useFieldStyles_unstable')(state);\n  const context = useFieldContextValues_unstable(state);\n  return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","useCustomStyleHook_unstable","Field","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;6BAGM,gBAAgB;0BACnB,aAAa;sCACP,0BAA0B;uBACnB,uBAAuB;qCAC1B,kCAAkC;AAEvE,MAAMM,QAAAA,WAAAA,GAAyCN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IAC7E,MAAMC,YAAQR,2BAAAA,EAAkBM,OAAOC;QACvCN,6CAAAA,EAAwBO;QACxBL,gDAAAA,EAA4B,2BAA2BK;IACvD,MAAMC,cAAUP,qCAAAA,EAA+BM;IAC/C,WAAOT,iCAAAA,EAAqBS,OAAOC;AACrC,GAAG;AAEHL,MAAMM,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/Field/Field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  useCustomStyleHook_unstable('useFieldStyles_unstable')(state);\n  const context = useFieldContextValues_unstable(state);\n  return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","useCustomStyleHook_unstable","Field","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;6BAGM,mBAAgB;0BACnB,gBAAa;sCACP,6BAA0B;uBACnB,0BAAuB;qCAC1B,kCAAkC;AAEvE,MAAMM,QAAAA,WAAAA,GAAyCN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IAC7E,MAAMC,YAAQR,2BAAAA,EAAkBM,OAAOC;QACvCN,6CAAAA,EAAwBO;QACxBL,gDAAAA,EAA4B,2BAA2BK;IACvD,MAAMC,cAAUP,qCAAAA,EAA+BM;IAC/C,WAAOT,iCAAAA,EAAqBS,OAAOC;AACrC,GAAG;AAEHL,MAAMM,WAAW,GAAG"}

package/lib-commonjs/components/Field/{index.js → index.cjs}

@@ -28,8 +28,8 @@ _export(exports, {
         return _useField.useField_unstable;
     }
 });
-const _Field = require("./Field");
-const _renderField = require("./renderField");
-const _useField = require("./useField");
-const _useFieldBase = require("./useFieldBase");
-const _useFieldStylesstyles = require("./useFieldStyles.styles");
+const _Field = require("./Field.cjs");
+const _renderField = require("./renderField.cjs");
+const _useField = require("./useField.cjs");
+const _useFieldBase = require("./useFieldBase.cjs");
+const _useFieldStylesstyles = require("./useFieldStyles.styles.cjs");

package/lib-commonjs/components/Field/{index.js.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/index.ts"],"sourcesContent":["export type {\n  FieldBaseProps,\n  FieldBaseState,\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n} from './Field.types';\nexport { Field } from './Field';\nexport { renderField_unstable } from './renderField';\nexport { useField_unstable } from './useField';\nexport { useFieldBase_unstable } from './useFieldBase';\nexport { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';\n"],"names":["Field","renderField_unstable","useField_unstable","useFieldBase_unstable","fieldClassNames","useFieldStyles_unstable"],"mappings":";;;;;;;;;;;;eAUSA,YAAK;;;eAILI,qCAAe;;;eAHfH,iCAAoB;;;eAEpBE,mCAAqB;;;eACJE,6CAAuB;;;eAFxCH,2BAAiB;;;uBAFJ,UAAU;6BACK,gBAAgB;0BACnB,aAAa;8BACT,iBAAiB;sCACE,0BAA0B"}
+{"version":3,"sources":["../src/components/Field/index.ts"],"sourcesContent":["export type {\n  FieldBaseProps,\n  FieldBaseState,\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n} from './Field.types';\nexport { Field } from './Field';\nexport { renderField_unstable } from './renderField';\nexport { useField_unstable } from './useField';\nexport { useFieldBase_unstable } from './useFieldBase';\nexport { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';\n"],"names":["Field","renderField_unstable","useField_unstable","useFieldBase_unstable","fieldClassNames","useFieldStyles_unstable"],"mappings":";;;;;;;;;;;;eAUSA,YAAK;;;eAILI,qCAAe;;;eAHfH,iCAAoB;;;eAEpBE,mCAAqB;;;eACJE,6CAAuB;;;eAFxCH,2BAAiB;;;uBAFJ,aAAU;6BACK,mBAAgB;0BACnB,gBAAa;8BACT,oBAAiB;sCACE,6BAA0B"}

package/lib-commonjs/components/Field/{renderField.js → renderField.cjs}

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "renderField_unstable", {
 });
 const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
 const _reactutilities = require("@fluentui/react-utilities");
-const _index = require("../../contexts/index");
+const _index = require("../../contexts/index.cjs");
 const renderField_unstable = (state, contextValues)=>{
     (0, _reactutilities.assertSlots)(state);
     let { children } = state;

package/lib-commonjs/components/Field/{renderField.js.map → renderField.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/renderField.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldBaseState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldBaseState, contextValues: FieldContextValues): JSXElement => {\n  assertSlots<FieldSlots>(state);\n\n  let { children } = state;\n  if (typeof children === 'function') {\n    children = children(getFieldControlProps(contextValues.field) || {});\n  }\n\n  return (\n    <FieldContextProvider value={contextValues?.field}>\n      <state.root>\n        {state.label && <state.label />}\n        {children}\n        {state.validationMessage && (\n          <state.validationMessage>\n            {state.validationMessageIcon && <state.validationMessageIcon />}\n            {state.validationMessage.children}\n          </state.validationMessage>\n        )}\n\n        {state.hint && <state.hint />}\n      </state.root>\n    </FieldContextProvider>\n  );\n};\n"],"names":["assertSlots","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":";;;;+BAWaG;;;;;;4BAVb,iCAAiD;gCAErB,4BAA4B;uBAEG,uBAAuB;AAM3E,6BAA6B,CAACC,OAAuBC;QAC1DL,2BAAAA,EAAwBI;IAExB,IAAI,EAAEE,QAAQ,EAAE,GAAGF;IACnB,IAAI,OAAOE,aAAa,YAAY;QAClCA,WAAWA,aAASJ,2BAAAA,EAAqBG,cAAcE,KAAK,KAAK,CAAC;IACpE;IAEA,OAAA,WAAA,OACE,eAAA,EAACN,2BAAAA,EAAAA;QAAqBO,KAAK,EAAEH,kBAAAA,QAAAA,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAAeE,KAAK;kBAC/C,WAAA,OAAA,gBAAA,EAACH,MAAMK,IAAI,EAAA;;gBACRL,MAAMM,KAAK,IAAA,WAAA,GAAI,mBAAA,EAACN,MAAMM,KAAK,EAAA,CAAA;gBAC3BJ;gBACAF,MAAMO,iBAAiB,IAAA,WAAA,OACtB,gBAAA,EAACP,MAAMO,iBAAiB,EAAA;;wBACrBP,MAAMQ,qBAAqB,IAAA,WAAA,OAAI,eAAA,EAACR,MAAMQ,qBAAqB,EAAA,CAAA;wBAC3DR,MAAMO,iBAAiB,CAACL,QAAQ;;;gBAIpCF,MAAMS,IAAI,IAAA,WAAA,OAAI,eAAA,EAACT,MAAMS,IAAI,EAAA,CAAA;;;;AAIlC,EAAE"}
+{"version":3,"sources":["../src/components/Field/renderField.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldBaseState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldBaseState, contextValues: FieldContextValues): JSXElement => {\n  assertSlots<FieldSlots>(state);\n\n  let { children } = state;\n  if (typeof children === 'function') {\n    children = children(getFieldControlProps(contextValues.field) || {});\n  }\n\n  return (\n    <FieldContextProvider value={contextValues?.field}>\n      <state.root>\n        {state.label && <state.label />}\n        {children}\n        {state.validationMessage && (\n          <state.validationMessage>\n            {state.validationMessageIcon && <state.validationMessageIcon />}\n            {state.validationMessage.children}\n          </state.validationMessage>\n        )}\n\n        {state.hint && <state.hint />}\n      </state.root>\n    </FieldContextProvider>\n  );\n};\n"],"names":["assertSlots","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":";;;;+BAWaG;;;;;;4BAVb,iCAAiD;gCAErB,4BAA4B;uBAEG,0BAAuB;AAM3E,6BAA6B,CAACC,OAAuBC;QAC1DL,2BAAAA,EAAwBI;IAExB,IAAI,EAAEE,QAAQ,EAAE,GAAGF;IACnB,IAAI,OAAOE,aAAa,YAAY;QAClCA,WAAWA,aAASJ,2BAAAA,EAAqBG,cAAcE,KAAK,KAAK,CAAC;IACpE;IAEA,OAAA,WAAA,OACE,eAAA,EAACN,2BAAAA,EAAAA;QAAqBO,KAAK,EAAEH,kBAAAA,QAAAA,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAAeE,KAAK;kBAC/C,WAAA,OAAA,gBAAA,EAACH,MAAMK,IAAI,EAAA;;gBACRL,MAAMM,KAAK,IAAA,WAAA,GAAI,mBAAA,EAACN,MAAMM,KAAK,EAAA,CAAA;gBAC3BJ;gBACAF,MAAMO,iBAAiB,IAAA,WAAA,OACtB,gBAAA,EAACP,MAAMO,iBAAiB,EAAA;;wBACrBP,MAAMQ,qBAAqB,IAAA,WAAA,OAAI,eAAA,EAACR,MAAMQ,qBAAqB,EAAA,CAAA;wBAC3DR,MAAMO,iBAAiB,CAACL,QAAQ;;;gBAIpCF,MAAMS,IAAI,IAAA,WAAA,OAAI,eAAA,EAACT,MAAMS,IAAI,EAAA,CAAA;;;;AAIlC,EAAE"}

package/lib-commonjs/components/Field/{useField.js → useField.cjs}

@@ -14,7 +14,7 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reacticons = require("@fluentui/react-icons");
 const _reactlabel = require("@fluentui/react-label");
 const _reactutilities = require("@fluentui/react-utilities");
-const _useFieldBase = require("./useFieldBase");
+const _useFieldBase = require("./useFieldBase.cjs");
 const validationMessageIcons = {
     error: /*#__PURE__*/ _react.createElement(_reacticons.DiamondDismiss12Filled, null),
     warning: /*#__PURE__*/ _react.createElement(_reacticons.Warning12Filled, null),

package/lib-commonjs/components/Field/{useField.js.map → useField.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { slot } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\nimport { useFieldBase_unstable } from './useFieldBase';\n\nconst validationMessageIcons = {\n  error: <DiamondDismiss12Filled />,\n  warning: <Warning12Filled />,\n  success: <CheckmarkCircle12Filled />,\n  none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n  const { orientation = 'vertical', size = 'medium', ...fieldProps } = props;\n  const state = useFieldBase_unstable(fieldProps, ref);\n\n  const defaultIcon = validationMessageIcons[state.validationState];\n\n  return {\n    ...state,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    components: { ...state.components, label: Label },\n    label: slot.optional(props.label, {\n      defaultProps: { size, ...state.label },\n      elementType: Label,\n    }),\n    validationMessageIcon: slot.optional(props.validationMessageIcon, {\n      renderByDefault: !!defaultIcon,\n      defaultProps: { children: defaultIcon },\n      elementType: 'span',\n    }),\n    orientation,\n    size,\n  };\n};\n"],"names":["React","CheckmarkCircle12Filled","DiamondDismiss12Filled","Warning12Filled","Label","slot","useFieldBase_unstable","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","orientation","size","fieldProps","state","defaultIcon","validationState","components","label","optional","defaultProps","elementType","validationMessageIcon","renderByDefault","children"],"mappings":"AAAA;;;;;+BA0Baa;;;;;;;iEAxBU,QAAQ;4BAEkD,wBAAwB;4BACnF,wBAAwB;gCACzB,4BAA4B;8BAEX,iBAAiB;AAEvD,MAAMN,yBAAyB;IAC7BC,OAAAA,WAAAA,GAAO,OAAA,aAAA,CAACN,kCAAAA,EAAAA;IACRO,SAAAA,WAAAA,GAAS,OAAA,aAAA,CAACN,2BAAAA,EAAAA;IACVO,SAAAA,WAAAA,GAAS,OAAA,aAAA,CAACT,mCAAAA,EAAAA;IACVU,MAAMC;AACR;AAWO,0BAA0B,CAACE,OAAmBC;IACnD,MAAM,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGC,YAAY,GAAGJ;IACrE,MAAMK,YAAQb,mCAAAA,EAAsBY,YAAYH;IAEhD,MAAMK,cAAcb,sBAAsB,CAACY,MAAME,eAAe,CAAC;IAEjE,OAAO;QACL,GAAGF,KAAK;QACR,4DAA4D;QAC5DG,YAAY;YAAE,GAAGH,MAAMG,UAAU;YAAEC,OAAOnB,iBAAAA;QAAM;QAChDmB,OAAOlB,oBAAAA,CAAKmB,QAAQ,CAACV,MAAMS,KAAK,EAAE;YAChCE,cAAc;gBAAER;gBAAM,GAAGE,MAAMI,KAAK;YAAC;YACrCG,aAAatB,iBAAAA;QACf;QACAuB,uBAAuBtB,oBAAAA,CAAKmB,QAAQ,CAACV,MAAMa,qBAAqB,EAAE;YAChEC,iBAAiB,CAAC,CAACR;YACnBK,cAAc;gBAAEI,UAAUT;YAAY;YACtCM,aAAa;QACf;QACAV;QACAC;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { slot } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\nimport { useFieldBase_unstable } from './useFieldBase';\n\nconst validationMessageIcons = {\n  error: <DiamondDismiss12Filled />,\n  warning: <Warning12Filled />,\n  success: <CheckmarkCircle12Filled />,\n  none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n  const { orientation = 'vertical', size = 'medium', ...fieldProps } = props;\n  const state = useFieldBase_unstable(fieldProps, ref);\n\n  const defaultIcon = validationMessageIcons[state.validationState];\n\n  return {\n    ...state,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    components: { ...state.components, label: Label },\n    label: slot.optional(props.label, {\n      defaultProps: { size, ...state.label },\n      elementType: Label,\n    }),\n    validationMessageIcon: slot.optional(props.validationMessageIcon, {\n      renderByDefault: !!defaultIcon,\n      defaultProps: { children: defaultIcon },\n      elementType: 'span',\n    }),\n    orientation,\n    size,\n  };\n};\n"],"names":["React","CheckmarkCircle12Filled","DiamondDismiss12Filled","Warning12Filled","Label","slot","useFieldBase_unstable","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","orientation","size","fieldProps","state","defaultIcon","validationState","components","label","optional","defaultProps","elementType","validationMessageIcon","renderByDefault","children"],"mappings":"AAAA;;;;;+BA0Baa;;;;;;;iEAxBU,QAAQ;4BAEkD,wBAAwB;4BACnF,wBAAwB;gCACzB,4BAA4B;8BAEX,oBAAiB;AAEvD,MAAMN,yBAAyB;IAC7BC,OAAAA,WAAAA,GAAO,OAAA,aAAA,CAACN,kCAAAA,EAAAA;IACRO,SAAAA,WAAAA,GAAS,OAAA,aAAA,CAACN,2BAAAA,EAAAA;IACVO,SAAAA,WAAAA,GAAS,OAAA,aAAA,CAACT,mCAAAA,EAAAA;IACVU,MAAMC;AACR;AAWO,0BAA0B,CAACE,OAAmBC;IACnD,MAAM,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGC,YAAY,GAAGJ;IACrE,MAAMK,YAAQb,mCAAAA,EAAsBY,YAAYH;IAEhD,MAAMK,cAAcb,sBAAsB,CAACY,MAAME,eAAe,CAAC;IAEjE,OAAO;QACL,GAAGF,KAAK;QACR,4DAA4D;QAC5DG,YAAY;YAAE,GAAGH,MAAMG,UAAU;YAAEC,OAAOnB,iBAAAA;QAAM;QAChDmB,OAAOlB,oBAAAA,CAAKmB,QAAQ,CAACV,MAAMS,KAAK,EAAE;YAChCE,cAAc;gBAAER;gBAAM,GAAGE,MAAMI,KAAK;YAAC;YACrCG,aAAatB,iBAAAA;QACf;QACAuB,uBAAuBtB,oBAAAA,CAAKmB,QAAQ,CAACV,MAAMa,qBAAqB,EAAE;YAChEC,iBAAiB,CAAC,CAACR;YACnBK,cAAc;gBAAEI,UAAUT;YAAY;YACtCM,aAAa;QACf;QACAV;QACAC;IACF;AACF,EAAE"}

package/lib-commonjs/components/Field/useFieldStyles.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFieldStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens, typographyStyles } from \"@fluentui/react-theme\";\nimport { makeResetStyles, makeStyles, mergeClasses } from \"@griffel/react\";\nexport const fieldClassNames = {\n    root: `fui-Field`,\n    label: `fui-Field__label`,\n    validationMessage: `fui-Field__validationMessage`,\n    validationMessageIcon: `fui-Field__validationMessageIcon`,\n    hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'grid'\n    },\n    // In horizontal layout, the field is a grid with the label taking up the entire first column.\n    // The last row is slack space in case the label is taller than the rest of the content.\n    horizontal: {\n        gridTemplateColumns: '33% 1fr',\n        gridTemplateRows: 'auto auto auto 1fr'\n    },\n    // In horizontal layout without a label, replace the label's column with padding.\n    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n    horizontalNoLabel: {\n        paddingLeft: '33%',\n        gridTemplateColumns: '1fr'\n    }\n});\nconst useLabelStyles = makeStyles({\n    base: {\n        maxWidth: 'max-content',\n        maxHeight: 'max-content'\n    },\n    vertical: {\n        paddingTop: tokens.spacingVerticalXXS,\n        paddingBottom: tokens.spacingVerticalXXS,\n        marginBottom: tokens.spacingVerticalXXS\n    },\n    verticalLarge: {\n        paddingTop: '1px',\n        paddingBottom: '1px',\n        marginBottom: tokens.spacingVerticalXS\n    },\n    horizontal: {\n        paddingTop: tokens.spacingVerticalSNudge,\n        paddingBottom: tokens.spacingVerticalSNudge,\n        marginRight: tokens.spacingHorizontalM,\n        gridRowStart: '1',\n        gridRowEnd: '-1'\n    },\n    horizontalSmall: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS\n    },\n    horizontalLarge: {\n        // To align the label text with the Input text, it should be centered within the 40px height of the Input.\n        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.\n        paddingTop: '9px',\n        paddingBottom: '9px'\n    }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n    marginTop: tokens.spacingVerticalXXS,\n    color: tokens.colorNeutralForeground3,\n    ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    withIcon: {\n        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n        paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n    }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n    display: 'inline-block',\n    fontSize: iconSize,\n    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n    marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n    marginRight: tokens.spacingHorizontalXS,\n    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n    lineHeight: '0',\n    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n    verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    warning: {\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    success: {\n        color: tokens.colorPaletteGreenForeground1\n    }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n    const { validationState, size } = state;\n    const horizontal = state.orientation === 'horizontal';\n    const rootStyles = useRootStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n    const labelStyles = useLabelStyles();\n    if (state.label) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.label.className = mergeClasses(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n    }\n    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n    const validationMessageIconStyles = useValidationMessageIconStyles();\n    if (state.validationMessageIcon) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n    }\n    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n    const secondaryTextStyles = useSecondaryTextStyles();\n    if (state.validationMessage) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n    }\n    if (state.hint) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n    }\n    return state;\n};\n"],"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","B2u0y6b","Bxyxcbc","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","size","orientation","rootStyles","className","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"mappings":"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"}

package/lib-commonjs/contexts/{index.js → index.cjs}

@@ -25,6 +25,6 @@ _export(exports, {
         return _useFieldControlProps.useFieldControlProps_unstable;
     }
 });
-const _FieldContext = require("./FieldContext");
-const _useFieldContextValues = require("./useFieldContextValues");
-const _useFieldControlProps = require("./useFieldControlProps");
+const _FieldContext = require("./FieldContext.cjs");
+const _useFieldContextValues = require("./useFieldContextValues.cjs");
+const _useFieldControlProps = require("./useFieldControlProps.cjs");

package/lib-commonjs/contexts/{index.js.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export { FieldContextProvider, useFieldContext_unstable } from './FieldContext';\nexport { useFieldContextValues_unstable } from './useFieldContextValues';\nexport type { FieldControlPropsOptions } from './useFieldControlProps';\nexport { getFieldControlProps, useFieldControlProps_unstable } from './useFieldControlProps';\n"],"names":["FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","getFieldControlProps","useFieldControlProps_unstable"],"mappings":";;;;;;;;;;;;eAASA,kCAAoB;;;eAGpBG,0CAAoB;;;eAFpBD,qDAA8B;;;eADRD,sCAAwB;;;eAGxBG,mDAA6B;;;8BAHG,iBAAiB;uCACjC,0BAA0B;sCAEL,yBAAyB"}
+{"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export { FieldContextProvider, useFieldContext_unstable } from './FieldContext';\nexport { useFieldContextValues_unstable } from './useFieldContextValues';\nexport type { FieldControlPropsOptions } from './useFieldControlProps';\nexport { getFieldControlProps, useFieldControlProps_unstable } from './useFieldControlProps';\n"],"names":["FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","getFieldControlProps","useFieldControlProps_unstable"],"mappings":";;;;;;;;;;;;eAASA,kCAAoB;;;eAGpBG,0CAAoB;;;eAFpBD,qDAA8B;;;eADRD,sCAAwB;;;eAGxBG,mDAA6B;;;8BAHG,oBAAiB;uCACjC,6BAA0B;sCAEL,4BAAyB"}

package/lib-commonjs/contexts/{useFieldControlProps.js → useFieldControlProps.cjs}

@@ -17,7 +17,7 @@ _export(exports, {
         return useFieldControlProps_unstable;
     }
 });
-const _FieldContext = require("./FieldContext");
+const _FieldContext = require("./FieldContext.cjs");
 function useFieldControlProps_unstable(props, options) {
     return getFieldControlProps((0, _FieldContext.useFieldContext_unstable)(), props, options);
 }

package/lib-commonjs/contexts/{useFieldControlProps.js.map → useFieldControlProps.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/useFieldControlProps.ts"],"sourcesContent":["'use client';\n\nimport type { FieldContextValue, FieldControlProps } from '../Field';\nimport { useFieldContext_unstable } from './FieldContext';\n\n/**\n * Options for `useFieldControlProps_unstable`.\n */\nexport type FieldControlPropsOptions = {\n  /**\n   * Skips setting `aria-labelledby` on the control if the `label.htmlFor` refers to the control.\n   *\n   * This should be used with controls that can be the target of a label's `for` prop:\n   * `<button>`, `<input>`, `<progress>`, `<select>`, `<textarea>`.\n   */\n  supportsLabelFor?: boolean;\n\n  /**\n   * Sets `required` instead of `aria-required` when the Field is marked required.\n   *\n   * This should be used with controls that support the `required` prop:\n   * `<input>` (except `range` or `color`), `<select>`, `<textarea>`.\n   */\n  supportsRequired?: boolean;\n\n  /**\n   * Sets the size prop on the control to match the Field's size: `'small' | 'medium' | 'large'`.\n   *\n   * This should be used with controls that have a custom size prop that matches the Field's size prop.\n   */\n  supportsSize?: boolean;\n};\n\n/**\n * Gets the control props from the field context, if this inside a `<Field>`.\n *\n * When called with no arguments, returns the FieldControlProps that should be applied to the control.\n *\n * @returns A FieldControlProps object if inside a `<Field>`, otherwise undefined.\n */\nexport function useFieldControlProps_unstable(): FieldControlProps | undefined;\n\n/**\n * Copies and merges the FieldControlProps with the given props, if this inside a `<Field>`.\n *\n * @param props - The existing props for the control. These will be merged with the control props from the field context.\n * @param options - Option to include the size prop.\n * @returns Merged props if inside a `<Field>`, otherwise the original props, or undefined if no props given.\n */\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props: Props,\n  options?: FieldControlPropsOptions,\n): Props;\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\n\n/**\n * Implementation of useFieldControlProps_unstable.\n * Split out so it can be used directly in renderField_unstable.\n *\n * @internal\n */\nexport function getFieldControlProps<Props extends FieldControlProps>(\n  context: FieldContextValue | undefined,\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  if (!context) {\n    return props;\n  }\n\n  // Create a copy of props so we don't modify the original\n  props = { ...props } as Props;\n\n  const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;\n\n  if (generatedControlId) {\n    props.id ??= generatedControlId;\n  }\n\n  // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer\n  // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).\n  if (labelId && (!options?.supportsLabelFor || labelFor !== props.id)) {\n    props['aria-labelledby'] ??= labelId;\n  }\n\n  // The control is described by the validation message, or hint, or both.\n  // We also preserve and append any aria-describedby from props.\n  // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n  if (validationMessageId || hintId) {\n    // NOTE: Not using ??= since we're merging and overriding the user-provided value.\n    props['aria-describedby'] = [validationMessageId, hintId, props?.['aria-describedby']].filter(Boolean).join(' ');\n  }\n\n  if (validationState === 'error') {\n    props['aria-invalid'] ??= true;\n  }\n\n  if (required) {\n    if (options?.supportsRequired) {\n      (props as { required?: boolean }).required ??= true;\n    } else {\n      props['aria-required'] ??= true;\n    }\n  }\n\n  // Include the size prop if this control supports it\n  if (options?.supportsSize) {\n    (props as { size?: FieldContextValue['size'] }).size ??= context.size;\n  }\n\n  return props;\n}\n"],"names":["useFieldContext_unstable","useFieldControlProps_unstable","props","options","getFieldControlProps","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","id","supportsLabelFor","filter","Boolean","join","supportsRequired","supportsSize","size"],"mappings":"AAAA;;;;;;;;;;;;IAkEgBI,oBAAAA;;;iCAbAH;;;;8BAlDyB,iBAAiB;AAkDnD,SAASA,8BACdC,KAAa,EACbC,OAAkC;IAElC,OAAOC,yBAAqBJ,sCAAAA,KAA4BE,OAAOC;AACjE;AAQO,8BACLE,OAAsC,EACtCH,KAAa,EACbC,OAAkC;IAElC,IAAI,CAACE,SAAS;QACZ,OAAOH;IACT;IAEA,yDAAyD;IACzDA,QAAQ;QAAE,GAAGA,KAAK;IAAC;IAEnB,MAAM,EAAEI,kBAAkB,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,eAAe,EAAE,GAAGP;IAE1G,IAAIC,oBAAoB;YACtBJ;;QAAAA,CAAAA,MAAAA,CAAAA,SAAAA,KAAAA,EAAMW,EAAAA,MAAAA,QAAAA,QAAAA,KAAAA,IAAAA,MAANX,OAAMW,EAAAA,GAAOP;IACf;IAEA,4GAA4G;IAC5G,6GAA6G;IAC7G,IAAIG,WAAY,EAACN,aAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASW,gBAAAA,AAAgB,KAAIN,aAAaN,MAAMW,EAAAA,AAAC,GAAI;YACpEX,SAAM;;QAANA,CAAAA,IAAAA,CAAAA,UAAAA,KAAAA,CAAK,CAAC,kBAAA,kBAAA,AAAkB,MAAA,QAAA,MAAA,KAAA,IAAA,IAAxBA,OAAK,CAAC,gBAAkB,GAAKO;IAC/B;IAEA,wEAAwE;IACxE,+DAA+D;IAC/D,yFAAyF;IACzF,IAAIE,uBAAuBJ,QAAQ;QACjC,kFAAkF;QAClFL,KAAK,CAAC,mBAAmB,GAAG;YAACS;YAAqBJ;YAAQL,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,KAAO,CAAC,mBAAmB;SAAC,CAACa,MAAM,CAACC,SAASC,IAAI,CAAC;IAC9G;IAEA,IAAIL,oBAAoB,SAAS;YAC/BV,SAAM;;QAANA,CAAAA,KAAAA,CAAAA,UAAAA,KAAAA,CAAK,CAAC,eAAA,eAAA,AAAe,MAAA,QAAA,OAAA,KAAA,IAAA,KAArBA,OAAK,CAAC,aAAe,GAAK;IAC5B;IAEA,IAAIQ,UAAU;QACZ,IAAIP,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASe,gBAAgB,EAAE;gBAC5BhB;;YAAD,CAAA,YAAA,CAACA,UAAAA,KAAAA,EAAiCQ,QAAAA,MAAAA,QAAAA,cAAAA,KAAAA,IAAAA,YAAjCR,QAAiCQ,QAAAA,GAAa;QACjD,OAAO;gBACLR,SAAM;;YAANA,CAAAA,KAAAA,WAAAA,KAAAA,CAAK,CAAC,gBAAA,gBAAA,AAAgB,MAAA,QAAA,OAAA,KAAA,IAAA,KAAtBA,OAAK,CAAC,cAAgB,GAAK;QAC7B;IACF;IAEA,oDAAoD;IACpD,IAAIC,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASgB,YAAY,EAAE;YACxBjB;;QAAD,CAAA,QAAA,CAACA,UAAAA,KAAAA,EAA+CkB,IAAAA,MAAAA,QAAAA,UAAAA,KAAAA,IAAAA,QAA/ClB,QAA+CkB,IAAAA,GAASf,QAAQe,IAAI;IACvE;IAEA,OAAOlB;AACT"}
+{"version":3,"sources":["../src/contexts/useFieldControlProps.ts"],"sourcesContent":["'use client';\n\nimport type { FieldContextValue, FieldControlProps } from '../Field';\nimport { useFieldContext_unstable } from './FieldContext';\n\n/**\n * Options for `useFieldControlProps_unstable`.\n */\nexport type FieldControlPropsOptions = {\n  /**\n   * Skips setting `aria-labelledby` on the control if the `label.htmlFor` refers to the control.\n   *\n   * This should be used with controls that can be the target of a label's `for` prop:\n   * `<button>`, `<input>`, `<progress>`, `<select>`, `<textarea>`.\n   */\n  supportsLabelFor?: boolean;\n\n  /**\n   * Sets `required` instead of `aria-required` when the Field is marked required.\n   *\n   * This should be used with controls that support the `required` prop:\n   * `<input>` (except `range` or `color`), `<select>`, `<textarea>`.\n   */\n  supportsRequired?: boolean;\n\n  /**\n   * Sets the size prop on the control to match the Field's size: `'small' | 'medium' | 'large'`.\n   *\n   * This should be used with controls that have a custom size prop that matches the Field's size prop.\n   */\n  supportsSize?: boolean;\n};\n\n/**\n * Gets the control props from the field context, if this inside a `<Field>`.\n *\n * When called with no arguments, returns the FieldControlProps that should be applied to the control.\n *\n * @returns A FieldControlProps object if inside a `<Field>`, otherwise undefined.\n */\nexport function useFieldControlProps_unstable(): FieldControlProps | undefined;\n\n/**\n * Copies and merges the FieldControlProps with the given props, if this inside a `<Field>`.\n *\n * @param props - The existing props for the control. These will be merged with the control props from the field context.\n * @param options - Option to include the size prop.\n * @returns Merged props if inside a `<Field>`, otherwise the original props, or undefined if no props given.\n */\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props: Props,\n  options?: FieldControlPropsOptions,\n): Props;\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\n\n/**\n * Implementation of useFieldControlProps_unstable.\n * Split out so it can be used directly in renderField_unstable.\n *\n * @internal\n */\nexport function getFieldControlProps<Props extends FieldControlProps>(\n  context: FieldContextValue | undefined,\n  props?: Props,\n  options?: FieldControlPropsOptions,\n): Props | undefined {\n  if (!context) {\n    return props;\n  }\n\n  // Create a copy of props so we don't modify the original\n  props = { ...props } as Props;\n\n  const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;\n\n  if (generatedControlId) {\n    props.id ??= generatedControlId;\n  }\n\n  // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer\n  // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).\n  if (labelId && (!options?.supportsLabelFor || labelFor !== props.id)) {\n    props['aria-labelledby'] ??= labelId;\n  }\n\n  // The control is described by the validation message, or hint, or both.\n  // We also preserve and append any aria-describedby from props.\n  // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n  if (validationMessageId || hintId) {\n    // NOTE: Not using ??= since we're merging and overriding the user-provided value.\n    props['aria-describedby'] = [validationMessageId, hintId, props?.['aria-describedby']].filter(Boolean).join(' ');\n  }\n\n  if (validationState === 'error') {\n    props['aria-invalid'] ??= true;\n  }\n\n  if (required) {\n    if (options?.supportsRequired) {\n      (props as { required?: boolean }).required ??= true;\n    } else {\n      props['aria-required'] ??= true;\n    }\n  }\n\n  // Include the size prop if this control supports it\n  if (options?.supportsSize) {\n    (props as { size?: FieldContextValue['size'] }).size ??= context.size;\n  }\n\n  return props;\n}\n"],"names":["useFieldContext_unstable","useFieldControlProps_unstable","props","options","getFieldControlProps","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","id","supportsLabelFor","filter","Boolean","join","supportsRequired","supportsSize","size"],"mappings":"AAAA;;;;;;;;;;;;IAkEgBI,oBAAAA;;;iCAbAH;;;;8BAlDyB,oBAAiB;AAkDnD,SAASA,8BACdC,KAAa,EACbC,OAAkC;IAElC,OAAOC,yBAAqBJ,sCAAAA,KAA4BE,OAAOC;AACjE;AAQO,8BACLE,OAAsC,EACtCH,KAAa,EACbC,OAAkC;IAElC,IAAI,CAACE,SAAS;QACZ,OAAOH;IACT;IAEA,yDAAyD;IACzDA,QAAQ;QAAE,GAAGA,KAAK;IAAC;IAEnB,MAAM,EAAEI,kBAAkB,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,eAAe,EAAE,GAAGP;IAE1G,IAAIC,oBAAoB;YACtBJ;;QAAAA,CAAAA,MAAAA,CAAAA,SAAAA,KAAAA,EAAMW,EAAAA,MAAAA,QAAAA,QAAAA,KAAAA,IAAAA,MAANX,OAAMW,EAAAA,GAAOP;IACf;IAEA,4GAA4G;IAC5G,6GAA6G;IAC7G,IAAIG,WAAY,EAACN,aAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASW,gBAAAA,AAAgB,KAAIN,aAAaN,MAAMW,EAAAA,AAAC,GAAI;YACpEX,SAAM;;QAANA,CAAAA,IAAAA,CAAAA,UAAAA,KAAAA,CAAK,CAAC,kBAAA,kBAAA,AAAkB,MAAA,QAAA,MAAA,KAAA,IAAA,IAAxBA,OAAK,CAAC,gBAAkB,GAAKO;IAC/B;IAEA,wEAAwE;IACxE,+DAA+D;IAC/D,yFAAyF;IACzF,IAAIE,uBAAuBJ,QAAQ;QACjC,kFAAkF;QAClFL,KAAK,CAAC,mBAAmB,GAAG;YAACS;YAAqBJ;YAAQL,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,KAAO,CAAC,mBAAmB;SAAC,CAACa,MAAM,CAACC,SAASC,IAAI,CAAC;IAC9G;IAEA,IAAIL,oBAAoB,SAAS;YAC/BV,SAAM;;QAANA,CAAAA,KAAAA,CAAAA,UAAAA,KAAAA,CAAK,CAAC,eAAA,eAAA,AAAe,MAAA,QAAA,OAAA,KAAA,IAAA,KAArBA,OAAK,CAAC,aAAe,GAAK;IAC5B;IAEA,IAAIQ,UAAU;QACZ,IAAIP,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASe,gBAAgB,EAAE;gBAC5BhB;;YAAD,CAAA,YAAA,CAACA,UAAAA,KAAAA,EAAiCQ,QAAAA,MAAAA,QAAAA,cAAAA,KAAAA,IAAAA,YAAjCR,QAAiCQ,QAAAA,GAAa;QACjD,OAAO;gBACLR,SAAM;;YAANA,CAAAA,KAAAA,WAAAA,KAAAA,CAAK,CAAC,gBAAA,gBAAA,AAAgB,MAAA,QAAA,OAAA,KAAA,IAAA,KAAtBA,OAAK,CAAC,cAAgB,GAAK;QAC7B;IACF;IAEA,oDAAoD;IACpD,IAAIC,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASgB,YAAY,EAAE;YACxBjB;;QAAD,CAAA,QAAA,CAACA,UAAAA,KAAAA,EAA+CkB,IAAAA,MAAAA,QAAAA,UAAAA,KAAAA,IAAAA,QAA/ClB,QAA+CkB,IAAAA,GAASf,QAAQe,IAAI;IACvE;IAEA,OAAOlB;AACT"}

package/lib-commonjs/{index.js → index.cjs}

@@ -40,8 +40,8 @@ _export(exports, {
         return _Field.useField_unstable;
     }
 });
-const _Field = require("./Field");
-const _index = require("./contexts/index");
+const _Field = require("./Field.cjs");
+const _index = require("./contexts/index.cjs");
  // Experimental APIs - will be uncommented in the experimental release branch
  // export { useFieldBase_unstable } from './Field';
  // export type { FieldBaseProps, FieldBaseState } from './Field';

package/lib-commonjs/{index.js.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './Field';\nexport type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './Field';\nexport {\n  FieldContextProvider,\n  useFieldContext_unstable,\n  useFieldContextValues_unstable,\n  useFieldControlProps_unstable,\n} from './contexts/index';\nexport type { FieldControlPropsOptions } from './contexts/index';\n\n// Experimental APIs - will be uncommented in the experimental release branch\n// export { useFieldBase_unstable } from './Field';\n// export type { FieldBaseProps, FieldBaseState } from './Field';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":";;;;;;;;;;;IACEA;2BAAK;;;eAkBLM,2BAAoB;;;eAjBpBL,sBAAe;;;eACfC,2BAAoB;;;eAGpBG,4BAAqB;;IAerBG;oDAA8B;;;eAD9BD,+BAAwB;;IAExBE,6BAA6B;;;;eAlB7BN,8BAAuB;;;eACvBC,wBAAiB;;;uBAEZ,UAAU;uBAgBV,mBAAmB;CAG1B,6EAA6E;CAC7E,mDAAmD;CACnD,iEAAiE"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Field,\n  fieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n  useFieldBase_unstable,\n} from './Field';\nexport type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\n  FieldBaseProps,\n  FieldBaseState,\n} from './Field';\nexport {\n  FieldContextProvider,\n  useFieldContext_unstable,\n  useFieldContextValues_unstable,\n  useFieldControlProps_unstable,\n} from './contexts/index';\nexport type { FieldControlPropsOptions } from './contexts/index';\n\n// Experimental APIs - will be uncommented in the experimental release branch\n// export { useFieldBase_unstable } from './Field';\n// export type { FieldBaseProps, FieldBaseState } from './Field';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","useFieldBase_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":";;;;;;;;;;;IACEA;2BAAK;;;eAkBLM,2BAAoB;;;eAjBpBL,sBAAe;;;eACfC,2BAAoB;;;eAGpBG,4BAAqB;;IAerBG;oDAA8B;;;eAD9BD,+BAAwB;;IAExBE,6BAA6B;;;;eAlB7BN,8BAAuB;;;eACvBC,wBAAiB;;;uBAEZ,aAAU;uBAgBV,sBAAmB;CAG1B,6EAA6E;CAC7E,mDAAmD;CACnD,iEAAiE"}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@fluentui/react-field",
-  "version": "9.5.3",
+  "version": "9.5.4",
   "description": "Fluent UI Field components",
-  "main": "lib-commonjs/index.js",
+  "main": "lib-commonjs/index.cjs",
   "module": "lib/index.js",
   "typings": "./dist/index.d.ts",
   "sideEffects": false,
@@ -12,13 +12,13 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui/react-context-selector": "^9.2.18",
+    "@fluentui/react-context-selector": "^9.2.19",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-jsx-runtime": "^9.4.4",
-    "@fluentui/react-label": "^9.4.3",
-    "@fluentui/react-shared-contexts": "^9.26.2",
-    "@fluentui/react-theme": "^9.2.1",
-    "@fluentui/react-utilities": "^9.26.5",
+    "@fluentui/react-jsx-runtime": "^9.4.5",
+    "@fluentui/react-label": "^9.4.4",
+    "@fluentui/react-shared-contexts": "^9.26.3",
+    "@fluentui/react-theme": "^9.2.2",
+    "@fluentui/react-utilities": "^9.26.6",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"
   },
@@ -36,17 +36,23 @@
   },
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "node": "./lib-commonjs/index.js",
-      "import": "./lib/index.js",
-      "require": "./lib-commonjs/index.js"
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./lib/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./lib-commonjs/index.cjs"
+      }
     },
     "./package.json": "./package.json"
   },
   "files": [
     "*.md",
     "dist/*.d.ts",
+    "dist/*.d.cts",
     "lib",
     "lib-commonjs"
-  ]
+  ],
+  "type": "module"
 }

package/lib-commonjs/components/Field/useFieldStyles.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["useFieldStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n    root: `fui-Field`,\n    label: `fui-Field__label`,\n    validationMessage: `fui-Field__validationMessage`,\n    validationMessageIcon: `fui-Field__validationMessageIcon`,\n    hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'grid'\n    },\n    // In horizontal layout, the field is a grid with the label taking up the entire first column.\n    // The last row is slack space in case the label is taller than the rest of the content.\n    horizontal: {\n        gridTemplateColumns: '33% 1fr',\n        gridTemplateRows: 'auto auto auto 1fr'\n    },\n    // In horizontal layout without a label, replace the label's column with padding.\n    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n    horizontalNoLabel: {\n        paddingLeft: '33%',\n        gridTemplateColumns: '1fr'\n    }\n});\nconst useLabelStyles = makeStyles({\n    base: {\n        maxWidth: 'max-content',\n        maxHeight: 'max-content'\n    },\n    vertical: {\n        paddingTop: tokens.spacingVerticalXXS,\n        paddingBottom: tokens.spacingVerticalXXS,\n        marginBottom: tokens.spacingVerticalXXS\n    },\n    verticalLarge: {\n        paddingTop: '1px',\n        paddingBottom: '1px',\n        marginBottom: tokens.spacingVerticalXS\n    },\n    horizontal: {\n        paddingTop: tokens.spacingVerticalSNudge,\n        paddingBottom: tokens.spacingVerticalSNudge,\n        marginRight: tokens.spacingHorizontalM,\n        gridRowStart: '1',\n        gridRowEnd: '-1'\n    },\n    horizontalSmall: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS\n    },\n    horizontalLarge: {\n        // To align the label text with the Input text, it should be centered within the 40px height of the Input.\n        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.\n        paddingTop: '9px',\n        paddingBottom: '9px'\n    }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n    marginTop: tokens.spacingVerticalXXS,\n    color: tokens.colorNeutralForeground3,\n    ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    withIcon: {\n        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n        paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n    }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n    display: 'inline-block',\n    fontSize: iconSize,\n    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n    marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n    marginRight: tokens.spacingHorizontalXS,\n    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n    lineHeight: '0',\n    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n    verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    warning: {\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    success: {\n        color: tokens.colorPaletteGreenForeground1\n    }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n    const { validationState, size } = state;\n    const horizontal = state.orientation === 'horizontal';\n    const rootStyles = useRootStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n    const labelStyles = useLabelStyles();\n    if (state.label) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.label.className = mergeClasses(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n    }\n    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n    const validationMessageIconStyles = useValidationMessageIconStyles();\n    if (state.validationMessageIcon) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n    }\n    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n    const secondaryTextStyles = useSecondaryTextStyles();\n    if (state.validationMessage) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n    }\n    if (state.hint) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n    }\n    return state;\n};\n"],"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","B2u0y6b","Bxyxcbc","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","size","orientation","rootStyles","className","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCK,eAAe;;;2BAmGY;eAAvBsC;;;uBApGyC,gBAAgB;AACnE,wBAAwB;IAC3BrC,IAAI,EAAE,CAAA,SAAA,CAAW;IACjBC,KAAK,EAAE,CAAA,gBAAA,CAAkB;IACzBC,iBAAiB,EAAE,CAAA,4BAAA,CAA8B;IACjDC,qBAAqB,EAAE,CAAA,gCAAA,CAAkC;IACzDC,IAAI,EAAE,CAAA,eAAA,CAAA;AACV,CAAC;AACD,6CAAA;AACA,MAAMC,QAAQ,GAAG,MAAM;AACvB;;CAEA,GAAI,MAAMC,aAAa,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAU,IAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,UAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,iBAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAH,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAI,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAgBzB,CAAC;AACF,MAAMC,cAAc,GAAA,WAAA,OAAGlB,eAAA,EAAA;IAAAU,IAAA,EAAA;QAAAS,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,aAAA,EAAA;QAAAH,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAZ,UAAA,EAAA;QAAAU,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAG,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,eAAA,EAAA;QAAAP,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAO,eAAA,EAAA;QAAAR,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAN,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAgCtB,CAAC;AACF,MAAMc,6BAA6B,GAAA,WAAA,OAAGhC,oBAAA,EAAA,WAAA,MAAA;IAAA;CAIrC,CAAC;AACF,MAAMiC,sBAAsB,GAAA,WAAA,OAAGhC,eAAA,EAAA;IAAAiC,KAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAnB,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAQ9B,CAAC;AACF,MAAMmB,qCAAqC,GAAA,WAAA,OAAGrC,oBAAA,EAAA,WAAA,YAAA;IAAA;IAAA;CAU7C,CAAC;AACF,MAAMsC,8BAA8B,GAAA,WAAA,OAAGrC,eAAA,EAAA;IAAAiC,KAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAI,OAAA,EAAA;QAAAJ,MAAA,EAAA;IAAA;IAAAK,OAAA,EAAA;QAAAL,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAjB,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAUtC,CAAC;AAGS,iCAAiCwB,KAAK,IAAG;IAChD,MAAM,EAAEC,eAAe,EAAEC,IAAAA,EAAM,GAAGF,KAAK;IACvC,MAAM7B,UAAU,GAAG6B,KAAK,CAACG,WAAW,KAAK,YAAY;IACrD,MAAMC,UAAU,GAAGpC,aAAa,CAAC,CAAC;IAClC,oDAAA;IACAgC,KAAK,CAACtC,IAAI,CAAC2C,SAAS,OAAG7C,mBAAY,EAACC,eAAe,CAACC,IAAI,EAAE0C,UAAU,CAACnC,IAAI,EAAEE,UAAU,IAAIiC,UAAU,CAACjC,UAAU,EAAEA,UAAU,IAAI,CAAC6B,KAAK,CAACrC,KAAK,IAAIyC,UAAU,CAAC9B,iBAAiB,EAAE0B,KAAK,CAACtC,IAAI,CAAC2C,SAAS,CAAC;IACjM,MAAMC,WAAW,GAAG7B,cAAc,CAAC,CAAC;IACpC,IAAIuB,KAAK,CAACrC,KAAK,EAAE;QACb,oDAAA;QACAqC,KAAK,CAACrC,KAAK,CAAC0C,SAAS,GAAG7C,uBAAY,EAACC,eAAe,CAACE,KAAK,EAAE2C,WAAW,CAACrC,IAAI,EAAEE,UAAU,IAAImC,WAAW,CAACnC,UAAU,EAAEA,UAAU,IAAI+B,IAAI,KAAK,OAAO,IAAII,WAAW,CAAClB,eAAe,EAAEjB,UAAU,IAAI+B,IAAI,KAAK,OAAO,IAAII,WAAW,CAACjB,eAAe,EAAE,CAAClB,UAAU,IAAImC,WAAW,CAAC1B,QAAQ,EAAE,CAACT,UAAU,IAAI+B,IAAI,KAAK,OAAO,IAAII,WAAW,CAACtB,aAAa,EAAEgB,KAAK,CAACrC,KAAK,CAAC0C,SAAS,CAAC;IAC/W;IACA,MAAME,kCAAkC,GAAGZ,qCAAqC,CAAC,CAAC;IAClF,MAAMa,2BAA2B,GAAGZ,8BAA8B,CAAC,CAAC;IACpE,IAAII,KAAK,CAACnC,qBAAqB,EAAE;QAC7B,oDAAA;QACAmC,KAAK,CAACnC,qBAAqB,CAACwC,SAAS,OAAG7C,mBAAY,EAACC,eAAe,CAACI,qBAAqB,EAAE0C,kCAAkC,EAAEN,eAAe,KAAK,MAAM,IAAIO,2BAA2B,CAACP,eAAe,CAAC,EAAED,KAAK,CAACnC,qBAAqB,CAACwC,SAAS,CAAC;IACtP;IACA,MAAMI,0BAA0B,GAAGnB,6BAA6B,CAAC,CAAC;IAClE,MAAMoB,mBAAmB,GAAGnB,sBAAsB,CAAC,CAAC;IACpD,IAAIS,KAAK,CAACpC,iBAAiB,EAAE;QACzB,oDAAA;QACAoC,KAAK,CAACpC,iBAAiB,CAACyC,SAAS,OAAG7C,mBAAY,EAACC,eAAe,CAACG,iBAAiB,EAAE6C,0BAA0B,EAAER,eAAe,KAAK,OAAO,IAAIS,mBAAmB,CAAClB,KAAK,EAAE,CAAC,CAACQ,KAAK,CAACnC,qBAAqB,IAAI6C,mBAAmB,CAAChB,QAAQ,EAAEM,KAAK,CAACpC,iBAAiB,CAACyC,SAAS,CAAC;IAC/Q;IACA,IAAIL,KAAK,CAAClC,IAAI,EAAE;QACZ,oDAAA;QACAkC,KAAK,CAAClC,IAAI,CAACuC,SAAS,OAAG7C,mBAAY,EAACC,eAAe,CAACK,IAAI,EAAE2C,0BAA0B,EAAET,KAAK,CAAClC,IAAI,CAACuC,SAAS,CAAC;IAC/G;IACA,OAAOL,KAAK;AAChB,CAAC"}