@fluentui/react-field 9.4.15 → 9.4.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-field
|
|
2
2
|
|
|
3
|
-
This log was last generated on Wed,
|
|
3
|
+
This log was last generated on Wed, 11 Mar 2026 09:20:36 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.4.16](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.4.16)
|
|
8
|
+
|
|
9
|
+
Wed, 11 Mar 2026 09:20:36 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.4.15..@fluentui/react-field_v9.4.16)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- Update MessageBar, Field, and Toast to use Dismiss Diamond icons ([PR #35758](https://github.com/microsoft/fluentui/pull/35758) by 198982749+Copilot@users.noreply.github.com)
|
|
15
|
+
|
|
7
16
|
## [9.4.15](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.4.15)
|
|
8
17
|
|
|
9
|
-
Wed, 25 Feb 2026 13:28
|
|
18
|
+
Wed, 25 Feb 2026 13:32:28 GMT
|
|
10
19
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.4.14..@fluentui/react-field_v9.4.15)
|
|
11
20
|
|
|
12
21
|
### Patches
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { CheckmarkCircle12Filled,
|
|
2
|
+
import { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';
|
|
3
3
|
import { Label } from '@fluentui/react-label';
|
|
4
4
|
import { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';
|
|
5
5
|
const validationMessageIcons = {
|
|
6
|
-
error: /*#__PURE__*/ React.createElement(
|
|
6
|
+
error: /*#__PURE__*/ React.createElement(DiamondDismiss12Filled, null),
|
|
7
7
|
warning: /*#__PURE__*/ React.createElement(Warning12Filled, null),
|
|
8
8
|
success: /*#__PURE__*/ React.createElement(CheckmarkCircle12Filled, null),
|
|
9
9
|
none: undefined
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled,
|
|
1
|
+
{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n error: <DiamondDismiss12Filled />,\n warning: <Warning12Filled />,\n success: <CheckmarkCircle12Filled />,\n none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium',\n } = props;\n\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n\n const root = slot.always(getIntrinsicElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']), {\n elementType: 'div',\n });\n const label = slot.optional(props.label, {\n defaultProps: { htmlFor: generatedControlId, id: baseId + '__label', required, size },\n elementType: Label,\n });\n const validationMessage = slot.optional(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' || validationState === 'warning' ? 'alert' : undefined,\n },\n elementType: 'div',\n });\n const hint = slot.optional(props.hint, { defaultProps: { id: baseId + '__hint' }, elementType: 'div' });\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = slot.optional(props.validationMessageIcon, {\n renderByDefault: !!defaultIcon,\n defaultProps: { children: defaultIcon },\n elementType: 'span',\n });\n\n return {\n children,\n generatedControlId,\n orientation,\n required,\n size,\n validationState,\n components: { root: 'div', label: Label, validationMessage: 'div', validationMessageIcon: 'span', hint: 'div' },\n root,\n label,\n validationMessageIcon,\n validationMessage,\n hint,\n };\n};\n"],"names":["React","CheckmarkCircle12Filled","DiamondDismiss12Filled","Warning12Filled","Label","getIntrinsicElementProps","useId","slot","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","generatedControlId","root","always","elementType","label","optional","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","renderByDefault","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,EAAEC,sBAAsB,EAAEC,eAAe,QAAQ,wBAAwB;AACzG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,wBAAwB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAGlF,MAAMC,yBAAyB;IAC7BC,qBAAO,oBAACP;IACRQ,uBAAS,oBAACP;IACVQ,uBAAS,oBAACV;IACVW,MAAMC;AACR;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EACJC,QAAQ,EACRC,cAAc,UAAU,EACxBC,WAAW,KAAK,EAChBC,kBAAkBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,EAC5DC,OAAO,QAAQ,EAChB,GAAGP;IAEJ,MAAMQ,SAASjB,MAAM;IACrB,MAAMkB,qBAAqBD,SAAS;IAEpC,MAAME,OAAOlB,KAAKmB,MAAM,CAACrB,yBAAyB,OAAO;QAAE,GAAGU,KAAK;QAAEC;IAAI,GAAG,oBAAoB,GAAG;QAAC;KAAW,GAAG;QAChHW,aAAa;IACf;IACA,MAAMC,QAAQrB,KAAKsB,QAAQ,CAACd,MAAMa,KAAK,EAAE;QACvCE,cAAc;YAAEC,SAASP;YAAoBQ,IAAIT,SAAS;YAAWJ;YAAUG;QAAK;QACpFK,aAAavB;IACf;IACA,MAAMiB,oBAAoBd,KAAKsB,QAAQ,CAACd,MAAMM,iBAAiB,EAAE;QAC/DS,cAAc;YACZE,IAAIT,SAAS;YACbU,MAAMb,oBAAoB,WAAWA,oBAAoB,YAAY,UAAUP;QACjF;QACAc,aAAa;IACf;IACA,MAAMO,OAAO3B,KAAKsB,QAAQ,CAACd,MAAMmB,IAAI,EAAE;QAAEJ,cAAc;YAAEE,IAAIT,SAAS;QAAS;QAAGI,aAAa;IAAM;IACrG,MAAMQ,cAAc3B,sBAAsB,CAACY,gBAAgB;IAC3D,MAAMgB,wBAAwB7B,KAAKsB,QAAQ,CAACd,MAAMqB,qBAAqB,EAAE;QACvEC,iBAAiB,CAAC,CAACF;QACnBL,cAAc;YAAEb,UAAUkB;QAAY;QACtCR,aAAa;IACf;IAEA,OAAO;QACLV;QACAO;QACAN;QACAC;QACAG;QACAF;QACAkB,YAAY;YAAEb,MAAM;YAAOG,OAAOxB;YAAOiB,mBAAmB;YAAOe,uBAAuB;YAAQF,MAAM;QAAM;QAC9GT;QACAG;QACAQ;QACAf;QACAa;IACF;AACF,EAAE"}
|
|
@@ -14,7 +14,7 @@ const _reacticons = require("@fluentui/react-icons");
|
|
|
14
14
|
const _reactlabel = require("@fluentui/react-label");
|
|
15
15
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
16
16
|
const validationMessageIcons = {
|
|
17
|
-
error: /*#__PURE__*/ _react.createElement(_reacticons.
|
|
17
|
+
error: /*#__PURE__*/ _react.createElement(_reacticons.DiamondDismiss12Filled, null),
|
|
18
18
|
warning: /*#__PURE__*/ _react.createElement(_reacticons.Warning12Filled, null),
|
|
19
19
|
success: /*#__PURE__*/ _react.createElement(_reacticons.CheckmarkCircle12Filled, null),
|
|
20
20
|
none: undefined
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled,
|
|
1
|
+
{"version":3,"sources":["../src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, DiamondDismiss12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n error: <DiamondDismiss12Filled />,\n warning: <Warning12Filled />,\n success: <CheckmarkCircle12Filled />,\n none: undefined,\n} as const;\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium',\n } = props;\n\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n\n const root = slot.always(getIntrinsicElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']), {\n elementType: 'div',\n });\n const label = slot.optional(props.label, {\n defaultProps: { htmlFor: generatedControlId, id: baseId + '__label', required, size },\n elementType: Label,\n });\n const validationMessage = slot.optional(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' || validationState === 'warning' ? 'alert' : undefined,\n },\n elementType: 'div',\n });\n const hint = slot.optional(props.hint, { defaultProps: { id: baseId + '__hint' }, elementType: 'div' });\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = slot.optional(props.validationMessageIcon, {\n renderByDefault: !!defaultIcon,\n defaultProps: { children: defaultIcon },\n elementType: 'span',\n });\n\n return {\n children,\n generatedControlId,\n orientation,\n required,\n size,\n validationState,\n components: { root: 'div', label: Label, validationMessage: 'div', validationMessageIcon: 'span', hint: 'div' },\n root,\n label,\n validationMessageIcon,\n validationMessage,\n hint,\n };\n};\n"],"names":["React","CheckmarkCircle12Filled","DiamondDismiss12Filled","Warning12Filled","Label","getIntrinsicElementProps","useId","slot","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","generatedControlId","root","always","elementType","label","optional","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","renderByDefault","components"],"mappings":";;;;+BAuBac;;;;;;;iEAvBU,QAAQ;4BAEkD,wBAAwB;4BACnF,wBAAwB;gCACQ,4BAA4B;AAGlF,MAAMN,yBAAyB;IAC7BC,OAAAA,WAAAA,GAAO,OAAA,aAAA,CAACP,kCAAAA,EAAAA;IACRQ,SAAAA,WAAAA,GAAS,OAAA,aAAA,CAACP,2BAAAA,EAAAA;IACVQ,SAAAA,WAAAA,GAAS,OAAA,aAAA,CAACV,mCAAAA,EAAAA;IACVW,MAAMC;AACR;AAWO,0BAA0B,CAACE,OAAmBC;IACnD,MAAM,EACJC,QAAQ,EACRC,cAAc,UAAU,EACxBC,WAAW,KAAK,EAChBC,kBAAkBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,EAC5DC,OAAO,QAAQ,EAChB,GAAGP;IAEJ,MAAMQ,aAASjB,qBAAAA,EAAM;IACrB,MAAMkB,qBAAqBD,SAAS;IAEpC,MAAME,OAAOlB,oBAAAA,CAAKmB,MAAM,KAACrB,wCAAAA,EAAyB,OAAO;QAAE,GAAGU,KAAK;QAAEC;IAAI,GAAG,oBAAoB,GAAG;QAAC;KAAW,GAAG;QAChHW,aAAa;IACf;IACA,MAAMC,QAAQrB,oBAAAA,CAAKsB,QAAQ,CAACd,MAAMa,KAAK,EAAE;QACvCE,cAAc;YAAEC,SAASP;YAAoBQ,IAAIT,SAAS;YAAWJ;YAAUG;QAAK;QACpFK,aAAavB,iBAAAA;IACf;IACA,MAAMiB,oBAAoBd,oBAAAA,CAAKsB,QAAQ,CAACd,MAAMM,iBAAiB,EAAE;QAC/DS,cAAc;YACZE,IAAIT,SAAS;YACbU,MAAMb,oBAAoB,WAAWA,oBAAoB,YAAY,UAAUP;QACjF;QACAc,aAAa;IACf;IACA,MAAMO,OAAO3B,oBAAAA,CAAKsB,QAAQ,CAACd,MAAMmB,IAAI,EAAE;QAAEJ,cAAc;YAAEE,IAAIT,SAAS;QAAS;QAAGI,aAAa;IAAM;IACrG,MAAMQ,cAAc3B,sBAAsB,CAACY,gBAAgB;IAC3D,MAAMgB,wBAAwB7B,oBAAAA,CAAKsB,QAAQ,CAACd,MAAMqB,qBAAqB,EAAE;QACvEC,iBAAiB,CAAC,CAACF;QACnBL,cAAc;YAAEb,UAAUkB;QAAY;QACtCR,aAAa;IACf;IAEA,OAAO;QACLV;QACAO;QACAN;QACAC;QACAG;QACAF;QACAkB,YAAY;YAAEb,MAAM;YAAOG,OAAOxB,iBAAAA;YAAOiB,mBAAmB;YAAOe,uBAAuB;YAAQF,MAAM;QAAM;QAC9GT;QACAG;QACAQ;QACAf;QACAa;IACF;AACF,EAAE"}
|