@fluentui/react-field 9.0.0-alpha.26 → 9.0.0-alpha.27

package/.swcrc

@@ -0,0 +1,30 @@
+{
+  "$schema": "https://json.schemastore.org/swcrc",
+  "exclude": [
+    "/testing",
+    "/**/*.cy.ts",
+    "/**/*.cy.tsx",
+    "/**/*.spec.ts",
+    "/**/*.spec.tsx",
+    "/**/*.test.ts",
+    "/**/*.test.tsx"
+  ],
+  "jsc": {
+    "parser": {
+      "syntax": "typescript",
+      "tsx": true,
+      "decorators": false,
+      "dynamicImport": false
+    },
+    "externalHelpers": true,
+    "transform": {
+      "react": {
+        "runtime": "classic",
+        "useSpread": true
+      }
+    },
+    "target": "es2019"
+  },
+  "minify": false,
+  "sourceMaps": true
+}

package/CHANGELOG.json

@@ -2,7 +2,64 @@
   "name": "@fluentui/react-field",
   "entries": [
     {
-      "date": "Thu, 16 Mar 2023 14:33:33 GMT",
+      "date": "Tue, 21 Mar 2023 21:18:46 GMT",
+      "tag": "@fluentui/react-field_v9.0.0-alpha.27",
+      "version": "9.0.0-alpha.27",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "makotom@microsoft.com",
+            "package": "@fluentui/react-field",
+            "commit": "7fde5c94869ff9841b142b7ff1d0a3df0ab58f74",
+            "comment": "chore: Bumping version of @fluentui/react-icons to ^2.0.196."
+          },
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui/react-field",
+            "commit": "2fac1a139149bd13b76b1306207bc988dca9c72c",
+            "comment": "chore: migrate to swc transpilation approach."
+          },
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui/react-field",
+            "commit": "ead1c6d4c2ac3f3596b62b8cbc07b0a03041f11f",
+            "comment": "fix: add node field to package.json exports map."
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-field",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.15",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-field",
+            "comment": "Bump @fluentui/react-label to v9.1.5",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-field",
+            "comment": "Bump @fluentui/react-theme to v9.1.7",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-field",
+            "comment": "Bump @fluentui/react-utilities to v9.7.2",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-field",
+            "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 16 Mar 2023 14:36:59 GMT",
       "tag": "@fluentui/react-field_v9.0.0-alpha.26",
       "version": "9.0.0-alpha.26",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,28 @@
 # Change Log - @fluentui/react-field
 
-This log was last generated on Thu, 16 Mar 2023 14:33:33 GMT and should not be manually modified.
+This log was last generated on Tue, 21 Mar 2023 21:18:46 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.0.0-alpha.27](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.0.0-alpha.27)
+
+Tue, 21 Mar 2023 21:18:46 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.0.0-alpha.26..@fluentui/react-field_v9.0.0-alpha.27)
+
+### Changes
+
+- chore: Bumping version of @fluentui/react-icons to ^2.0.196. ([PR #27100](https://github.com/microsoft/fluentui/pull/27100) by makotom@microsoft.com)
+- chore: migrate to swc transpilation approach. ([PR #27250](https://github.com/microsoft/fluentui/pull/27250) by tristan.watanabe@gmail.com)
+- fix: add node field to package.json exports map. ([PR #27154](https://github.com/microsoft/fluentui/pull/27154) by tristan.watanabe@gmail.com)
+- Bump @fluentui/react-context-selector to v9.1.15 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-label to v9.1.5 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-theme to v9.1.7 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-utilities to v9.7.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+
 ## [9.0.0-alpha.26](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.0.0-alpha.26)
 
-Thu, 16 Mar 2023 14:33:33 GMT 
+Thu, 16 Mar 2023 14:36:59 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.0.0-alpha.25..@fluentui/react-field_v9.0.0-alpha.26)
 
 ### Changes

package/lib/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sourceRoot":"../src/","sources":["packages/react-components/react-field/src/Field.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './components/Field/index';\n"]}
+{"version":3,"names":[],"sources":["../src/Field.ts"],"sourcesContent":["export * from './components/Field/index';\n"],"mappings":"AAAA,cAAc"}

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

@@ -1 +1 @@
-{"version":3,"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","Field","forwardRef","props","ref","state","displayName"],"sources":["../src/packages/react-components/react-field/src/components/Field/Field.tsx"],"sourcesContent":["import * 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';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nField.displayName = 'Field';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,SAASC,oBAAoB,QAAQ,eAAe;AACpD,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,uBAAuB,QAAQ,kBAAkB;AAE1D,OAAO,MAAMC,KAAK,gBAAoCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpF,MAAMC,KAAK,GAAGN,iBAAiB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAC3CJ,uBAAuB,CAACK,KAAK,CAAC;EAC9B,OAAOP,oBAAoB,CAACO,KAAK,CAAC;AACpC,CAAC,CAAC;AAEFJ,KAAK,CAACK,WAAW,GAAG,OAAO"}
+{"version":3,"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","Field","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/Field/Field.tsx"],"sourcesContent":["import * 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';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nField.displayName = 'Field';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAGvB,SAASC,oBAAoB,QAAQ;AACrC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,uBAAuB,QAAQ;AAExC,OAAO,MAAMC,KAAA,gBAAyCJ,KAAA,CAAMK,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrF,MAAMC,KAAA,GAAQN,iBAAA,CAAkBI,KAAA,EAAOC,GAAA;EACvCJ,uBAAA,CAAwBK,KAAA;EACxB,OAAOP,oBAAA,CAAqBO,KAAA;AAC9B;AAEAJ,KAAA,CAAMK,WAAW,GAAG"}

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

@@ -1,2 +1,2 @@
-export {};
+import * as React from 'react';
 //# sourceMappingURL=Field.types.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Field.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-field/src/components/Field/Field.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the Field's child element.\n */\nexport type FieldChildProps = 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>`), as well\n   * as intrinsic form controls like `<input>` or `<textarea>`. Custom controls can also be used as long as they\n   * accept FieldChildProps and spread them on the appropriate element.\n   *\n   * For more complex scenarios, a render function can be used to pass the FieldChildProps to the appropriate control.\n   */\n  children?: React.ReactElement<FieldChildProps> | null | ((props: FieldChildProps) => 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.\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' | 'validationState'>>;\n"]}
+{"version":3,"names":["React"],"sources":["../../../src/components/Field/Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the Field's child element.\n */\nexport type FieldChildProps = 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>`), as well\n   * as intrinsic form controls like `<input>` or `<textarea>`. Custom controls can also be used as long as they\n   * accept FieldChildProps and spread them on the appropriate element.\n   *\n   * For more complex scenarios, a render function can be used to pass the FieldChildProps to the appropriate control.\n   */\n  children?: React.ReactElement<FieldChildProps> | null | ((props: FieldChildProps) => 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.\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' | 'validationState'>>;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-field/src/components/Field/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC","sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles';\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/Field/index.ts"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/Field/renderField.js

@@ -8,16 +8,6 @@ export const renderField_unstable = state => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }, slots.label && /*#__PURE__*/React.createElement(slots.label, {
-    ...slotProps.label
-  }), slotProps.root.children, slots.validationMessage && /*#__PURE__*/React.createElement(slots.validationMessage, {
-    ...slotProps.validationMessage
-  }, slots.validationMessageIcon && /*#__PURE__*/React.createElement(slots.validationMessageIcon, {
-    ...slotProps.validationMessageIcon
-  }), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/React.createElement(slots.hint, {
-    ...slotProps.hint
-  }));
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.label && /*#__PURE__*/React.createElement(slots.label, slotProps.label), slotProps.root.children, slots.validationMessage && /*#__PURE__*/React.createElement(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/React.createElement(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/React.createElement(slots.hint, slotProps.hint));
 };
 //# sourceMappingURL=renderField.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","renderField_unstable","state","slots","slotProps","createElement","root","label","children","validationMessage","validationMessageIcon","hint"],"sources":["../src/packages/react-components/react-field/src/components/Field/renderField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState) => {\n  const { slots, slotProps } = getSlots<FieldSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && <slots.label {...slotProps.label} />}\n      {slotProps.root.children}\n      {slots.validationMessage && (\n        <slots.validationMessage {...slotProps.validationMessage}>\n          {slots.validationMessageIcon && <slots.validationMessageIcon {...slotProps.validationMessageIcon} />}\n          {slotProps.validationMessage.children}\n        </slots.validationMessage>\n      )}\n      {slots.hint && <slots.hint {...slotProps.hint} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,oBAAoB,GAAIC,KAAiB,IAAI;EACxD,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAaE,KAAK,CAAC;EAExD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,GAC3BH,KAAK,CAACI,KAAK,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACI,KAAK;IAAA,GAAKH,SAAS,CAACG;EAAK,EAAI,EACnDH,SAAS,CAACE,IAAI,CAACE,QAAQ,EACvBL,KAAK,CAACM,iBAAiB,iBACtBV,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACM,iBAAiB;IAAA,GAAKL,SAAS,CAACK;EAAiB,GACrDN,KAAK,CAACO,qBAAqB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACO,qBAAqB;IAAA,GAAKN,SAAS,CAACM;EAAqB,EAAI,EACnGN,SAAS,CAACK,iBAAiB,CAACD,QAAQ,CAExC,EACAL,KAAK,CAACQ,IAAI,iBAAIZ,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACQ,IAAI;IAAA,GAAKP,SAAS,CAACO;EAAI,EAAI,CACtC;AAEjB,CAAC"}
+{"version":3,"names":["React","getSlots","renderField_unstable","state","slots","slotProps","createElement","root","label","children","validationMessage","validationMessageIcon","hint"],"sources":["../../../src/components/Field/renderField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState) => {\n  const { slots, slotProps } = getSlots<FieldSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && <slots.label {...slotProps.label} />}\n      {slotProps.root.children}\n      {slots.validationMessage && (\n        <slots.validationMessage {...slotProps.validationMessage}>\n          {slots.validationMessageIcon && <slots.validationMessageIcon {...slotProps.validationMessageIcon} />}\n          {slotProps.validationMessage.children}\n        </slots.validationMessage>\n      )}\n      {slots.hint && <slots.hint {...slotProps.hint} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,oBAAA,GAAwBC,KAAA,IAAsB;EACzD,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAqBE,KAAA;EAElD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,KAAK,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,KAAK,EAAKH,SAAA,CAAUG,KAAK,GAC/CH,SAAA,CAAUE,IAAI,CAACE,QAAQ,EACvBL,KAAA,CAAMM,iBAAiB,iBACtBV,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,iBAAiB,EAAKL,SAAA,CAAUK,iBAAiB,EACrDN,KAAA,CAAMO,qBAAqB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMO,qBAAqB,EAAKN,SAAA,CAAUM,qBAAqB,GAC/FN,SAAA,CAAUK,iBAAiB,CAACD,QAAQ,GAGxCL,KAAA,CAAMQ,IAAI,iBAAIZ,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMQ,IAAI,EAAKP,SAAA,CAAUO,IAAI;AAGnD"}

package/lib/components/Field/useField.js

@@ -1,3 +1,6 @@
+var _controlProps, _arialabelledby,
+  // Assign the child a generated ID if doesn't already have an ID
+  _controlProps1, _controlProps2, _ariainvalid, _controlProps3, _ariarequired;
 import * as React from 'react';
 import { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';
 import { Label } from '@fluentui/react-label';
@@ -18,7 +21,6 @@ const validationMessageIcons = {
  * @param ref - Ref to the root
  */
 export const useField_unstable = (props, ref) => {
-  var _a, _b, _c, _d;
   const {
     children,
     orientation = 'vertical',
@@ -36,10 +38,8 @@ export const useField_unstable = (props, ref) => {
       id: baseId + '__label',
       required,
       size
-      // htmlFor is handled below
     }
   });
-
   const validationMessage = resolveShorthand(props.validationMessage, {
     defaultProps: {
       id: baseId + '__validationMessage',
@@ -58,14 +58,15 @@ export const useField_unstable = (props, ref) => {
       children: defaultIcon
     }
   });
-  const controlProps = /*#__PURE__*/React.isValidElement(children) ? {
+  const controlProps = /*#__PURE__*/ /*#__PURE__*/React.isValidElement(children) ? {
     ...children.props
   } : {};
   if (label) {
-    (_a = controlProps['aria-labelledby']) !== null && _a !== void 0 ? _a : controlProps['aria-labelledby'] = label.id;
+    var _;
+    (_ = (_controlProps = controlProps)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _controlProps[_arialabelledby] = label.id;
     if (!label.htmlFor) {
-      // Assign the child a generated ID if doesn't already have an ID
-      (_b = controlProps.id) !== null && _b !== void 0 ? _b : controlProps.id = baseId + '__control';
+      var _id;
+      (_id = (_controlProps1 = controlProps).id) !== null && _id !== void 0 ? _id : _controlProps1.id = baseId + '__control';
       label.htmlFor = controlProps.id;
     }
   }
@@ -76,10 +77,12 @@ export const useField_unstable = (props, ref) => {
     controlProps['aria-describedby'] = [validationMessage === null || validationMessage === void 0 ? void 0 : validationMessage.id, hint === null || hint === void 0 ? void 0 : hint.id, controlProps['aria-describedby']].filter(Boolean).join(' ');
   }
   if (validationState === 'error') {
-    (_c = controlProps['aria-invalid']) !== null && _c !== void 0 ? _c : controlProps['aria-invalid'] = true;
+    var _1;
+    (_1 = (_controlProps2 = controlProps)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _controlProps2[_ariainvalid] = true;
   }
   if (required) {
-    (_d = controlProps['aria-required']) !== null && _d !== void 0 ? _d : controlProps['aria-required'] = true;
+    var _2;
+    (_2 = (_controlProps3 = controlProps)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _controlProps3[_ariarequired] = true;
   }
   if ( /*#__PURE__*/React.isValidElement(children)) {
     root.children = /*#__PURE__*/React.cloneElement(children, controlProps);

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

@@ -1 +1 @@
-{"version":3,"names":["React","CheckmarkCircle12Filled","ErrorCircle12Filled","Warning12Filled","Label","getNativeElementProps","resolveShorthand","useId","validationMessageIcons","error","createElement","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","root","label","defaultProps","id","role","hint","defaultIcon","validationMessageIcon","controlProps","isValidElement","_a","htmlFor","_b","filter","Boolean","join","_c","_d","cloneElement","components"],"sources":["../src/packages/react-components/react-field/src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { FieldChildProps, FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n  error: <ErrorCircle12Filled />,\n  warning: <Warning12Filled />,\n  success: <CheckmarkCircle12Filled />,\n  none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n  const {\n    children,\n    orientation = 'vertical',\n    required,\n    validationState = props.validationMessage ? 'error' : 'none',\n    size,\n  } = props;\n\n  const baseId = useId('field-');\n\n  const root = getNativeElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']);\n\n  const label = resolveShorthand(props.label, {\n    defaultProps: {\n      id: baseId + '__label',\n      required,\n      size,\n      // htmlFor is handled below\n    },\n  });\n\n  const validationMessage = resolveShorthand(props.validationMessage, {\n    defaultProps: {\n      id: baseId + '__validationMessage',\n      role: validationState === 'error' ? 'alert' : undefined,\n    },\n  });\n\n  const hint = resolveShorthand(props.hint, {\n    defaultProps: {\n      id: baseId + '__hint',\n    },\n  });\n\n  const defaultIcon = validationMessageIcons[validationState];\n  const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n    required: !!defaultIcon,\n    defaultProps: {\n      children: defaultIcon,\n    },\n  });\n\n  const controlProps: FieldChildProps = React.isValidElement(children) ? { ...children.props } : {};\n\n  if (label) {\n    controlProps['aria-labelledby'] ??= label.id;\n\n    if (!label.htmlFor) {\n      // Assign the child a generated ID if doesn't already have an ID\n      controlProps.id ??= baseId + '__control';\n      label.htmlFor = controlProps.id;\n    }\n  }\n\n  if (validationMessage || hint) {\n    // The control is described by the validation message, or hint, or both\n    // We also preserve and append any aria-describedby supplied by the user\n    // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n    controlProps['aria-describedby'] = [validationMessage?.id, hint?.id, controlProps['aria-describedby']]\n      .filter(Boolean)\n      .join(' ');\n  }\n\n  if (validationState === 'error') {\n    controlProps['aria-invalid'] ??= true;\n  }\n\n  if (required) {\n    controlProps['aria-required'] ??= true;\n  }\n\n  if (React.isValidElement(children)) {\n    root.children = React.cloneElement(children, controlProps);\n  } else if (typeof children === 'function') {\n    root.children = children(controlProps);\n  }\n\n  return {\n    orientation,\n    validationState,\n    components: {\n      root: 'div',\n      label: Label,\n      validationMessage: 'div',\n      validationMessageIcon: 'span',\n      hint: 'div',\n    },\n    root,\n    label,\n    validationMessageIcon,\n    validationMessage,\n    hint,\n  };\n};\n"],"mappings":"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"}
+{"version":3,"names":["_controlProps","_arialabelledby","_controlProps1","_controlProps2","_ariainvalid","_controlProps3","_ariarequired","React","CheckmarkCircle12Filled","ErrorCircle12Filled","Warning12Filled","Label","getNativeElementProps","resolveShorthand","useId","validationMessageIcons","error","createElement","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","root","label","defaultProps","id","role","hint","defaultIcon","validationMessageIcon","controlProps","isValidElement","_","htmlFor","_id","filter","Boolean","join","_1","_2","cloneElement","components"],"sources":["../../../src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { FieldChildProps, FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n  error: <ErrorCircle12Filled />,\n  warning: <Warning12Filled />,\n  success: <CheckmarkCircle12Filled />,\n  none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n  const {\n    children,\n    orientation = 'vertical',\n    required,\n    validationState = props.validationMessage ? 'error' : 'none',\n    size,\n  } = props;\n\n  const baseId = useId('field-');\n\n  const root = getNativeElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']);\n\n  const label = resolveShorthand(props.label, {\n    defaultProps: {\n      id: baseId + '__label',\n      required,\n      size,\n      // htmlFor is handled below\n    },\n  });\n\n  const validationMessage = resolveShorthand(props.validationMessage, {\n    defaultProps: {\n      id: baseId + '__validationMessage',\n      role: validationState === 'error' ? 'alert' : undefined,\n    },\n  });\n\n  const hint = resolveShorthand(props.hint, {\n    defaultProps: {\n      id: baseId + '__hint',\n    },\n  });\n\n  const defaultIcon = validationMessageIcons[validationState];\n  const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n    required: !!defaultIcon,\n    defaultProps: {\n      children: defaultIcon,\n    },\n  });\n\n  const controlProps: FieldChildProps = React.isValidElement(children) ? { ...children.props } : {};\n\n  if (label) {\n    controlProps['aria-labelledby'] ??= label.id;\n\n    if (!label.htmlFor) {\n      // Assign the child a generated ID if doesn't already have an ID\n      controlProps.id ??= baseId + '__control';\n      label.htmlFor = controlProps.id;\n    }\n  }\n\n  if (validationMessage || hint) {\n    // The control is described by the validation message, or hint, or both\n    // We also preserve and append any aria-describedby supplied by the user\n    // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n    controlProps['aria-describedby'] = [validationMessage?.id, hint?.id, controlProps['aria-describedby']]\n      .filter(Boolean)\n      .join(' ');\n  }\n\n  if (validationState === 'error') {\n    controlProps['aria-invalid'] ??= true;\n  }\n\n  if (required) {\n    controlProps['aria-required'] ??= true;\n  }\n\n  if (React.isValidElement(children)) {\n    root.children = React.cloneElement(children, controlProps);\n  } else if (typeof children === 'function') {\n    root.children = children(controlProps);\n  }\n\n  return {\n    orientation,\n    validationState,\n    components: {\n      root: 'div',\n      label: Label,\n      validationMessage: 'div',\n      validationMessageIcon: 'span',\n      hint: 'div',\n    },\n    root,\n    label,\n    validationMessageIcon,\n    validationMessage,\n    hint,\n  };\n};\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","orientation","rootStyles","className","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["../src/packages/react-components/react-field/src/components/Field/useFieldStyles.ts"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { FieldSlots, FieldState } from './Field.types';\n\nexport const fieldClassNames: SlotClassNames<FieldSlots> = {\n  root: `fui-Field`,\n  label: `fui-Field__label`,\n  validationMessage: `fui-Field__validationMessage`,\n  validationMessageIcon: `fui-Field__validationMessageIcon`,\n  hint: `fui-Field__hint`,\n};\n\n// Size of the icon in the validation message\nconst iconSize = '12px';\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'grid',\n  },\n\n  // In horizontal layout, the field is a grid with the label taking up the entire first column.\n  // The last row is slack space in case the label is taller than the rest of the content.\n  horizontal: {\n    gridTemplateColumns: '33% 1fr',\n    gridTemplateRows: 'auto auto auto 1fr',\n  },\n\n  // In horizontal layout without a label, replace the label's column with padding.\n  // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n  horizontalNoLabel: {\n    paddingLeft: '33%',\n    gridTemplateColumns: '1fr',\n  },\n});\n\nconst useLabelStyles = makeStyles({\n  base: {\n    paddingTop: tokens.spacingVerticalXXS,\n    paddingBottom: tokens.spacingVerticalXXS,\n  },\n\n  large: {\n    paddingTop: '1px',\n    paddingBottom: '1px',\n  },\n\n  vertical: {\n    marginBottom: tokens.spacingVerticalXXS,\n  },\n\n  verticalLarge: {\n    marginBottom: tokens.spacingVerticalXS,\n  },\n\n  horizontal: {\n    marginRight: tokens.spacingHorizontalM,\n    gridRowStart: '1',\n    gridRowEnd: '-1',\n  },\n});\n\nconst useSecondaryTextBaseClassName = makeResetStyles({\n  marginTop: tokens.spacingVerticalXXS,\n  color: tokens.colorNeutralForeground3,\n  ...typographyStyles.caption1,\n});\n\nconst useSecondaryTextStyles = makeStyles({\n  error: {\n    color: tokens.colorPaletteRedForeground1,\n  },\n\n  withIcon: {\n    // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n    paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`,\n  },\n});\n\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n  display: 'inline-block',\n  fontSize: iconSize,\n  // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n  marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n  marginRight: tokens.spacingHorizontalXS,\n  // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n  lineHeight: '0',\n  // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n  verticalAlign: '-1px',\n});\n\nconst useValidationMessageIconStyles = makeStyles({\n  error: {\n    color: tokens.colorPaletteRedForeground1,\n  },\n  warning: {\n    color: tokens.colorPaletteDarkOrangeForeground1,\n  },\n  success: {\n    color: tokens.colorPaletteGreenForeground1,\n  },\n});\n\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = (state: FieldState) => {\n  const { validationState } = state;\n  const horizontal = state.orientation === 'horizontal';\n\n  const rootStyles = useRootStyles();\n  state.root.className = mergeClasses(\n    fieldClassNames.root,\n    rootStyles.base,\n    horizontal && rootStyles.horizontal,\n    horizontal && !state.label && rootStyles.horizontalNoLabel,\n    state.root.className,\n  );\n\n  const labelStyles = useLabelStyles();\n  if (state.label) {\n    state.label.className = mergeClasses(\n      fieldClassNames.label,\n      labelStyles.base,\n      horizontal && labelStyles.horizontal,\n      !horizontal && labelStyles.vertical,\n      state.label.size === 'large' && labelStyles.large,\n      !horizontal && state.label.size === 'large' && labelStyles.verticalLarge,\n      state.label.className,\n    );\n  }\n\n  const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n  const validationMessageIconStyles = useValidationMessageIconStyles();\n  if (state.validationMessageIcon) {\n    state.validationMessageIcon.className = mergeClasses(\n      fieldClassNames.validationMessageIcon,\n      validationMessageIconBaseClassName,\n      validationState !== 'none' && validationMessageIconStyles[validationState],\n      state.validationMessageIcon.className,\n    );\n  }\n\n  const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n  const secondaryTextStyles = useSecondaryTextStyles();\n  if (state.validationMessage) {\n    state.validationMessage.className = mergeClasses(\n      fieldClassNames.validationMessage,\n      secondaryTextBaseClassName,\n      validationState === 'error' && secondaryTextStyles.error,\n      !!state.validationMessageIcon && secondaryTextStyles.withIcon,\n      state.validationMessage.className,\n    );\n  }\n\n  if (state.hint) {\n    state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n  }\n};\n"],"mappings":"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"}
+{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","orientation","rootStyles","className","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["../../../src/components/Field/useFieldStyles.ts"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { FieldSlots, FieldState } from './Field.types';\n\nexport const fieldClassNames: SlotClassNames<FieldSlots> = {\n  root: `fui-Field`,\n  label: `fui-Field__label`,\n  validationMessage: `fui-Field__validationMessage`,\n  validationMessageIcon: `fui-Field__validationMessageIcon`,\n  hint: `fui-Field__hint`,\n};\n\n// Size of the icon in the validation message\nconst iconSize = '12px';\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'grid',\n  },\n\n  // In horizontal layout, the field is a grid with the label taking up the entire first column.\n  // The last row is slack space in case the label is taller than the rest of the content.\n  horizontal: {\n    gridTemplateColumns: '33% 1fr',\n    gridTemplateRows: 'auto auto auto 1fr',\n  },\n\n  // In horizontal layout without a label, replace the label's column with padding.\n  // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n  horizontalNoLabel: {\n    paddingLeft: '33%',\n    gridTemplateColumns: '1fr',\n  },\n});\n\nconst useLabelStyles = makeStyles({\n  base: {\n    paddingTop: tokens.spacingVerticalXXS,\n    paddingBottom: tokens.spacingVerticalXXS,\n  },\n\n  large: {\n    paddingTop: '1px',\n    paddingBottom: '1px',\n  },\n\n  vertical: {\n    marginBottom: tokens.spacingVerticalXXS,\n  },\n\n  verticalLarge: {\n    marginBottom: tokens.spacingVerticalXS,\n  },\n\n  horizontal: {\n    marginRight: tokens.spacingHorizontalM,\n    gridRowStart: '1',\n    gridRowEnd: '-1',\n  },\n});\n\nconst useSecondaryTextBaseClassName = makeResetStyles({\n  marginTop: tokens.spacingVerticalXXS,\n  color: tokens.colorNeutralForeground3,\n  ...typographyStyles.caption1,\n});\n\nconst useSecondaryTextStyles = makeStyles({\n  error: {\n    color: tokens.colorPaletteRedForeground1,\n  },\n\n  withIcon: {\n    // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n    paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`,\n  },\n});\n\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n  display: 'inline-block',\n  fontSize: iconSize,\n  // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n  marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n  marginRight: tokens.spacingHorizontalXS,\n  // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n  lineHeight: '0',\n  // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n  verticalAlign: '-1px',\n});\n\nconst useValidationMessageIconStyles = makeStyles({\n  error: {\n    color: tokens.colorPaletteRedForeground1,\n  },\n  warning: {\n    color: tokens.colorPaletteDarkOrangeForeground1,\n  },\n  success: {\n    color: tokens.colorPaletteGreenForeground1,\n  },\n});\n\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = (state: FieldState) => {\n  const { validationState } = state;\n  const horizontal = state.orientation === 'horizontal';\n\n  const rootStyles = useRootStyles();\n  state.root.className = mergeClasses(\n    fieldClassNames.root,\n    rootStyles.base,\n    horizontal && rootStyles.horizontal,\n    horizontal && !state.label && rootStyles.horizontalNoLabel,\n    state.root.className,\n  );\n\n  const labelStyles = useLabelStyles();\n  if (state.label) {\n    state.label.className = mergeClasses(\n      fieldClassNames.label,\n      labelStyles.base,\n      horizontal && labelStyles.horizontal,\n      !horizontal && labelStyles.vertical,\n      state.label.size === 'large' && labelStyles.large,\n      !horizontal && state.label.size === 'large' && labelStyles.verticalLarge,\n      state.label.className,\n    );\n  }\n\n  const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n  const validationMessageIconStyles = useValidationMessageIconStyles();\n  if (state.validationMessageIcon) {\n    state.validationMessageIcon.className = mergeClasses(\n      fieldClassNames.validationMessageIcon,\n      validationMessageIconBaseClassName,\n      validationState !== 'none' && validationMessageIconStyles[validationState],\n      state.validationMessageIcon.className,\n    );\n  }\n\n  const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n  const secondaryTextStyles = useSecondaryTextStyles();\n  if (state.validationMessage) {\n    state.validationMessage.className = mergeClasses(\n      fieldClassNames.validationMessage,\n      secondaryTextBaseClassName,\n      validationState === 'error' && secondaryTextStyles.error,\n      !!state.validationMessageIcon && secondaryTextStyles.withIcon,\n      state.validationMessage.className,\n    );\n  }\n\n  if (state.hint) {\n    state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n  }\n};\n"],"mappings":"AAAA,SAASA,MAAM,EAAEC,gBAAgB,QAAQ;AAEzC,SAAAC,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ;AAG1D,OAAO,MAAMC,eAAA,GAA8C;EACzDC,IAAA,EAAO,WAAU;EACjBC,KAAA,EAAQ,kBAAiB;EACzBC,iBAAA,EAAoB,8BAA6B;EACjDC,qBAAA,EAAwB,kCAAiC;EACzDC,IAAA,EAAO;AACT;AAEA;AACA,MAAMC,QAAA,GAAW;AAEjB;;;AAGA,MAAMC,aAAA,gBAAgBT,QAAA;EAAAU,IAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,iBAAA;IAAAC,MAAA;IAAAH,OAAA;EAAA;AAAA;EAAAI,CAAA;AAAA,EAkBtB;AAEA,MAAMC,cAAA,gBAAiBlB,QAAA;EAAAU,IAAA;IAAAS,MAAA;IAAAC,OAAA;EAAA;EAAAC,KAAA;IAAAF,MAAA;IAAAC,OAAA;EAAA;EAAAE,QAAA;IAAAC,MAAA;EAAA;EAAAC,aAAA;IAAAD,MAAA;EAAA;EAAAX,UAAA;IAAAa,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAV,CAAA;AAAA,EAwBvB;AAEA,MAAMW,6BAAA,gBAAgC7B,aAAA,wPAItC;AAEA,MAAM8B,sBAAA,gBAAyB7B,QAAA;EAAA8B,KAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAhB,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAS/B;AAEA,MAAMgB,qCAAA,gBAAwClC,aAAA,4XAU9C;AAEA,MAAMmC,8BAAA,gBAAiClC,QAAA;EAAA8B,KAAA;IAAAC,MAAA;EAAA;EAAAI,OAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;AAAA;EAAAd,CAAA;AAAA,EAUvC;AAEA;;;AAGA,OAAO,MAAMoB,uBAAA,GAA2BC,KAAA,IAAsB;EAC5D,MAAM;IAAEC;EAAe,CAAE,GAAGD,KAAA;EAC5B,MAAM1B,UAAA,GAAa0B,KAAA,CAAME,WAAW,KAAK;EAEzC,MAAMC,UAAA,GAAahC,aAAA;EACnB6B,KAAA,CAAMnC,IAAI,CAACuC,SAAS,GAAGzC,YAAA,CACrBC,eAAA,CAAgBC,IAAI,EACpBsC,UAAA,CAAW/B,IAAI,EACfE,UAAA,IAAc6B,UAAA,CAAW7B,UAAU,EACnCA,UAAA,IAAc,CAAC0B,KAAA,CAAMlC,KAAK,IAAIqC,UAAA,CAAW1B,iBAAiB,EAC1DuB,KAAA,CAAMnC,IAAI,CAACuC,SAAS;EAGtB,MAAMC,WAAA,GAAczB,cAAA;EACpB,IAAIoB,KAAA,CAAMlC,KAAK,EAAE;IACfkC,KAAA,CAAMlC,KAAK,CAACsC,SAAS,GAAGzC,YAAA,CACtBC,eAAA,CAAgBE,KAAK,EACrBuC,WAAA,CAAYjC,IAAI,EAChBE,UAAA,IAAc+B,WAAA,CAAY/B,UAAU,EACpC,CAACA,UAAA,IAAc+B,WAAA,CAAYrB,QAAQ,EACnCgB,KAAA,CAAMlC,KAAK,CAACwC,IAAI,KAAK,WAAWD,WAAA,CAAYtB,KAAK,EACjD,CAACT,UAAA,IAAc0B,KAAA,CAAMlC,KAAK,CAACwC,IAAI,KAAK,WAAWD,WAAA,CAAYnB,aAAa,EACxEc,KAAA,CAAMlC,KAAK,CAACsC,SAAS;EAEzB;EAEA,MAAMG,kCAAA,GAAqCZ,qCAAA;EAC3C,MAAMa,2BAAA,GAA8BZ,8BAAA;EACpC,IAAII,KAAA,CAAMhC,qBAAqB,EAAE;IAC/BgC,KAAA,CAAMhC,qBAAqB,CAACoC,SAAS,GAAGzC,YAAA,CACtCC,eAAA,CAAgBI,qBAAqB,EACrCuC,kCAAA,EACAN,eAAA,KAAoB,UAAUO,2BAA2B,CAACP,eAAA,CAAgB,EAC1ED,KAAA,CAAMhC,qBAAqB,CAACoC,SAAS;EAEzC;EAEA,MAAMK,0BAAA,GAA6BnB,6BAAA;EACnC,MAAMoB,mBAAA,GAAsBnB,sBAAA;EAC5B,IAAIS,KAAA,CAAMjC,iBAAiB,EAAE;IAC3BiC,KAAA,CAAMjC,iBAAiB,CAACqC,SAAS,GAAGzC,YAAA,CAClCC,eAAA,CAAgBG,iBAAiB,EACjC0C,0BAAA,EACAR,eAAA,KAAoB,WAAWS,mBAAA,CAAoBlB,KAAK,EACxD,CAAC,CAACQ,KAAA,CAAMhC,qBAAqB,IAAI0C,mBAAA,CAAoBhB,QAAQ,EAC7DM,KAAA,CAAMjC,iBAAiB,CAACqC,SAAS;EAErC;EAEA,IAAIJ,KAAA,CAAM/B,IAAI,EAAE;IACd+B,KAAA,CAAM/B,IAAI,CAACmC,SAAS,GAAGzC,YAAA,CAAaC,eAAA,CAAgBK,IAAI,EAAEwC,0BAAA,EAA4BT,KAAA,CAAM/B,IAAI,CAACmC,SAAS;EAC5G;AACF"}

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-field/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGnH,mDAAmD;AACnD,OAAO,EAAE,4BAA4B,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type { FieldProps, FieldSlots, FieldState } from './Field';\n\n// eslint-disable-next-line deprecation/deprecation\nexport { getDeprecatedFieldClassNames, makeDeprecatedField } from './util/makeDeprecatedField';\n// eslint-disable-next-line deprecation/deprecation\nexport type { DeprecatedFieldProps } from './util/makeDeprecatedField';\n"]}
+{"version":3,"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","getDeprecatedFieldClassNames","makeDeprecatedField"],"sources":["../src/index.ts"],"sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type { FieldProps, FieldSlots, FieldState } from './Field';\n\n// eslint-disable-next-line deprecation/deprecation\nexport { getDeprecatedFieldClassNames, makeDeprecatedField } from './util/makeDeprecatedField';\n// eslint-disable-next-line deprecation/deprecation\nexport type { DeprecatedFieldProps } from './util/makeDeprecatedField';\n"],"mappings":"AAAA,SAASA,KAAK,EAAEC,eAAe,EAAEC,oBAAoB,EAAEC,uBAAuB,EAAEC,iBAAiB,QAAQ;AAGzG;AACA,SAASC,4BAA4B,EAAEC,mBAAmB,QAAQ"}

package/lib/util/makeDeprecatedField.js

@@ -1,5 +1,4 @@
-/* eslint-disable deprecation/deprecation */
-import * as React from 'react';
+/* eslint-disable deprecation/deprecation */import * as React from 'react';
 import { Field, fieldClassNames } from '../Field';
 /**
  * Partition the props used by the Field itself, from the props that are passed to the underlying field component.
@@ -50,9 +49,7 @@ export function makeDeprecatedField(Control, options = {}) {
   } = options;
   const DeprecatedField = /*#__PURE__*/React.forwardRef((props, ref) => {
     const [fieldProps, controlProps] = getPartitionedFieldProps(mapProps(props));
-    return /*#__PURE__*/React.createElement(Field, {
-      ...fieldProps
-    }, /*#__PURE__*/React.createElement(Control, {
+    return /*#__PURE__*/React.createElement(Field, fieldProps, /*#__PURE__*/React.createElement(Control, {
       ...controlProps,
       ref: ref
     }));

package/lib/util/makeDeprecatedField.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Field","fieldClassNames","getPartitionedFieldProps","props","className","control","hint","label","orientation","required","root","size","style","validationMessage","validationMessageIcon","validationState","restOfProps","makeDeprecatedField","Control","options","mapProps","displayName","DeprecatedField","forwardRef","ref","fieldProps","controlProps","createElement","getDeprecatedFieldClassNames","controlRootClassName"],"sources":["../src/packages/react-components/react-field/src/util/makeDeprecatedField.tsx"],"sourcesContent":["/* eslint-disable deprecation/deprecation */\nimport * as React from 'react';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from '../Field';\nimport { Field, fieldClassNames } from '../Field';\n\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport type DeprecatedFieldProps<ControlProps> = ControlProps & {\n  root?: FieldProps;\n  control?: ControlProps;\n} & Pick<\n    FieldProps,\n    | 'className'\n    | 'hint'\n    | 'label'\n    | 'orientation'\n    | 'style'\n    | 'validationMessage'\n    | 'validationMessageIcon'\n    | 'validationState'\n  >;\n\n/**\n * Partition the props used by the Field itself, from the props that are passed to the underlying field component.\n */\nfunction getPartitionedFieldProps<ControlProps>(\n  props: DeprecatedFieldProps<ControlProps> & Pick<FieldProps, 'required' | 'size'>,\n) {\n  const {\n    className,\n    control,\n    hint,\n    label,\n    orientation,\n    required,\n    root,\n    size,\n    style,\n    validationMessage,\n    validationMessageIcon,\n    validationState = 'none',\n    ...restOfProps\n  } = props;\n\n  return [\n    {\n      className,\n      hint,\n      label,\n      orientation,\n      required,\n      size,\n      style,\n      validationMessage,\n      validationMessageIcon,\n      validationState,\n      ...root,\n    },\n    {\n      required,\n      size,\n      ...restOfProps,\n      ...control,\n    },\n  ];\n}\n\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport function makeDeprecatedField<ControlProps>(\n  Control: React.ComponentType<ControlProps>,\n  options: {\n    mapProps?: (props: DeprecatedFieldProps<ControlProps>) => DeprecatedFieldProps<ControlProps>;\n    displayName?: string;\n  } = {},\n) {\n  const { mapProps = props => props, displayName = `${Control.displayName}Field` } = options;\n\n  const DeprecatedField = React.forwardRef((props, ref) => {\n    const [fieldProps, controlProps] = getPartitionedFieldProps(mapProps(props));\n    return (\n      <Field {...fieldProps}>\n        {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n        <Control {...(controlProps as any)} ref={ref as any} />\n      </Field>\n    );\n  }) as ForwardRefComponent<DeprecatedFieldProps<ControlProps>>;\n\n  DeprecatedField.displayName = displayName;\n\n  return DeprecatedField;\n}\n\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport const getDeprecatedFieldClassNames = (controlRootClassName: string) => ({\n  ...fieldClassNames,\n  control: controlRootClassName,\n});\n"],"mappings":"AAAA;AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,SAASC,KAAK,EAAEC,eAAe,QAAQ,UAAU;AAqBjD;;;AAGA,SAASC,wBAAwBA,CAC/BC,KAAiF;EAEjF,MAAM;IACJC,SAAS;IACTC,OAAO;IACPC,IAAI;IACJC,KAAK;IACLC,WAAW;IACXC,QAAQ;IACRC,IAAI;IACJC,IAAI;IACJC,KAAK;IACLC,iBAAiB;IACjBC,qBAAqB;IACrBC,eAAe,GAAG,MAAM;IACxB,GAAGC;EAAW,CACf,GAAGb,KAAK;EAET,OAAO,CACL;IACEC,SAAS;IACTE,IAAI;IACJC,KAAK;IACLC,WAAW;IACXC,QAAQ;IACRE,IAAI;IACJC,KAAK;IACLC,iBAAiB;IACjBC,qBAAqB;IACrBC,eAAe;IACf,GAAGL;GACJ,EACD;IACED,QAAQ;IACRE,IAAI;IACJ,GAAGK,WAAW;IACd,GAAGX;GACJ,CACF;AACH;AAEA;;;;AAIA,OAAM,SAAUY,mBAAmBA,CACjCC,OAA0C,EAC1CC,OAAA,GAGI,EAAE;EAEN,MAAM;IAAEC,QAAQ,GAAGjB,KAAK,IAAIA,KAAK;IAAEkB,WAAW,GAAG,GAAGH,OAAO,CAACG,WAAW;EAAO,CAAE,GAAGF,OAAO;EAE1F,MAAMG,eAAe,gBAAGvB,KAAK,CAACwB,UAAU,CAAC,CAACpB,KAAK,EAAEqB,GAAG,KAAI;IACtD,MAAM,CAACC,UAAU,EAAEC,YAAY,CAAC,GAAGxB,wBAAwB,CAACkB,QAAQ,CAACjB,KAAK,CAAC,CAAC;IAC5E,oBACEJ,KAAA,CAAA4B,aAAA,CAAC3B,KAAK;MAAA,GAAKyB;IAAU,gBAEnB1B,KAAA,CAAA4B,aAAA,CAACT,OAAO;MAAA,GAAMQ,YAAoB;MAAEF,GAAG,EAAEA;IAAU,EAAI,CACjD;EAEZ,CAAC,CAA4D;EAE7DF,eAAe,CAACD,WAAW,GAAGA,WAAW;EAEzC,OAAOC,eAAe;AACxB;AAEA;;;;AAIA,OAAO,MAAMM,4BAA4B,GAAIC,oBAA4B,KAAM;EAC7E,GAAG5B,eAAe;EAClBI,OAAO,EAAEwB;CACV,CAAC"}
+{"version":3,"names":["React","Field","fieldClassNames","getPartitionedFieldProps","props","className","control","hint","label","orientation","required","root","size","style","validationMessage","validationMessageIcon","validationState","restOfProps","makeDeprecatedField","Control","options","mapProps","displayName","DeprecatedField","forwardRef","ref","fieldProps","controlProps","createElement","getDeprecatedFieldClassNames","controlRootClassName"],"sources":["../../src/util/makeDeprecatedField.tsx"],"sourcesContent":["/* eslint-disable deprecation/deprecation */\nimport * as React from 'react';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from '../Field';\nimport { Field, fieldClassNames } from '../Field';\n\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport type DeprecatedFieldProps<ControlProps> = ControlProps & {\n  root?: FieldProps;\n  control?: ControlProps;\n} & Pick<\n    FieldProps,\n    | 'className'\n    | 'hint'\n    | 'label'\n    | 'orientation'\n    | 'style'\n    | 'validationMessage'\n    | 'validationMessageIcon'\n    | 'validationState'\n  >;\n\n/**\n * Partition the props used by the Field itself, from the props that are passed to the underlying field component.\n */\nfunction getPartitionedFieldProps<ControlProps>(\n  props: DeprecatedFieldProps<ControlProps> & Pick<FieldProps, 'required' | 'size'>,\n) {\n  const {\n    className,\n    control,\n    hint,\n    label,\n    orientation,\n    required,\n    root,\n    size,\n    style,\n    validationMessage,\n    validationMessageIcon,\n    validationState = 'none',\n    ...restOfProps\n  } = props;\n\n  return [\n    {\n      className,\n      hint,\n      label,\n      orientation,\n      required,\n      size,\n      style,\n      validationMessage,\n      validationMessageIcon,\n      validationState,\n      ...root,\n    },\n    {\n      required,\n      size,\n      ...restOfProps,\n      ...control,\n    },\n  ];\n}\n\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport function makeDeprecatedField<ControlProps>(\n  Control: React.ComponentType<ControlProps>,\n  options: {\n    mapProps?: (props: DeprecatedFieldProps<ControlProps>) => DeprecatedFieldProps<ControlProps>;\n    displayName?: string;\n  } = {},\n) {\n  const { mapProps = props => props, displayName = `${Control.displayName}Field` } = options;\n\n  const DeprecatedField = React.forwardRef((props, ref) => {\n    const [fieldProps, controlProps] = getPartitionedFieldProps(mapProps(props));\n    return (\n      <Field {...fieldProps}>\n        {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n        <Control {...(controlProps as any)} ref={ref as any} />\n      </Field>\n    );\n  }) as ForwardRefComponent<DeprecatedFieldProps<ControlProps>>;\n\n  DeprecatedField.displayName = displayName;\n\n  return DeprecatedField;\n}\n\n/**\n * @deprecated Only for use to make deprecated [Control]Field shim components.\n * @internal\n */\nexport const getDeprecatedFieldClassNames = (controlRootClassName: string) => ({\n  ...fieldClassNames,\n  control: controlRootClassName,\n});\n"],"mappings":"AAAA,4CACA,YAAYA,KAAA,MAAW;AAGvB,SAASC,KAAK,EAAEC,eAAe,QAAQ;AAqBvC;;;AAGA,SAASC,yBACPC,KAAiF,EACjF;EACA,MAAM;IACJC,SAAA;IACAC,OAAA;IACAC,IAAA;IACAC,KAAA;IACAC,WAAA;IACAC,QAAA;IACAC,IAAA;IACAC,IAAA;IACAC,KAAA;IACAC,iBAAA;IACAC,qBAAA;IACAC,eAAA,GAAkB;IAClB,GAAGC;EAAA,CACJ,GAAGb,KAAA;EAEJ,OAAO,CACL;IACEC,SAAA;IACAE,IAAA;IACAC,KAAA;IACAC,WAAA;IACAC,QAAA;IACAE,IAAA;IACAC,KAAA;IACAC,iBAAA;IACAC,qBAAA;IACAC,eAAA;IACA,GAAGL;EACL,GACA;IACED,QAAA;IACAE,IAAA;IACA,GAAGK,WAAW;IACd,GAAGX;EACL,EACD;AACH;AAEA;;;;AAIA,OAAO,SAASY,oBACdC,OAA0C,EAC1CC,OAAA,GAGI,CAAC,CAAC,EACN;EACA,MAAM;IAAEC,QAAA,GAAWjB,KAAA,IAASA,KAAA;IAAOkB,WAAA,GAAe,GAAEH,OAAA,CAAQG,WAAY;EAAM,CAAE,GAAGF,OAAA;EAEnF,MAAMG,eAAA,gBAAkBvB,KAAA,CAAMwB,UAAU,CAAC,CAACpB,KAAA,EAAOqB,GAAA,KAAQ;IACvD,MAAM,CAACC,UAAA,EAAYC,YAAA,CAAa,GAAGxB,wBAAA,CAAyBkB,QAAA,CAASjB,KAAA;IACrE,oBACEJ,KAAA,CAAA4B,aAAA,CAAC3B,KAAA,EAAUyB,UAAA,eAET1B,KAAA,CAAA4B,aAAA,CAACT,OAAA;MAAS,GAAIQ,YAAY;MAAUF,GAAA,EAAKA;;EAG/C;EAEAF,eAAA,CAAgBD,WAAW,GAAGA,WAAA;EAE9B,OAAOC,eAAA;AACT;AAEA;;;;AAIA,OAAO,MAAMM,4BAAA,GAAgCC,oBAAA,KAAkC;EAC7E,GAAG5B,eAAe;EAClBI,OAAA,EAASwB;AACX"}

package/lib-commonjs/Field.js

@@ -1,8 +1,9 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-const tslib_1 = /*#__PURE__*/require("tslib");
-tslib_1.__exportStar(require("./components/Field/index"), exports);
+const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./components/Field/index"), exports);
+ //# sourceMappingURL=Field.js.map
+
 //# sourceMappingURL=Field.js.map

package/lib-commonjs/Field.js.map

@@ -1 +1 @@
-{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-field/src/Field.ts"],"sourcesContent":["export * from './components/Field/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,8BAAAC,OAAA"}
+{"version":3,"sources":["../lib/Field.js"],"sourcesContent":["export * from './components/Field/index';\n//# sourceMappingURL=Field.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,iCAAiC"}

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

@@ -1,17 +1,21 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "Field", {
+    enumerable: true,
+    get: ()=>Field
 });
-exports.Field = void 0;
-const React = /*#__PURE__*/require("react");
-const renderField_1 = /*#__PURE__*/require("./renderField");
-const useField_1 = /*#__PURE__*/require("./useField");
-const useFieldStyles_1 = /*#__PURE__*/require("./useFieldStyles");
-exports.Field = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useField_1.useField_unstable(props, ref);
-  useFieldStyles_1.useFieldStyles_unstable(state);
-  return renderField_1.renderField_unstable(state);
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _renderField = require("./renderField");
+const _useField = require("./useField");
+const _useFieldStyles = require("./useFieldStyles");
+const Field = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useField.useField_unstable)(props, ref);
+    (0, _useFieldStyles.useFieldStyles_unstable)(state);
+    return (0, _renderField.renderField_unstable)(state);
 });
-exports.Field.displayName = 'Field';
+Field.displayName = 'Field'; //# sourceMappingURL=Field.js.map
+
 //# sourceMappingURL=Field.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","require","renderField_1","useField_1","useFieldStyles_1","exports","Field","forwardRef","props","ref","state","useField_unstable","useFieldStyles_unstable","renderField_unstable","displayName"],"sources":["../src/packages/react-components/react-field/src/components/Field/Field.tsx"],"sourcesContent":["import * 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';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nField.displayName = 'Field';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AAGA,MAAAC,aAAA,gBAAAD,OAAA;AACA,MAAAE,UAAA,gBAAAF,OAAA;AACA,MAAAG,gBAAA,gBAAAH,OAAA;AAEaI,OAAA,CAAAC,KAAK,gBAAoCN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpF,MAAMC,KAAK,GAAGP,UAAA,CAAAQ,iBAAiB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAC3CL,gBAAA,CAAAQ,uBAAuB,CAACF,KAAK,CAAC;EAC9B,OAAOR,aAAA,CAAAW,oBAAoB,CAACH,KAAK,CAAC;AACpC,CAAC,CAAC;AAEFL,OAAA,CAAAC,KAAK,CAACQ,WAAW,GAAG,OAAO"}
+{"version":3,"sources":["../../../lib/components/Field/Field.js"],"sourcesContent":["import * as React from 'react';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles';\nexport const Field = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref);\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\nField.displayName = 'Field';\n//# sourceMappingURL=Field.js.map"],"names":["Field","React","forwardRef","props","ref","state","useField_unstable","useFieldStyles_unstable","renderField_unstable","displayName"],"mappings":";;;;+BAIaA;;aAAAA;;;6DAJU;6BACc;0BACH;gCACM;AACjC,MAAMA,QAAQ,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACjE,MAAMC,QAAQC,IAAAA,2BAAiB,EAACH,OAAOC;IACvCG,IAAAA,uCAAuB,EAACF;IACxB,OAAOG,IAAAA,iCAAoB,EAACH;AAC9B;AACAL,MAAMS,WAAW,GAAG,SACpB,iCAAiC"}

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

@@ -1,6 +1,9 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+ //# sourceMappingURL=Field.types.js.map
+
 //# sourceMappingURL=Field.types.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../src/packages/react-components/react-field/src/components/Field/Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the Field's child element.\n */\nexport type FieldChildProps = 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>`), as well\n   * as intrinsic form controls like `<input>` or `<textarea>`. Custom controls can also be used as long as they\n   * accept FieldChildProps and spread them on the appropriate element.\n   *\n   * For more complex scenarios, a render function can be used to pass the FieldChildProps to the appropriate control.\n   */\n  children?: React.ReactElement<FieldChildProps> | null | ((props: FieldChildProps) => 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.\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' | 'validationState'>>;\n"],"mappings":""}
+{"version":3,"sources":["../../../lib/components/Field/Field.types.js"],"sourcesContent":["import * as React from 'react';\n//# sourceMappingURL=Field.types.js.map"],"names":[],"mappings":";;;;;6DAAuB;CACvB,uCAAuC"}

package/lib-commonjs/components/Field/index.js

@@ -1,12 +1,13 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-const tslib_1 = /*#__PURE__*/require("tslib");
-tslib_1.__exportStar(require("./Field.types"), exports);
-tslib_1.__exportStar(require("./Field"), exports);
-tslib_1.__exportStar(require("./renderField"), exports);
-tslib_1.__exportStar(require("./useField"), exports);
-tslib_1.__exportStar(require("./useFieldStyles"), exports);
+const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./Field.types"), exports);
+_exportStar(require("./Field"), exports);
+_exportStar(require("./renderField"), exports);
+_exportStar(require("./useField"), exports);
+_exportStar(require("./useFieldStyles"), exports);
+ //# sourceMappingURL=index.js.map
+
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-field/src/components/Field/index.ts"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,mBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,aAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,mBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,gBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA"}
+{"version":3,"sources":["../../../lib/components/Field/index.js"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}