feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-field/LICENSE

@@ -0,0 +1,15 @@
+@fluentui/react-field
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Fluent UI React is subject to the terms listed at https://aka.ms/fluentui-assets-license

node_modules/@fluentui/react-field/README.md

@@ -0,0 +1,68 @@
+# @fluentui/react-field
+
+**React Field component for [Fluent UI React](https://react.fluentui.dev/)**
+
+## Description
+
+Field adds a label, validation message, and hint text to a control. Any single form control can be used as the child of the Field.
+
+## Usage
+
+To import Field:
+
+```js
+import { Field } from '@fluentui/react-components';
+```
+
+### Examples
+
+Works with many form controls, for example:
+
+```jsx
+<>
+  <Field label="Name">
+    <Input />
+  </Field>
+  <Field label="Description">
+    <Textarea />
+  </Field>
+  <Field label="Size">
+    <RadioGroup>
+      <Radio label="Small" />
+      <Radio label="Medium" />
+      <Radio label="Large" />
+    </RadioGroup>
+  </Field>
+</>
+```
+
+Display hint text:
+
+```jsx
+<Field label="Password" hint="Must be at least 8 characters long.">
+  <Input type="password" />
+</Field>
+```
+
+Display an error message:
+
+```jsx
+<Field label="Re-enter password" validationMessage="Passwords do not match.">
+  <Input type="password" />
+</Field>
+```
+
+See [Fluent UI Storybook](https://react.fluentui.dev/) for more detailed usage examples.
+
+Alternatively, run Storybook locally with:
+
+1. `yarn start`
+2. Select `react-field` from the list.
+
+### Specification
+
+See [SPEC.md](./SPEC.md).
+
+### Migration Guide
+
+If you're upgrading to Fluent UI v9 see [MIGRATION.md](./MIGRATION.md) for guidance on updating the Field component.

node_modules/@fluentui/react-field/dist/index.d.ts

@@ -0,0 +1,204 @@
+import type { ComponentProps } from '@fluentui/react-utilities';
+import type { ComponentState } from '@fluentui/react-utilities';
+import type { ForwardRefComponent } from '@fluentui/react-utilities';
+import type { JSXElement } from '@fluentui/react-utilities';
+import { 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 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: FieldState, 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;
+
+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 { }

node_modules/@fluentui/react-field/lib-commonjs/Field.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    Field: function() {
+        return _index.Field;
+    },
+    fieldClassNames: function() {
+        return _index.fieldClassNames;
+    },
+    renderField_unstable: function() {
+        return _index.renderField_unstable;
+    },
+    useFieldStyles_unstable: function() {
+        return _index.useFieldStyles_unstable;
+    },
+    useField_unstable: function() {
+        return _index.useField_unstable;
+    }
+});
+const _index = require("./components/Field/index");

node_modules/@fluentui/react-field/lib-commonjs/Field.js.map

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

node_modules/@fluentui/react-field/lib-commonjs/components/Field/Field.js

@@ -0,0 +1,26 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Field", {
+    enumerable: true,
+    get: function() {
+        return 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 _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const Field = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useField.useField_unstable)(props, ref);
+    (0, _useFieldStylesstyles.useFieldStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useFieldStyles_unstable')(state);
+    const context = (0, _index.useFieldContextValues_unstable)(state);
+    return (0, _renderField.renderField_unstable)(state, context);
+});
+Field.displayName = 'Field';

node_modules/@fluentui/react-field/lib-commonjs/components/Field/Field.js.map

@@ -0,0 +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"}

node_modules/@fluentui/react-field/lib-commonjs/components/Field/Field.types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

node_modules/@fluentui/react-field/lib-commonjs/components/Field/Field.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Field/Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, DistributiveOmit, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the control inside the Field.\n */\nexport type FieldControlProps = Pick<\n  React.HTMLAttributes<HTMLElement>,\n  'id' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-required'\n>;\n\n/**\n * Slots of the Field component\n */\nexport type FieldSlots = {\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * The label associated with the field.\n   */\n  label?: Slot<typeof Label>;\n\n  /**\n   * A message about the validation state. By default, this is an error message, but it can be a success, warning,\n   * or custom message by setting `validationState`.\n   */\n  validationMessage?: Slot<'div'>;\n\n  /**\n   * The icon associated with the `validationMessage`. This will only be displayed if `validationMessage` is set.\n   *\n   * The default depends on `validationState`:\n   * * error: `<ErrorCircle12Filled />`\n   * * warning: `<Warning12Filled />`\n   * * success: `<CheckmarkCircle12Filled />`\n   * * none: `null`\n   */\n  validationMessageIcon?: Slot<'span'>;\n\n  /**\n   * Additional hint text below the field.\n   */\n  hint?: Slot<'div'>;\n};\n\n/**\n * Field Props\n */\nexport type FieldProps = Omit<ComponentProps<FieldSlots>, 'children'> & {\n  /**\n   * The Field's child can be a single form control, or a render function that takes the props that should be spread on\n   * a form control.\n   *\n   * All form controls in this library can be used directly as children (such as `<Input>` or `<RadioGroup>`).\n   *\n   * For other controls, there are two options:\n   * 1. The child of Field can be a render function that is given the props that should be spread on the control.\n   *    `<Field>{(props) => <MyInput {...props} />}</Field>`\n   * 2. The control itself can merge props from field with useFieldControlProps_unstable().\n   *    `props = useFieldControlProps_unstable(props);`\n   */\n  children?: React.ReactNode | ((props: FieldControlProps) => React.ReactNode);\n\n  /**\n   * The orientation of the label relative to the field component.\n   * This only affects the label, and not the validationMessage or hint (which always appear below the field component).\n   *\n   * @default vertical\n   */\n  orientation?: 'vertical' | 'horizontal';\n\n  /**\n   * The `validationState` affects the display of the `validationMessage` and `validationMessageIcon`.\n   *\n   * * error: (default) The validation message has a red error icon and red text, with `role=\"alert\"` so it is\n   *     announced by screen readers. Additionally, the control inside the field has `aria-invalid` set, which adds a\n   *     red border to some field components (such as `Input`).\n   * * success: The validation message has a green checkmark icon and gray text.\n   * * warning: The validation message has a yellow exclamation icon and gray text, with `role=\"alert\"` so it is\n   *     announced by screen readers.\n   * * none: The validation message has no icon and gray text.\n   *\n   * @default error when validationMessage is set; none otherwise.\n   */\n  validationState?: 'error' | 'warning' | 'success' | 'none';\n\n  /**\n   * Marks the Field as required. If `true`, an asterisk will be appended to the label, and `aria-required` will be set\n   * on the Field's child.\n   */\n  required?: boolean;\n\n  /**\n   * The size of the Field's label.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState = ComponentState<Required<FieldSlots>> &\n  Required<Pick<FieldProps, 'orientation' | 'required' | 'size' | 'validationState'>> &\n  Pick<FieldProps, 'children'> & {\n    /**\n     * The ID generated for the control inside the field, and the default value of label.htmlFor prop.\n     */\n    generatedControlId: string;\n  };\n\nexport type FieldBaseProps = DistributiveOmit<FieldProps, 'orientation' | 'size'>;\n\nexport type FieldBaseState = DistributiveOmit<FieldState, 'orientation' | 'size'>;\n\nexport type FieldContextValue = Readonly<\n  Pick<FieldState, 'generatedControlId' | 'orientation' | 'required' | 'size' | 'validationState'> & {\n    /** The label's for prop. Undefined if there is no label. */\n    labelFor?: string;\n    /** The label's id prop. Undefined if there is no label. */\n    labelId?: string;\n    /** The validationMessage's id prop. Undefined if there is no validationMessage. */\n    validationMessageId?: string;\n    /** The hint's id prop. Undefined if there is no hint. */\n    hintId?: string;\n  }\n>;\n\nexport type FieldContextValues = {\n  field: FieldContextValue;\n};\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

node_modules/@fluentui/react-field/lib-commonjs/components/Field/index.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    Field: function() {
+        return _Field.Field;
+    },
+    fieldClassNames: function() {
+        return _useFieldStylesstyles.fieldClassNames;
+    },
+    renderField_unstable: function() {
+        return _renderField.renderField_unstable;
+    },
+    useFieldBase_unstable: function() {
+        return _useField.useFieldBase_unstable;
+    },
+    useFieldStyles_unstable: function() {
+        return _useFieldStylesstyles.useFieldStyles_unstable;
+    },
+    useField_unstable: function() {
+        return _useField.useField_unstable;
+    }
+});
+const _Field = require("./Field");
+const _renderField = require("./renderField");
+const _useField = require("./useField");
+const _useFieldStylesstyles = require("./useFieldStyles.styles");

node_modules/@fluentui/react-field/lib-commonjs/components/Field/index.js.map

@@ -0,0 +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, useFieldBase_unstable } from './useField';\nexport { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';\n"],"names":["Field","renderField_unstable","useField_unstable","useFieldBase_unstable","fieldClassNames","useFieldStyles_unstable"],"mappings":";;;;;;;;;;;;eAUSA,YAAK;;;eAGLI,qCAAe;;;eAFfH,iCAAoB;;;eACDE,+BAAqB;;;eACvBE,6CAAuB;;;eADxCH,2BAAiB;;;uBAFJ,UAAU;6BACK,gBAAgB;0BACI,aAAa;sCACb,0BAA0B"}

node_modules/@fluentui/react-field/lib-commonjs/components/Field/renderField.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderField_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderField_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const _index = require("../../contexts/index");
+const renderField_unstable = (state, contextValues)=>{
+    (0, _reactutilities.assertSlots)(state);
+    let { children } = state;
+    if (typeof children === 'function') {
+        children = children((0, _index.getFieldControlProps)(contextValues.field) || {});
+    }
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_index.FieldContextProvider, {
+        value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+            children: [
+                state.label && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.label, {}),
+                children,
+                state.validationMessage && /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.validationMessage, {
+                    children: [
+                        state.validationMessageIcon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.validationMessageIcon, {}),
+                        state.validationMessage.children
+                    ]
+                }),
+                state.hint && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.hint, {})
+            ]
+        })
+    });
+};

node_modules/@fluentui/react-field/lib-commonjs/components/Field/renderField.js.map

@@ -0,0 +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, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState, 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,OAAmBC;QACtDL,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"}

node_modules/@fluentui/react-field/lib-commonjs/components/Field/useField.js

@@ -0,0 +1,115 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    useFieldBase_unstable: function() {
+        return useFieldBase_unstable;
+    },
+    useField_unstable: function() {
+        return useField_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+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 validationMessageIcons = {
+    error: /*#__PURE__*/ _react.createElement(_reacticons.DiamondDismiss12Filled, null),
+    warning: /*#__PURE__*/ _react.createElement(_reacticons.Warning12Filled, null),
+    success: /*#__PURE__*/ _react.createElement(_reacticons.CheckmarkCircle12Filled, null),
+    none: undefined
+};
+const useField_unstable = (props, ref)=>{
+    const { orientation = 'vertical', size = 'medium', ...fieldProps } = props;
+    const state = useFieldBase_unstable(fieldProps, ref);
+    const defaultIcon = validationMessageIcons[state.validationState];
+    return {
+        ...state,
+        // eslint-disable-next-line @typescript-eslint/no-deprecated
+        components: {
+            ...state.components,
+            label: _reactlabel.Label
+        },
+        label: _reactutilities.slot.optional(props.label, {
+            defaultProps: {
+                size,
+                ...state.label
+            },
+            elementType: _reactlabel.Label
+        }),
+        validationMessageIcon: _reactutilities.slot.optional(props.validationMessageIcon, {
+            renderByDefault: !!defaultIcon,
+            defaultProps: {
+                children: defaultIcon
+            },
+            elementType: 'span'
+        }),
+        orientation,
+        size
+    };
+};
+const useFieldBase_unstable = (props, ref)=>{
+    const { children, required = false, validationState = props.validationMessage ? 'error' : 'none' } = props;
+    const baseId = (0, _reactutilities.useId)('field-');
+    const generatedControlId = baseId + '__control';
+    const root = _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
+        ...props,
+        ref
+    }, /*excludedPropNames:*/ [
+        'children'
+    ]), {
+        elementType: 'div'
+    });
+    const label = _reactutilities.slot.optional(props.label, {
+        defaultProps: {
+            htmlFor: generatedControlId,
+            id: baseId + '__label',
+            required
+        },
+        elementType: 'label'
+    });
+    const validationMessage = _reactutilities.slot.optional(props.validationMessage, {
+        defaultProps: {
+            id: baseId + '__validationMessage',
+            role: validationState === 'error' || validationState === 'warning' ? 'alert' : undefined
+        },
+        elementType: 'div'
+    });
+    const hint = _reactutilities.slot.optional(props.hint, {
+        defaultProps: {
+            id: baseId + '__hint'
+        },
+        elementType: 'div'
+    });
+    const validationMessageIcon = _reactutilities.slot.optional(props.validationMessageIcon, {
+        renderByDefault: false,
+        elementType: 'span'
+    });
+    return {
+        children,
+        generatedControlId,
+        required,
+        validationState,
+        components: {
+            root: 'div',
+            label: 'label',
+            validationMessage: 'div',
+            validationMessageIcon: 'span',
+            hint: 'div'
+        },
+        root,
+        label,
+        validationMessageIcon,
+        validationMessage,
+        hint
+    };
+};

node_modules/@fluentui/react-field/lib-commonjs/components/Field/useFieldStyles.styles.js

@@ -0,0 +1,177 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    fieldClassNames: function() {
+        return fieldClassNames;
+    },
+    useFieldStyles_unstable: function() {
+        return useFieldStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const fieldClassNames = {
+    root: `fui-Field`,
+    label: `fui-Field__label`,
+    validationMessage: `fui-Field__validationMessage`,
+    validationMessageIcon: `fui-Field__validationMessageIcon`,
+    hint: `fui-Field__hint`
+};
+// Size of the icon in the validation message
+const iconSize = '12px';
+/**
+ * Styles for the root slot
+ */ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        mc9l5x: "f13qh94s"
+    },
+    horizontal: {
+        Budl1dq: "f2wwaib",
+        wkccdc: "f1645dqt"
+    },
+    horizontalNoLabel: {
+        uwmqm3: [
+            "f15jqgz8",
+            "fggqkej"
+        ],
+        Budl1dq: "f1c2z91y"
+    }
+}, {
+    d: [
+        ".f13qh94s{display:grid;}",
+        ".f2wwaib{grid-template-columns:33% 1fr;}",
+        ".f1645dqt{grid-template-rows:auto auto auto 1fr;}",
+        ".f15jqgz8{padding-left:33%;}",
+        ".fggqkej{padding-right:33%;}",
+        ".f1c2z91y{grid-template-columns:1fr;}"
+    ]
+});
+const useLabelStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        B2u0y6b: "f6nezus",
+        Bxyxcbc: "f1iqmcbn"
+    },
+    vertical: {
+        z8tnut: "fclwglc",
+        Byoj8tv: "fywfov9",
+        jrapky: "fyacil5"
+    },
+    verticalLarge: {
+        z8tnut: "f1sl3k7w",
+        Byoj8tv: "f1brlhvm",
+        jrapky: "f8l5zjj"
+    },
+    horizontal: {
+        z8tnut: "fp2oml8",
+        Byoj8tv: "f1tdddsa",
+        t21cq0: [
+            "fkujibs",
+            "f199hnxi"
+        ],
+        Ijaq50: "f16hsg94",
+        nk6f5a: "f1nzqi2z"
+    },
+    horizontalSmall: {
+        z8tnut: "f1ywm7hm",
+        Byoj8tv: "f14wxoun"
+    },
+    horizontalLarge: {
+        z8tnut: "f1hqyr95",
+        Byoj8tv: "fm4hlj0"
+    }
+}, {
+    d: [
+        ".f6nezus{max-width:max-content;}",
+        ".f1iqmcbn{max-height:max-content;}",
+        ".fclwglc{padding-top:var(--spacingVerticalXXS);}",
+        ".fywfov9{padding-bottom:var(--spacingVerticalXXS);}",
+        ".fyacil5{margin-bottom:var(--spacingVerticalXXS);}",
+        ".f1sl3k7w{padding-top:1px;}",
+        ".f1brlhvm{padding-bottom:1px;}",
+        ".f8l5zjj{margin-bottom:var(--spacingVerticalXS);}",
+        ".fp2oml8{padding-top:var(--spacingVerticalSNudge);}",
+        ".f1tdddsa{padding-bottom:var(--spacingVerticalSNudge);}",
+        ".fkujibs{margin-right:var(--spacingHorizontalM);}",
+        ".f199hnxi{margin-left:var(--spacingHorizontalM);}",
+        ".f16hsg94{grid-row-start:1;}",
+        ".f1nzqi2z{grid-row-end:-1;}",
+        ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}",
+        ".f14wxoun{padding-bottom:var(--spacingVerticalXS);}",
+        ".f1hqyr95{padding-top:9px;}",
+        ".fm4hlj0{padding-bottom:9px;}"
+    ]
+});
+const useSecondaryTextBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r5c4z9l", null, [
+    ".r5c4z9l{margin-top:var(--spacingVerticalXXS);color:var(--colorNeutralForeground3);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);}"
+]);
+const useSecondaryTextStyles = /*#__PURE__*/ (0, _react.__styles)({
+    error: {
+        sj55zd: "f1hcrxcs"
+    },
+    withIcon: {
+        uwmqm3: [
+            "frawy03",
+            "fg4c52"
+        ]
+    }
+}, {
+    d: [
+        ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
+        ".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}",
+        ".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}"
+    ]
+});
+const useValidationMessageIconBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("ra7h1uk", "r1rh6bd7", [
+    ".ra7h1uk{display:inline-block;font-size:12px;margin-left:calc(-12px - var(--spacingHorizontalXS));margin-right:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}",
+    ".r1rh6bd7{display:inline-block;font-size:12px;margin-right:calc(-12px - var(--spacingHorizontalXS));margin-left:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}"
+]);
+const useValidationMessageIconStyles = /*#__PURE__*/ (0, _react.__styles)({
+    error: {
+        sj55zd: "f1hcrxcs"
+    },
+    warning: {
+        sj55zd: "f1k5f75o"
+    },
+    success: {
+        sj55zd: "ffmvakt"
+    }
+}, {
+    d: [
+        ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
+        ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}",
+        ".ffmvakt{color:var(--colorPaletteGreenForeground1);}"
+    ]
+});
+const useFieldStyles_unstable = (state)=>{
+    'use no memo';
+    const { validationState, size } = state;
+    const horizontal = state.orientation === 'horizontal';
+    const rootStyles = useRootStyles();
+    state.root.className = (0, _react.mergeClasses)(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);
+    const labelStyles = useLabelStyles();
+    if (state.label) {
+        state.label.className = (0, _react.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);
+    }
+    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();
+    const validationMessageIconStyles = useValidationMessageIconStyles();
+    if (state.validationMessageIcon) {
+        state.validationMessageIcon.className = (0, _react.mergeClasses)(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
+    }
+    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();
+    const secondaryTextStyles = useSecondaryTextStyles();
+    if (state.validationMessage) {
+        state.validationMessage.className = (0, _react.mergeClasses)(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);
+    }
+    if (state.hint) {
+        state.hint.className = (0, _react.mergeClasses)(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);
+    }
+    return state;
+};

node_modules/@fluentui/react-field/lib-commonjs/components/Field/useFieldStyles.styles.raw.js

@@ -0,0 +1,143 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    fieldClassNames: function() {
+        return fieldClassNames;
+    },
+    useFieldStyles_unstable: function() {
+        return useFieldStyles_unstable;
+    }
+});
+const _reacttheme = require("@fluentui/react-theme");
+const _react = require("@griffel/react");
+const fieldClassNames = {
+    root: `fui-Field`,
+    label: `fui-Field__label`,
+    validationMessage: `fui-Field__validationMessage`,
+    validationMessageIcon: `fui-Field__validationMessageIcon`,
+    hint: `fui-Field__hint`
+};
+// Size of the icon in the validation message
+const iconSize = '12px';
+/**
+ * Styles for the root slot
+ */ const useRootStyles = (0, _react.makeStyles)({
+    base: {
+        display: 'grid'
+    },
+    // In horizontal layout, the field is a grid with the label taking up the entire first column.
+    // The last row is slack space in case the label is taller than the rest of the content.
+    horizontal: {
+        gridTemplateColumns: '33% 1fr',
+        gridTemplateRows: 'auto auto auto 1fr'
+    },
+    // In horizontal layout without a label, replace the label's column with padding.
+    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.
+    horizontalNoLabel: {
+        paddingLeft: '33%',
+        gridTemplateColumns: '1fr'
+    }
+});
+const useLabelStyles = (0, _react.makeStyles)({
+    base: {
+        maxWidth: 'max-content',
+        maxHeight: 'max-content'
+    },
+    vertical: {
+        paddingTop: _reacttheme.tokens.spacingVerticalXXS,
+        paddingBottom: _reacttheme.tokens.spacingVerticalXXS,
+        marginBottom: _reacttheme.tokens.spacingVerticalXXS
+    },
+    verticalLarge: {
+        paddingTop: '1px',
+        paddingBottom: '1px',
+        marginBottom: _reacttheme.tokens.spacingVerticalXS
+    },
+    horizontal: {
+        paddingTop: _reacttheme.tokens.spacingVerticalSNudge,
+        paddingBottom: _reacttheme.tokens.spacingVerticalSNudge,
+        marginRight: _reacttheme.tokens.spacingHorizontalM,
+        gridRowStart: '1',
+        gridRowEnd: '-1'
+    },
+    horizontalSmall: {
+        paddingTop: _reacttheme.tokens.spacingVerticalXS,
+        paddingBottom: _reacttheme.tokens.spacingVerticalXS
+    },
+    horizontalLarge: {
+        // To align the label text with the Input text, it should be centered within the 40px height of the Input.
+        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.
+        paddingTop: '9px',
+        paddingBottom: '9px'
+    }
+});
+const useSecondaryTextBaseClassName = (0, _react.makeResetStyles)({
+    marginTop: _reacttheme.tokens.spacingVerticalXXS,
+    color: _reacttheme.tokens.colorNeutralForeground3,
+    ..._reacttheme.typographyStyles.caption1
+});
+const useSecondaryTextStyles = (0, _react.makeStyles)({
+    error: {
+        color: _reacttheme.tokens.colorPaletteRedForeground1
+    },
+    withIcon: {
+        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.
+        paddingLeft: `calc(${iconSize} + ${_reacttheme.tokens.spacingHorizontalXS})`
+    }
+});
+const useValidationMessageIconBaseClassName = (0, _react.makeResetStyles)({
+    display: 'inline-block',
+    fontSize: iconSize,
+    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.
+    marginLeft: `calc(-${iconSize} - ${_reacttheme.tokens.spacingHorizontalXS})`,
+    marginRight: _reacttheme.tokens.spacingHorizontalXS,
+    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.
+    lineHeight: '0',
+    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).
+    verticalAlign: '-1px'
+});
+const useValidationMessageIconStyles = (0, _react.makeStyles)({
+    error: {
+        color: _reacttheme.tokens.colorPaletteRedForeground1
+    },
+    warning: {
+        color: _reacttheme.tokens.colorPaletteDarkOrangeForeground1
+    },
+    success: {
+        color: _reacttheme.tokens.colorPaletteGreenForeground1
+    }
+});
+const useFieldStyles_unstable = (state)=>{
+    'use no memo';
+    const { validationState, size } = state;
+    const horizontal = state.orientation === 'horizontal';
+    const rootStyles = useRootStyles();
+    state.root.className = (0, _react.mergeClasses)(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);
+    const labelStyles = useLabelStyles();
+    if (state.label) {
+        state.label.className = (0, _react.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);
+    }
+    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();
+    const validationMessageIconStyles = useValidationMessageIconStyles();
+    if (state.validationMessageIcon) {
+        state.validationMessageIcon.className = (0, _react.mergeClasses)(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
+    }
+    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();
+    const secondaryTextStyles = useSecondaryTextStyles();
+    if (state.validationMessage) {
+        state.validationMessage.className = (0, _react.mergeClasses)(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);
+    }
+    if (state.hint) {
+        state.hint.className = (0, _react.mergeClasses)(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);
+    }
+    return state;
+};

node_modules/@fluentui/react-field/lib-commonjs/contexts/FieldContext.js

@@ -0,0 +1,24 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    FieldContextProvider: function() {
+        return FieldContextProvider;
+    },
+    useFieldContext_unstable: function() {
+        return useFieldContext_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const FieldContext = /*#__PURE__*/ _react.createContext(undefined);
+const FieldContextProvider = FieldContext.Provider;
+const useFieldContext_unstable = ()=>_react.useContext(FieldContext);

node_modules/@fluentui/react-field/lib-commonjs/contexts/FieldContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/contexts/FieldContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type { FieldContextValue } from '../Field';\n\nconst FieldContext = React.createContext<FieldContextValue | undefined>(undefined);\n\nexport const FieldContextProvider = FieldContext.Provider;\n\nexport const useFieldContext_unstable = (): FieldContextValue | undefined => React.useContext(FieldContext);\n"],"names":["React","FieldContext","createContext","undefined","FieldContextProvider","Provider","useFieldContext_unstable","useContext"],"mappings":"AAAA;;;;;;;;;;;;wBAQaI;;;4BAEAE;;;;;iEARU,QAAQ;AAI/B,MAAML,6BAAeD,OAAME,aAAa,CAAgCC;AAEjE,MAAMC,uBAAuBH,aAAaI,QAAQ,CAAC;AAEnD,MAAMC,2BAA2B,IAAqCN,OAAMO,UAAU,CAACN,cAAc"}

node_modules/@fluentui/react-field/lib-commonjs/contexts/index.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    FieldContextProvider: function() {
+        return _FieldContext.FieldContextProvider;
+    },
+    getFieldControlProps: function() {
+        return _useFieldControlProps.getFieldControlProps;
+    },
+    useFieldContextValues_unstable: function() {
+        return _useFieldContextValues.useFieldContextValues_unstable;
+    },
+    useFieldContext_unstable: function() {
+        return _FieldContext.useFieldContext_unstable;
+    },
+    useFieldControlProps_unstable: function() {
+        return _useFieldControlProps.useFieldControlProps_unstable;
+    }
+});
+const _FieldContext = require("./FieldContext");
+const _useFieldContextValues = require("./useFieldContextValues");
+const _useFieldControlProps = require("./useFieldControlProps");

node_modules/@fluentui/react-field/lib-commonjs/contexts/index.js.map

@@ -0,0 +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"}

node_modules/@fluentui/react-field/lib-commonjs/contexts/useFieldContextValues.js

@@ -0,0 +1,45 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useFieldContextValues_unstable", {
+    enumerable: true,
+    get: function() {
+        return useFieldContextValues_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const useFieldContextValues_unstable = (state)=>{
+    var _state_label, _state_label1, _state_validationMessage, _state_hint;
+    const { generatedControlId, orientation, required, size, validationState } = state;
+    const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;
+    const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;
+    const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;
+    const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;
+    const field = _react.useMemo(()=>({
+            generatedControlId,
+            hintId,
+            labelFor,
+            labelId,
+            orientation,
+            required,
+            size,
+            validationMessageId,
+            validationState
+        }), [
+        generatedControlId,
+        hintId,
+        labelFor,
+        labelId,
+        orientation,
+        required,
+        size,
+        validationMessageId,
+        validationState
+    ]);
+    return {
+        field
+    };
+};

node_modules/@fluentui/react-field/lib-commonjs/contexts/useFieldContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/contexts/useFieldContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type { FieldContextValue, FieldContextValues, FieldState } from '../Field';\n\n/**\n * Get the context values used when rendering Field.\n */\nexport const useFieldContextValues_unstable = (state: FieldState): FieldContextValues => {\n  const { generatedControlId, orientation, required, size, validationState } = state;\n  const labelFor = state.label?.htmlFor;\n  const labelId = state.label?.id;\n  const validationMessageId = state.validationMessage?.id;\n  const hintId = state.hint?.id;\n\n  const field: FieldContextValue = React.useMemo(\n    () => ({\n      generatedControlId,\n      hintId,\n      labelFor,\n      labelId,\n      orientation,\n      required,\n      size,\n      validationMessageId,\n      validationState,\n    }),\n    [generatedControlId, hintId, labelFor, labelId, orientation, required, size, validationMessageId, validationState],\n  );\n\n  return { field };\n};\n"],"names":["React","useFieldContextValues_unstable","state","generatedControlId","orientation","required","size","validationState","labelFor","label","htmlFor","labelId","id","validationMessageId","validationMessage","hintId","hint","field","useMemo"],"mappings":"AAAA;;;;;+BASaC;;;;;;;iEAPU,QAAQ;AAOxB,uCAAuC,CAACC;QAE5BA,cACDA,eACYA,0BACbA;IAJf,MAAM,EAAEC,kBAAkB,EAAEC,WAAW,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,eAAe,EAAE,GAAGL;IAC7E,MAAMM,WAAAA,CAAWN,eAAAA,MAAMO,KAAAA,AAAK,MAAA,QAAXP,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAaQ,OAAO;IACrC,MAAMC,UAAAA,CAAUT,gBAAAA,MAAMO,KAAAA,AAAK,MAAA,QAAXP,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAAaU,EAAE;IAC/B,MAAMC,sBAAAA,CAAsBX,2BAAAA,MAAMY,iBAAAA,AAAiB,MAAA,QAAvBZ,6BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,yBAAyBU,EAAE;IACvD,MAAMG,SAAAA,CAASb,cAAAA,MAAMc,IAAAA,AAAI,MAAA,QAAVd,gBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,YAAYU,EAAE;IAE7B,MAAMK,QAA2BjB,OAAMkB,OAAO,CAC5C,IAAO,CAAA;YACLf;YACAY;YACAP;YACAG;YACAP;YACAC;YACAC;YACAO;YACAN;SACF,CAAA,EACA;QAACJ;QAAoBY;QAAQP;QAAUG;QAASP;QAAaC;QAAUC;QAAMO;QAAqBN;KAAgB;IAGpH,OAAO;QAAEU;IAAM;AACjB,EAAE"}

node_modules/@fluentui/react-field/lib-commonjs/contexts/useFieldControlProps.js

@@ -0,0 +1,79 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    getFieldControlProps: function() {
+        return getFieldControlProps;
+    },
+    useFieldControlProps_unstable: function() {
+        return useFieldControlProps_unstable;
+    }
+});
+const _FieldContext = require("./FieldContext");
+function useFieldControlProps_unstable(props, options) {
+    return getFieldControlProps((0, _FieldContext.useFieldContext_unstable)(), props, options);
+}
+function getFieldControlProps(context, props, options) {
+    if (!context) {
+        return props;
+    }
+    // Create a copy of props so we don't modify the original
+    props = {
+        ...props
+    };
+    const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;
+    if (generatedControlId) {
+        var _props;
+        var _id;
+        (_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;
+    }
+    // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer
+    // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).
+    if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {
+        var _props1, _arialabelledby;
+        var _;
+        (_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;
+    }
+    // The control is described by the validation message, or hint, or both.
+    // We also preserve and append any aria-describedby from props.
+    // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933
+    if (validationMessageId || hintId) {
+        // NOTE: Not using ??= since we're merging and overriding the user-provided value.
+        props['aria-describedby'] = [
+            validationMessageId,
+            hintId,
+            props === null || props === void 0 ? void 0 : props['aria-describedby']
+        ].filter(Boolean).join(' ');
+    }
+    if (validationState === 'error') {
+        var _props2, _ariainvalid;
+        var _1;
+        (_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;
+    }
+    if (required) {
+        if (options === null || options === void 0 ? void 0 : options.supportsRequired) {
+            var _props3;
+            var _required;
+            (_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;
+        } else {
+            var _props4, _ariarequired;
+            var _2;
+            (_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;
+        }
+    }
+    // Include the size prop if this control supports it
+    if (options === null || options === void 0 ? void 0 : options.supportsSize) {
+        var _props5;
+        var _size;
+        (_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;
+    }
+    return props;
+}

node_modules/@fluentui/react-field/lib-commonjs/index.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    Field: function() {
+        return _Field.Field;
+    },
+    FieldContextProvider: function() {
+        return _index.FieldContextProvider;
+    },
+    fieldClassNames: function() {
+        return _Field.fieldClassNames;
+    },
+    renderField_unstable: function() {
+        return _Field.renderField_unstable;
+    },
+    useFieldContextValues_unstable: function() {
+        return _index.useFieldContextValues_unstable;
+    },
+    useFieldContext_unstable: function() {
+        return _index.useFieldContext_unstable;
+    },
+    useFieldControlProps_unstable: function() {
+        return _index.useFieldControlProps_unstable;
+    },
+    useFieldStyles_unstable: function() {
+        return _Field.useFieldStyles_unstable;
+    },
+    useField_unstable: function() {
+        return _Field.useField_unstable;
+    }
+});
+const _Field = require("./Field");
+const _index = require("./contexts/index");
+ // Experimental APIs - will be uncommented in the experimental release branch
+ // export { useFieldBase_unstable } from './Field';
+ // export type { FieldBaseProps, FieldBaseState } from './Field';

node_modules/@fluentui/react-field/lib-commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\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","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":";;;;;;;;;;;IAASA;2BAAK;;;eAUZK,2BAAoB;;;eAVNJ,sBAAe;;;eAAEC,2BAAoB;;kCAYrB;eAA9BK;;;eADAD,+BAAwB;;;eAExBE,oCAA6B;;;eAbwBL,8BAAuB;;qBAAmB;eAAjBC;;;uBAAyB,UAAU;uBAc5G,mBAAmB;CAG1B,6EAA6E;CAC7E,mDAAmD;CACnD,iEAAiE"}

node_modules/@fluentui/react-field/lib/Field.js

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

node_modules/@fluentui/react-field/lib/Field.js.map

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

node_modules/@fluentui/react-field/lib/components/Field/Field.js

@@ -0,0 +1,15 @@
+'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';
+export const Field = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useField_unstable(props, ref);
+    useFieldStyles_unstable(state);
+    useCustomStyleHook_unstable('useFieldStyles_unstable')(state);
+    const context = useFieldContextValues_unstable(state);
+    return renderField_unstable(state, context);
+});
+Field.displayName = 'Field';

node_modules/@fluentui/react-field/lib/components/Field/Field.js.map

@@ -0,0 +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"}

node_modules/@fluentui/react-field/lib/components/Field/Field.types.js

@@ -0,0 +1 @@
+import * as React from 'react';

node_modules/@fluentui/react-field/lib/components/Field/Field.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Field/Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, DistributiveOmit, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the control inside the Field.\n */\nexport type FieldControlProps = Pick<\n  React.HTMLAttributes<HTMLElement>,\n  'id' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-required'\n>;\n\n/**\n * Slots of the Field component\n */\nexport type FieldSlots = {\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * The label associated with the field.\n   */\n  label?: Slot<typeof Label>;\n\n  /**\n   * A message about the validation state. By default, this is an error message, but it can be a success, warning,\n   * or custom message by setting `validationState`.\n   */\n  validationMessage?: Slot<'div'>;\n\n  /**\n   * The icon associated with the `validationMessage`. This will only be displayed if `validationMessage` is set.\n   *\n   * The default depends on `validationState`:\n   * * error: `<ErrorCircle12Filled />`\n   * * warning: `<Warning12Filled />`\n   * * success: `<CheckmarkCircle12Filled />`\n   * * none: `null`\n   */\n  validationMessageIcon?: Slot<'span'>;\n\n  /**\n   * Additional hint text below the field.\n   */\n  hint?: Slot<'div'>;\n};\n\n/**\n * Field Props\n */\nexport type FieldProps = Omit<ComponentProps<FieldSlots>, 'children'> & {\n  /**\n   * The Field's child can be a single form control, or a render function that takes the props that should be spread on\n   * a form control.\n   *\n   * All form controls in this library can be used directly as children (such as `<Input>` or `<RadioGroup>`).\n   *\n   * For other controls, there are two options:\n   * 1. The child of Field can be a render function that is given the props that should be spread on the control.\n   *    `<Field>{(props) => <MyInput {...props} />}</Field>`\n   * 2. The control itself can merge props from field with useFieldControlProps_unstable().\n   *    `props = useFieldControlProps_unstable(props);`\n   */\n  children?: React.ReactNode | ((props: FieldControlProps) => React.ReactNode);\n\n  /**\n   * The orientation of the label relative to the field component.\n   * This only affects the label, and not the validationMessage or hint (which always appear below the field component).\n   *\n   * @default vertical\n   */\n  orientation?: 'vertical' | 'horizontal';\n\n  /**\n   * The `validationState` affects the display of the `validationMessage` and `validationMessageIcon`.\n   *\n   * * error: (default) The validation message has a red error icon and red text, with `role=\"alert\"` so it is\n   *     announced by screen readers. Additionally, the control inside the field has `aria-invalid` set, which adds a\n   *     red border to some field components (such as `Input`).\n   * * success: The validation message has a green checkmark icon and gray text.\n   * * warning: The validation message has a yellow exclamation icon and gray text, with `role=\"alert\"` so it is\n   *     announced by screen readers.\n   * * none: The validation message has no icon and gray text.\n   *\n   * @default error when validationMessage is set; none otherwise.\n   */\n  validationState?: 'error' | 'warning' | 'success' | 'none';\n\n  /**\n   * Marks the Field as required. If `true`, an asterisk will be appended to the label, and `aria-required` will be set\n   * on the Field's child.\n   */\n  required?: boolean;\n\n  /**\n   * The size of the Field's label.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState = ComponentState<Required<FieldSlots>> &\n  Required<Pick<FieldProps, 'orientation' | 'required' | 'size' | 'validationState'>> &\n  Pick<FieldProps, 'children'> & {\n    /**\n     * The ID generated for the control inside the field, and the default value of label.htmlFor prop.\n     */\n    generatedControlId: string;\n  };\n\nexport type FieldBaseProps = DistributiveOmit<FieldProps, 'orientation' | 'size'>;\n\nexport type FieldBaseState = DistributiveOmit<FieldState, 'orientation' | 'size'>;\n\nexport type FieldContextValue = Readonly<\n  Pick<FieldState, 'generatedControlId' | 'orientation' | 'required' | 'size' | 'validationState'> & {\n    /** The label's for prop. Undefined if there is no label. */\n    labelFor?: string;\n    /** The label's id prop. Undefined if there is no label. */\n    labelId?: string;\n    /** The validationMessage's id prop. Undefined if there is no validationMessage. */\n    validationMessageId?: string;\n    /** The hint's id prop. Undefined if there is no hint. */\n    hintId?: string;\n  }\n>;\n\nexport type FieldContextValues = {\n  field: FieldContextValue;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

node_modules/@fluentui/react-field/lib/components/Field/index.js

@@ -0,0 +1,4 @@
+export { Field } from './Field';
+export { renderField_unstable } from './renderField';
+export { useField_unstable, useFieldBase_unstable } from './useField';
+export { fieldClassNames, useFieldStyles_unstable } from './useFieldStyles.styles';

node_modules/@fluentui/react-field/lib/components/Field/index.js.map

@@ -0,0 +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, useFieldBase_unstable } from './useField';\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,EAAEC,qBAAqB,QAAQ,aAAa;AACtE,SAASC,eAAe,EAAEC,uBAAuB,QAAQ,0BAA0B"}

node_modules/@fluentui/react-field/lib/components/Field/renderField.js

@@ -0,0 +1,28 @@
+  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';
+/**
+ * Render the final JSX of Field
+ */ export const renderField_unstable = (state, contextValues)=>{
+    assertSlots(state);
+    let { children } = state;
+    if (typeof children === 'function') {
+        children = children(getFieldControlProps(contextValues.field) || {});
+    }
+    return /*#__PURE__*/ _jsx(FieldContextProvider, {
+        value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field,
+        children: /*#__PURE__*/ _jsxs(state.root, {
+            children: [
+                state.label && /*#__PURE__*/ _jsx(state.label, {}),
+                children,
+                state.validationMessage && /*#__PURE__*/ _jsxs(state.validationMessage, {
+                    children: [
+                        state.validationMessageIcon && /*#__PURE__*/ _jsx(state.validationMessageIcon, {}),
+                        state.validationMessage.children
+                    ]
+                }),
+                state.hint && /*#__PURE__*/ _jsx(state.hint, {})
+            ]
+        })
+    });
+};

node_modules/@fluentui/react-field/lib/components/Field/renderField.js.map

@@ -0,0 +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, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState, 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,OAAmBC;IACtDL,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"}

node_modules/@fluentui/react-field/lib/components/Field/useField.js

@@ -0,0 +1,110 @@
+'use client';
+import * as React from 'react';
+import { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';
+import { Label } from '@fluentui/react-label';
+import { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';
+const validationMessageIcons = {
+    error: /*#__PURE__*/ React.createElement(DiamondDismiss12Filled, null),
+    warning: /*#__PURE__*/ React.createElement(Warning12Filled, null),
+    success: /*#__PURE__*/ React.createElement(CheckmarkCircle12Filled, null),
+    none: undefined
+};
+/**
+ * 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 const useField_unstable = (props, ref)=>{
+    const { orientation = 'vertical', size = 'medium', ...fieldProps } = props;
+    const state = useFieldBase_unstable(fieldProps, ref);
+    const defaultIcon = validationMessageIcons[state.validationState];
+    return {
+        ...state,
+        // eslint-disable-next-line @typescript-eslint/no-deprecated
+        components: {
+            ...state.components,
+            label: Label
+        },
+        label: slot.optional(props.label, {
+            defaultProps: {
+                size,
+                ...state.label
+            },
+            elementType: Label
+        }),
+        validationMessageIcon: slot.optional(props.validationMessageIcon, {
+            renderByDefault: !!defaultIcon,
+            defaultProps: {
+                children: defaultIcon
+            },
+            elementType: 'span'
+        }),
+        orientation,
+        size
+    };
+};
+/**
+ * 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 const useFieldBase_unstable = (props, ref)=>{
+    const { children, required = false, validationState = props.validationMessage ? 'error' : 'none' } = props;
+    const baseId = useId('field-');
+    const generatedControlId = baseId + '__control';
+    const root = slot.always(getIntrinsicElementProps('div', {
+        ...props,
+        ref
+    }, /*excludedPropNames:*/ [
+        'children'
+    ]), {
+        elementType: 'div'
+    });
+    const label = slot.optional(props.label, {
+        defaultProps: {
+            htmlFor: generatedControlId,
+            id: baseId + '__label',
+            required
+        },
+        elementType: 'label'
+    });
+    const validationMessage = slot.optional(props.validationMessage, {
+        defaultProps: {
+            id: baseId + '__validationMessage',
+            role: validationState === 'error' || validationState === 'warning' ? 'alert' : undefined
+        },
+        elementType: 'div'
+    });
+    const hint = slot.optional(props.hint, {
+        defaultProps: {
+            id: baseId + '__hint'
+        },
+        elementType: 'div'
+    });
+    const validationMessageIcon = slot.optional(props.validationMessageIcon, {
+        renderByDefault: false,
+        elementType: 'span'
+    });
+    return {
+        children,
+        generatedControlId,
+        required,
+        validationState,
+        components: {
+            root: 'div',
+            label: 'label',
+            validationMessage: 'div',
+            validationMessageIcon: 'span',
+            hint: 'div'
+        },
+        root,
+        label,
+        validationMessageIcon,
+        validationMessage,
+        hint
+    };
+};

node_modules/@fluentui/react-field/lib/components/Field/useFieldStyles.styles.js

@@ -0,0 +1,121 @@
+'use client';
+
+import { tokens, typographyStyles } from '@fluentui/react-theme';
+import { __resetStyles, __styles, mergeClasses } from '@griffel/react';
+export const fieldClassNames = {
+  root: `fui-Field`,
+  label: `fui-Field__label`,
+  validationMessage: `fui-Field__validationMessage`,
+  validationMessageIcon: `fui-Field__validationMessageIcon`,
+  hint: `fui-Field__hint`
+};
+// Size of the icon in the validation message
+const iconSize = '12px';
+/**
+ * Styles for the root slot
+ */
+const useRootStyles = /*#__PURE__*/__styles({
+  base: {
+    mc9l5x: "f13qh94s"
+  },
+  horizontal: {
+    Budl1dq: "f2wwaib",
+    wkccdc: "f1645dqt"
+  },
+  horizontalNoLabel: {
+    uwmqm3: ["f15jqgz8", "fggqkej"],
+    Budl1dq: "f1c2z91y"
+  }
+}, {
+  d: [".f13qh94s{display:grid;}", ".f2wwaib{grid-template-columns:33% 1fr;}", ".f1645dqt{grid-template-rows:auto auto auto 1fr;}", ".f15jqgz8{padding-left:33%;}", ".fggqkej{padding-right:33%;}", ".f1c2z91y{grid-template-columns:1fr;}"]
+});
+const useLabelStyles = /*#__PURE__*/__styles({
+  base: {
+    B2u0y6b: "f6nezus",
+    Bxyxcbc: "f1iqmcbn"
+  },
+  vertical: {
+    z8tnut: "fclwglc",
+    Byoj8tv: "fywfov9",
+    jrapky: "fyacil5"
+  },
+  verticalLarge: {
+    z8tnut: "f1sl3k7w",
+    Byoj8tv: "f1brlhvm",
+    jrapky: "f8l5zjj"
+  },
+  horizontal: {
+    z8tnut: "fp2oml8",
+    Byoj8tv: "f1tdddsa",
+    t21cq0: ["fkujibs", "f199hnxi"],
+    Ijaq50: "f16hsg94",
+    nk6f5a: "f1nzqi2z"
+  },
+  horizontalSmall: {
+    z8tnut: "f1ywm7hm",
+    Byoj8tv: "f14wxoun"
+  },
+  horizontalLarge: {
+    z8tnut: "f1hqyr95",
+    Byoj8tv: "fm4hlj0"
+  }
+}, {
+  d: [".f6nezus{max-width:max-content;}", ".f1iqmcbn{max-height:max-content;}", ".fclwglc{padding-top:var(--spacingVerticalXXS);}", ".fywfov9{padding-bottom:var(--spacingVerticalXXS);}", ".fyacil5{margin-bottom:var(--spacingVerticalXXS);}", ".f1sl3k7w{padding-top:1px;}", ".f1brlhvm{padding-bottom:1px;}", ".f8l5zjj{margin-bottom:var(--spacingVerticalXS);}", ".fp2oml8{padding-top:var(--spacingVerticalSNudge);}", ".f1tdddsa{padding-bottom:var(--spacingVerticalSNudge);}", ".fkujibs{margin-right:var(--spacingHorizontalM);}", ".f199hnxi{margin-left:var(--spacingHorizontalM);}", ".f16hsg94{grid-row-start:1;}", ".f1nzqi2z{grid-row-end:-1;}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".f14wxoun{padding-bottom:var(--spacingVerticalXS);}", ".f1hqyr95{padding-top:9px;}", ".fm4hlj0{padding-bottom:9px;}"]
+});
+const useSecondaryTextBaseClassName = /*#__PURE__*/__resetStyles("r5c4z9l", null, [".r5c4z9l{margin-top:var(--spacingVerticalXXS);color:var(--colorNeutralForeground3);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);}"]);
+const useSecondaryTextStyles = /*#__PURE__*/__styles({
+  error: {
+    sj55zd: "f1hcrxcs"
+  },
+  withIcon: {
+    uwmqm3: ["frawy03", "fg4c52"]
+  }
+}, {
+  d: [".f1hcrxcs{color:var(--colorPaletteRedForeground1);}", ".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}", ".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}"]
+});
+const useValidationMessageIconBaseClassName = /*#__PURE__*/__resetStyles("ra7h1uk", "r1rh6bd7", [".ra7h1uk{display:inline-block;font-size:12px;margin-left:calc(-12px - var(--spacingHorizontalXS));margin-right:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}", ".r1rh6bd7{display:inline-block;font-size:12px;margin-right:calc(-12px - var(--spacingHorizontalXS));margin-left:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}"]);
+const useValidationMessageIconStyles = /*#__PURE__*/__styles({
+  error: {
+    sj55zd: "f1hcrxcs"
+  },
+  warning: {
+    sj55zd: "f1k5f75o"
+  },
+  success: {
+    sj55zd: "ffmvakt"
+  }
+}, {
+  d: [".f1hcrxcs{color:var(--colorPaletteRedForeground1);}", ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}", ".ffmvakt{color:var(--colorPaletteGreenForeground1);}"]
+});
+/**
+ * Apply styling to the Field slots based on the state
+ */
+export const useFieldStyles_unstable = state => {
+  'use no memo';
+
+  const {
+    validationState,
+    size
+  } = state;
+  const horizontal = state.orientation === 'horizontal';
+  const rootStyles = useRootStyles();
+  state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);
+  const labelStyles = useLabelStyles();
+  if (state.label) {
+    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);
+  }
+  const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();
+  const validationMessageIconStyles = useValidationMessageIconStyles();
+  if (state.validationMessageIcon) {
+    state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
+  }
+  const secondaryTextBaseClassName = useSecondaryTextBaseClassName();
+  const secondaryTextStyles = useSecondaryTextStyles();
+  if (state.validationMessage) {
+    state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);
+  }
+  if (state.hint) {
+    state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);
+  }
+  return state;
+};

node_modules/@fluentui/react-field/lib/components/Field/useFieldStyles.styles.raw.js

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

node_modules/@fluentui/react-field/lib/contexts/FieldContext.js

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

node_modules/@fluentui/react-field/lib/contexts/FieldContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/contexts/FieldContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type { FieldContextValue } from '../Field';\n\nconst FieldContext = React.createContext<FieldContextValue | undefined>(undefined);\n\nexport const FieldContextProvider = FieldContext.Provider;\n\nexport const useFieldContext_unstable = (): FieldContextValue | undefined => React.useContext(FieldContext);\n"],"names":["React","FieldContext","createContext","undefined","FieldContextProvider","Provider","useFieldContext_unstable","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAI/B,MAAMC,eAAeD,MAAME,aAAa,CAAgCC;AAExE,OAAO,MAAMC,uBAAuBH,aAAaI,QAAQ,CAAC;AAE1D,OAAO,MAAMC,2BAA2B,IAAqCN,MAAMO,UAAU,CAACN,cAAc"}

node_modules/@fluentui/react-field/lib/contexts/index.js

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

node_modules/@fluentui/react-field/lib/contexts/index.js.map

@@ -0,0 +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"}

node_modules/@fluentui/react-field/lib/contexts/useFieldContextValues.js

@@ -0,0 +1,36 @@
+'use client';
+import * as React from 'react';
+/**
+ * Get the context values used when rendering Field.
+ */ export const useFieldContextValues_unstable = (state)=>{
+    var _state_label, _state_label1, _state_validationMessage, _state_hint;
+    const { generatedControlId, orientation, required, size, validationState } = state;
+    const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;
+    const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;
+    const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;
+    const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;
+    const field = React.useMemo(()=>({
+            generatedControlId,
+            hintId,
+            labelFor,
+            labelId,
+            orientation,
+            required,
+            size,
+            validationMessageId,
+            validationState
+        }), [
+        generatedControlId,
+        hintId,
+        labelFor,
+        labelId,
+        orientation,
+        required,
+        size,
+        validationMessageId,
+        validationState
+    ]);
+    return {
+        field
+    };
+};

node_modules/@fluentui/react-field/lib/contexts/useFieldContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/contexts/useFieldContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type { FieldContextValue, FieldContextValues, FieldState } from '../Field';\n\n/**\n * Get the context values used when rendering Field.\n */\nexport const useFieldContextValues_unstable = (state: FieldState): FieldContextValues => {\n  const { generatedControlId, orientation, required, size, validationState } = state;\n  const labelFor = state.label?.htmlFor;\n  const labelId = state.label?.id;\n  const validationMessageId = state.validationMessage?.id;\n  const hintId = state.hint?.id;\n\n  const field: FieldContextValue = React.useMemo(\n    () => ({\n      generatedControlId,\n      hintId,\n      labelFor,\n      labelId,\n      orientation,\n      required,\n      size,\n      validationMessageId,\n      validationState,\n    }),\n    [generatedControlId, hintId, labelFor, labelId, orientation, required, size, validationMessageId, validationState],\n  );\n\n  return { field };\n};\n"],"names":["React","useFieldContextValues_unstable","state","generatedControlId","orientation","required","size","validationState","labelFor","label","htmlFor","labelId","id","validationMessageId","validationMessage","hintId","hint","field","useMemo"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAI/B;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;QAE5BA,cACDA,eACYA,0BACbA;IAJf,MAAM,EAAEC,kBAAkB,EAAEC,WAAW,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,eAAe,EAAE,GAAGL;IAC7E,MAAMM,YAAWN,eAAAA,MAAMO,KAAK,cAAXP,mCAAAA,aAAaQ,OAAO;IACrC,MAAMC,WAAUT,gBAAAA,MAAMO,KAAK,cAAXP,oCAAAA,cAAaU,EAAE;IAC/B,MAAMC,uBAAsBX,2BAAAA,MAAMY,iBAAiB,cAAvBZ,+CAAAA,yBAAyBU,EAAE;IACvD,MAAMG,UAASb,cAAAA,MAAMc,IAAI,cAAVd,kCAAAA,YAAYU,EAAE;IAE7B,MAAMK,QAA2BjB,MAAMkB,OAAO,CAC5C,IAAO,CAAA;YACLf;YACAY;YACAP;YACAG;YACAP;YACAC;YACAC;YACAO;YACAN;QACF,CAAA,GACA;QAACJ;QAAoBY;QAAQP;QAAUG;QAASP;QAAaC;QAAUC;QAAMO;QAAqBN;KAAgB;IAGpH,OAAO;QAAEU;IAAM;AACjB,EAAE"}

node_modules/@fluentui/react-field/lib/contexts/useFieldControlProps.js

@@ -0,0 +1,66 @@
+'use client';
+import { useFieldContext_unstable } from './FieldContext';
+export function useFieldControlProps_unstable(props, options) {
+    return getFieldControlProps(useFieldContext_unstable(), props, options);
+}
+/**
+ * Implementation of useFieldControlProps_unstable.
+ * Split out so it can be used directly in renderField_unstable.
+ *
+ * @internal
+ */ export function getFieldControlProps(context, props, options) {
+    if (!context) {
+        return props;
+    }
+    // Create a copy of props so we don't modify the original
+    props = {
+        ...props
+    };
+    const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;
+    if (generatedControlId) {
+        var _props;
+        var _id;
+        (_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;
+    }
+    // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer
+    // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).
+    if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {
+        var _props1, _arialabelledby;
+        var _;
+        (_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;
+    }
+    // The control is described by the validation message, or hint, or both.
+    // We also preserve and append any aria-describedby from props.
+    // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933
+    if (validationMessageId || hintId) {
+        // NOTE: Not using ??= since we're merging and overriding the user-provided value.
+        props['aria-describedby'] = [
+            validationMessageId,
+            hintId,
+            props === null || props === void 0 ? void 0 : props['aria-describedby']
+        ].filter(Boolean).join(' ');
+    }
+    if (validationState === 'error') {
+        var _props2, _ariainvalid;
+        var _1;
+        (_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;
+    }
+    if (required) {
+        if (options === null || options === void 0 ? void 0 : options.supportsRequired) {
+            var _props3;
+            var _required;
+            (_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;
+        } else {
+            var _props4, _ariarequired;
+            var _2;
+            (_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;
+        }
+    }
+    // Include the size prop if this control supports it
+    if (options === null || options === void 0 ? void 0 : options.supportsSize) {
+        var _props5;
+        var _size;
+        (_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;
+    }
+    return props;
+}

node_modules/@fluentui/react-field/lib/index.js

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

node_modules/@fluentui/react-field/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type {\n  FieldContextValue,\n  FieldContextValues,\n  FieldControlProps,\n  FieldProps,\n  FieldSlots,\n  FieldState,\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","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":"AAAA,SAASA,KAAK,EAAEC,eAAe,EAAEC,oBAAoB,EAAEC,uBAAuB,EAAEC,iBAAiB,QAAQ,UAAU;AASnH,SACEC,oBAAoB,EACpBC,wBAAwB,EACxBC,8BAA8B,EAC9BC,6BAA6B,QACxB,mBAAmB;CAG1B,6EAA6E;CAC7E,mDAAmD;CACnD,iEAAiE"}

node_modules/@fluentui/react-field/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@fluentui/react-field",
+  "version": "9.5.0",
+  "description": "Fluent UI Field components",
+  "main": "lib-commonjs/index.js",
+  "module": "lib/index.js",
+  "typings": "./dist/index.d.ts",
+  "sideEffects": false,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/microsoft/fluentui"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "@fluentui/react-context-selector": "^9.2.15",
+    "@fluentui/react-icons": "^2.0.245",
+    "@fluentui/react-jsx-runtime": "^9.4.1",
+    "@fluentui/react-label": "^9.4.0",
+    "@fluentui/react-shared-contexts": "^9.26.2",
+    "@fluentui/react-theme": "^9.2.1",
+    "@fluentui/react-utilities": "^9.26.2",
+    "@griffel/react": "^1.5.32",
+    "@swc/helpers": "^0.5.1"
+  },
+  "peerDependencies": {
+    "@types/react": ">=16.14.0 <20.0.0",
+    "@types/react-dom": ">=16.9.0 <20.0.0",
+    "react": ">=16.14.0 <20.0.0",
+    "react-dom": ">=16.14.0 <20.0.0"
+  },
+  "beachball": {
+    "disallowedChangeTypes": [
+      "major",
+      "prerelease"
+    ]
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "node": "./lib-commonjs/index.js",
+      "import": "./lib/index.js",
+      "require": "./lib-commonjs/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "*.md",
+    "dist/*.d.ts",
+    "lib",
+    "lib-commonjs"
+  ]
+}