@fluentui/react-field 9.1.68 → 9.1.69

package/CHANGELOG.md

@@ -1,12 +1,26 @@
 # Change Log - @fluentui/react-field
 
-This log was last generated on Mon, 17 Jun 2024 07:31:08 GMT and should not be manually modified.
+This log was last generated on Mon, 01 Jul 2024 20:26:03 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.1.69](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.69)
+
+Mon, 01 Jul 2024 20:26:03 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.68..@fluentui/react-field_v9.1.69)
+
+### Patches
+
+- chore: add eslint react-compiler ([PR #31457](https://github.com/microsoft/fluentui/pull/31457) by seanmonahan@microsoft.com)
+- chore: Update react-icons package to ^2.0.245 ([PR #31802](https://github.com/microsoft/fluentui/pull/31802) by ololubek@microsoft.com)
+- Bump @fluentui/react-context-selector to v9.1.63 ([PR #31861](https://github.com/microsoft/fluentui/pull/31861) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.40 ([PR #31861](https://github.com/microsoft/fluentui/pull/31861) by beachball)
+- Bump @fluentui/react-label to v9.1.72 ([PR #31861](https://github.com/microsoft/fluentui/pull/31861) by beachball)
+- Bump @fluentui/react-utilities to v9.18.11 ([PR #31861](https://github.com/microsoft/fluentui/pull/31861) by beachball)
+
 ## [9.1.68](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.68)
 
-Mon, 17 Jun 2024 07:31:08 GMT 
+Mon, 17 Jun 2024 07:34:17 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.67..@fluentui/react-field_v9.1.68)
 
 ### Patches

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

@@ -85,6 +85,8 @@ const useValidationMessageIconStyles = /*#__PURE__*/__styles({
  * Apply styling to the Field slots based on the state
  */
 export const useFieldStyles_unstable = state => {
+  'use no memo';
+
   const {
     validationState,
     size

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

@@ -1 +1 @@
-{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","size","orientation","rootStyles","className","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["useFieldStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n    root: `fui-Field`,\n    label: `fui-Field__label`,\n    validationMessage: `fui-Field__validationMessage`,\n    validationMessageIcon: `fui-Field__validationMessageIcon`,\n    hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'grid'\n    },\n    // In horizontal layout, the field is a grid with the label taking up the entire first column.\n    // The last row is slack space in case the label is taller than the rest of the content.\n    horizontal: {\n        gridTemplateColumns: '33% 1fr',\n        gridTemplateRows: 'auto auto auto 1fr'\n    },\n    // In horizontal layout without a label, replace the label's column with padding.\n    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n    horizontalNoLabel: {\n        paddingLeft: '33%',\n        gridTemplateColumns: '1fr'\n    }\n});\nconst useLabelStyles = makeStyles({\n    vertical: {\n        paddingTop: tokens.spacingVerticalXXS,\n        paddingBottom: tokens.spacingVerticalXXS,\n        marginBottom: tokens.spacingVerticalXXS\n    },\n    verticalLarge: {\n        paddingTop: '1px',\n        paddingBottom: '1px',\n        marginBottom: tokens.spacingVerticalXS\n    },\n    horizontal: {\n        paddingTop: tokens.spacingVerticalSNudge,\n        paddingBottom: tokens.spacingVerticalSNudge,\n        marginRight: tokens.spacingHorizontalM,\n        gridRowStart: '1',\n        gridRowEnd: '-1'\n    },\n    horizontalSmall: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS\n    },\n    horizontalLarge: {\n        // To align the label text with the Input text, it should be centered within the 40px height of the Input.\n        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.\n        paddingTop: '9px',\n        paddingBottom: '9px'\n    }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n    marginTop: tokens.spacingVerticalXXS,\n    color: tokens.colorNeutralForeground3,\n    ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    withIcon: {\n        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n        paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n    }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n    display: 'inline-block',\n    fontSize: iconSize,\n    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n    marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n    marginRight: tokens.spacingHorizontalXS,\n    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n    lineHeight: '0',\n    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n    verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    warning: {\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    success: {\n        color: tokens.colorPaletteGreenForeground1\n    }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n    const { validationState, size } = state;\n    const horizontal = state.orientation === 'horizontal';\n    const rootStyles = useRootStyles();\n    state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n    const labelStyles = useLabelStyles();\n    if (state.label) {\n        state.label.className = mergeClasses(fieldClassNames.label, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n    }\n    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n    const validationMessageIconStyles = useValidationMessageIconStyles();\n    if (state.validationMessageIcon) {\n        state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n    }\n    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n    const secondaryTextStyles = useSecondaryTextStyles();\n    if (state.validationMessage) {\n        state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n    }\n    if (state.hint) {\n        state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,SAASA,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAAAC,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,OAAO,MAAMC,eAAe,GAAG;EAC3BC,IAAI,EAAE,WAAW;EACjBC,KAAK,EAAE,kBAAkB;EACzBC,iBAAiB,EAAE,8BAA8B;EACjDC,qBAAqB,EAAE,kCAAkC;EACzDC,IAAI,EAAE;AACV,CAAC;AACD;AACA,MAAMC,QAAQ,GAAG,MAAM;AACvB;AACA;AACA;AAAI,MAAMC,aAAa,gBAAGT,QAAA;EAAAU,IAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,iBAAA;IAAAC,MAAA;IAAAH,OAAA;EAAA;AAAA;EAAAI,CAAA;AAAA,CAgBzB,CAAC;AACF,MAAMC,cAAc,gBAAGlB,QAAA;EAAAmB,QAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,aAAA;IAAAH,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAV,UAAA;IAAAQ,MAAA;IAAAC,OAAA;IAAAG,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,eAAA;IAAAP,MAAA;IAAAC,OAAA;EAAA;EAAAO,eAAA;IAAAR,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAJ,CAAA;AAAA,CA4BtB,CAAC;AACF,MAAMY,6BAA6B,gBAAG9B,aAAA,uPAIrC,CAAC;AACF,MAAM+B,sBAAsB,gBAAG9B,QAAA;EAAA+B,KAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAjB,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAQ9B,CAAC;AACF,MAAMiB,qCAAqC,gBAAGnC,aAAA,2XAU7C,CAAC;AACF,MAAMoC,8BAA8B,gBAAGnC,QAAA;EAAA+B,KAAA;IAAAC,MAAA;EAAA;EAAAI,OAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;AAAA;EAAAf,CAAA;AAAA,CAUtC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMqB,uBAAuB,GAAIC,KAAK,IAAG;EAChD,MAAM;IAAEC,eAAe;IAAEC;EAAK,CAAC,GAAGF,KAAK;EACvC,MAAM3B,UAAU,GAAG2B,KAAK,CAACG,WAAW,KAAK,YAAY;EACrD,MAAMC,UAAU,GAAGlC,aAAa,CAAC,CAAC;EAClC8B,KAAK,CAACpC,IAAI,CAACyC,SAAS,GAAG3C,YAAY,CAACC,eAAe,CAACC,IAAI,EAAEwC,UAAU,CAACjC,IAAI,EAAEE,UAAU,IAAI+B,UAAU,CAAC/B,UAAU,EAAEA,UAAU,IAAI,CAAC2B,KAAK,CAACnC,KAAK,IAAIuC,UAAU,CAAC5B,iBAAiB,EAAEwB,KAAK,CAACpC,IAAI,CAACyC,SAAS,CAAC;EACjM,MAAMC,WAAW,GAAG3B,cAAc,CAAC,CAAC;EACpC,IAAIqB,KAAK,CAACnC,KAAK,EAAE;IACbmC,KAAK,CAACnC,KAAK,CAACwC,SAAS,GAAG3C,YAAY,CAACC,eAAe,CAACE,KAAK,EAAEQ,UAAU,IAAIiC,WAAW,CAACjC,UAAU,EAAEA,UAAU,IAAI6B,IAAI,KAAK,OAAO,IAAII,WAAW,CAAClB,eAAe,EAAEf,UAAU,IAAI6B,IAAI,KAAK,OAAO,IAAII,WAAW,CAACjB,eAAe,EAAE,CAAChB,UAAU,IAAIiC,WAAW,CAAC1B,QAAQ,EAAE,CAACP,UAAU,IAAI6B,IAAI,KAAK,OAAO,IAAII,WAAW,CAACtB,aAAa,EAAEgB,KAAK,CAACnC,KAAK,CAACwC,SAAS,CAAC;EAC7V;EACA,MAAME,kCAAkC,GAAGZ,qCAAqC,CAAC,CAAC;EAClF,MAAMa,2BAA2B,GAAGZ,8BAA8B,CAAC,CAAC;EACpE,IAAII,KAAK,CAACjC,qBAAqB,EAAE;IAC7BiC,KAAK,CAACjC,qBAAqB,CAACsC,SAAS,GAAG3C,YAAY,CAACC,eAAe,CAACI,qBAAqB,EAAEwC,kCAAkC,EAAEN,eAAe,KAAK,MAAM,IAAIO,2BAA2B,CAACP,eAAe,CAAC,EAAED,KAAK,CAACjC,qBAAqB,CAACsC,SAAS,CAAC;EACtP;EACA,MAAMI,0BAA0B,GAAGnB,6BAA6B,CAAC,CAAC;EAClE,MAAMoB,mBAAmB,GAAGnB,sBAAsB,CAAC,CAAC;EACpD,IAAIS,KAAK,CAAClC,iBAAiB,EAAE;IACzBkC,KAAK,CAAClC,iBAAiB,CAACuC,SAAS,GAAG3C,YAAY,CAACC,eAAe,CAACG,iBAAiB,EAAE2C,0BAA0B,EAAER,eAAe,KAAK,OAAO,IAAIS,mBAAmB,CAAClB,KAAK,EAAE,CAAC,CAACQ,KAAK,CAACjC,qBAAqB,IAAI2C,mBAAmB,CAAChB,QAAQ,EAAEM,KAAK,CAAClC,iBAAiB,CAACuC,SAAS,CAAC;EAC/Q;EACA,IAAIL,KAAK,CAAChC,IAAI,EAAE;IACZgC,KAAK,CAAChC,IAAI,CAACqC,SAAS,GAAG3C,YAAY,CAACC,eAAe,CAACK,IAAI,EAAEyC,0BAA0B,EAAET,KAAK,CAAChC,IAAI,CAACqC,SAAS,CAAC;EAC/G;EACA,OAAOL,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","size","orientation","rootStyles","className","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["useFieldStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n    root: `fui-Field`,\n    label: `fui-Field__label`,\n    validationMessage: `fui-Field__validationMessage`,\n    validationMessageIcon: `fui-Field__validationMessageIcon`,\n    hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'grid'\n    },\n    // In horizontal layout, the field is a grid with the label taking up the entire first column.\n    // The last row is slack space in case the label is taller than the rest of the content.\n    horizontal: {\n        gridTemplateColumns: '33% 1fr',\n        gridTemplateRows: 'auto auto auto 1fr'\n    },\n    // In horizontal layout without a label, replace the label's column with padding.\n    // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n    horizontalNoLabel: {\n        paddingLeft: '33%',\n        gridTemplateColumns: '1fr'\n    }\n});\nconst useLabelStyles = makeStyles({\n    vertical: {\n        paddingTop: tokens.spacingVerticalXXS,\n        paddingBottom: tokens.spacingVerticalXXS,\n        marginBottom: tokens.spacingVerticalXXS\n    },\n    verticalLarge: {\n        paddingTop: '1px',\n        paddingBottom: '1px',\n        marginBottom: tokens.spacingVerticalXS\n    },\n    horizontal: {\n        paddingTop: tokens.spacingVerticalSNudge,\n        paddingBottom: tokens.spacingVerticalSNudge,\n        marginRight: tokens.spacingHorizontalM,\n        gridRowStart: '1',\n        gridRowEnd: '-1'\n    },\n    horizontalSmall: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS\n    },\n    horizontalLarge: {\n        // To align the label text with the Input text, it should be centered within the 40px height of the Input.\n        // This is (40px - lineHeightBase400) / 2 = 9px. Hardcoded since there is no 9px padding token.\n        paddingTop: '9px',\n        paddingBottom: '9px'\n    }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n    marginTop: tokens.spacingVerticalXXS,\n    color: tokens.colorNeutralForeground3,\n    ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    withIcon: {\n        // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n        paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n    }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n    display: 'inline-block',\n    fontSize: iconSize,\n    // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n    marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n    marginRight: tokens.spacingHorizontalXS,\n    // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n    lineHeight: '0',\n    // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n    verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n    error: {\n        color: tokens.colorPaletteRedForeground1\n    },\n    warning: {\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    success: {\n        color: tokens.colorPaletteGreenForeground1\n    }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n    'use no memo';\n    const { validationState, size } = state;\n    const horizontal = state.orientation === 'horizontal';\n    const rootStyles = useRootStyles();\n    state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n    const labelStyles = useLabelStyles();\n    if (state.label) {\n        state.label.className = mergeClasses(fieldClassNames.label, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n    }\n    const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n    const validationMessageIconStyles = useValidationMessageIconStyles();\n    if (state.validationMessageIcon) {\n        state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n    }\n    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n    const secondaryTextStyles = useSecondaryTextStyles();\n    if (state.validationMessage) {\n        state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n    }\n    if (state.hint) {\n        state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n    }\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}

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

@@ -144,6 +144,7 @@ const useValidationMessageIconStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useFieldStyles_unstable = (state)=>{
+    'use no memo';
     const { validationState, size } = state;
     const horizontal = state.orientation === 'horizontal';
     const rootStyles = useRootStyles();

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

@@ -1 +1 @@
-{"version":3,"sources":["useFieldStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n  root: `fui-Field`,\n  label: `fui-Field__label`,\n  validationMessage: `fui-Field__validationMessage`,\n  validationMessageIcon: `fui-Field__validationMessageIcon`,\n  hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n  base: {\n    mc9l5x: \"f13qh94s\"\n  },\n  horizontal: {\n    Budl1dq: \"f2wwaib\",\n    wkccdc: \"f1645dqt\"\n  },\n  horizontalNoLabel: {\n    uwmqm3: [\"f15jqgz8\", \"fggqkej\"],\n    Budl1dq: \"f1c2z91y\"\n  }\n}, {\n  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;}\"]\n});\nconst useLabelStyles = /*#__PURE__*/__styles({\n  vertical: {\n    z8tnut: \"fclwglc\",\n    Byoj8tv: \"fywfov9\",\n    jrapky: \"fyacil5\"\n  },\n  verticalLarge: {\n    z8tnut: \"f1sl3k7w\",\n    Byoj8tv: \"f1brlhvm\",\n    jrapky: \"f8l5zjj\"\n  },\n  horizontal: {\n    z8tnut: \"fp2oml8\",\n    Byoj8tv: \"f1tdddsa\",\n    t21cq0: [\"fkujibs\", \"f199hnxi\"],\n    Ijaq50: \"f16hsg94\",\n    nk6f5a: \"f1nzqi2z\"\n  },\n  horizontalSmall: {\n    z8tnut: \"f1ywm7hm\",\n    Byoj8tv: \"f14wxoun\"\n  },\n  horizontalLarge: {\n    z8tnut: \"f1hqyr95\",\n    Byoj8tv: \"fm4hlj0\"\n  }\n}, {\n  d: [\".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;}\"]\n});\nconst 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);}\"]);\nconst useSecondaryTextStyles = /*#__PURE__*/__styles({\n  error: {\n    sj55zd: \"f1hcrxcs\"\n  },\n  withIcon: {\n    uwmqm3: [\"frawy03\", \"fg4c52\"]\n  }\n}, {\n  d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}\", \".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}\"]\n});\nconst 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;}\"]);\nconst useValidationMessageIconStyles = /*#__PURE__*/__styles({\n  error: {\n    sj55zd: \"f1hcrxcs\"\n  },\n  warning: {\n    sj55zd: \"f1k5f75o\"\n  },\n  success: {\n    sj55zd: \"ffmvakt\"\n  }\n}, {\n  d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}\", \".ffmvakt{color:var(--colorPaletteGreenForeground1);}\"]\n});\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = state => {\n  const {\n    validationState,\n    size\n  } = state;\n  const horizontal = state.orientation === 'horizontal';\n  const rootStyles = useRootStyles();\n  state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n  const labelStyles = useLabelStyles();\n  if (state.label) {\n    state.label.className = mergeClasses(fieldClassNames.label, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n  }\n  const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n  const validationMessageIconStyles = useValidationMessageIconStyles();\n  if (state.validationMessageIcon) {\n    state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n  }\n  const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n  const secondaryTextStyles = useSecondaryTextStyles();\n  if (state.validationMessage) {\n    state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n  }\n  if (state.hint) {\n    state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useFieldStyles.styles.js.map"],"names":["fieldClassNames","useFieldStyles_unstable","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","__styles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","__resetStyles","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","state","validationState","size","orientation","rootStyles","className","mergeClasses","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"mappings":"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"}
+{"version":3,"sources":["useFieldStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n  root: `fui-Field`,\n  label: `fui-Field__label`,\n  validationMessage: `fui-Field__validationMessage`,\n  validationMessageIcon: `fui-Field__validationMessageIcon`,\n  hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n  base: {\n    mc9l5x: \"f13qh94s\"\n  },\n  horizontal: {\n    Budl1dq: \"f2wwaib\",\n    wkccdc: \"f1645dqt\"\n  },\n  horizontalNoLabel: {\n    uwmqm3: [\"f15jqgz8\", \"fggqkej\"],\n    Budl1dq: \"f1c2z91y\"\n  }\n}, {\n  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;}\"]\n});\nconst useLabelStyles = /*#__PURE__*/__styles({\n  vertical: {\n    z8tnut: \"fclwglc\",\n    Byoj8tv: \"fywfov9\",\n    jrapky: \"fyacil5\"\n  },\n  verticalLarge: {\n    z8tnut: \"f1sl3k7w\",\n    Byoj8tv: \"f1brlhvm\",\n    jrapky: \"f8l5zjj\"\n  },\n  horizontal: {\n    z8tnut: \"fp2oml8\",\n    Byoj8tv: \"f1tdddsa\",\n    t21cq0: [\"fkujibs\", \"f199hnxi\"],\n    Ijaq50: \"f16hsg94\",\n    nk6f5a: \"f1nzqi2z\"\n  },\n  horizontalSmall: {\n    z8tnut: \"f1ywm7hm\",\n    Byoj8tv: \"f14wxoun\"\n  },\n  horizontalLarge: {\n    z8tnut: \"f1hqyr95\",\n    Byoj8tv: \"fm4hlj0\"\n  }\n}, {\n  d: [\".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;}\"]\n});\nconst 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);}\"]);\nconst useSecondaryTextStyles = /*#__PURE__*/__styles({\n  error: {\n    sj55zd: \"f1hcrxcs\"\n  },\n  withIcon: {\n    uwmqm3: [\"frawy03\", \"fg4c52\"]\n  }\n}, {\n  d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}\", \".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}\"]\n});\nconst 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;}\"]);\nconst useValidationMessageIconStyles = /*#__PURE__*/__styles({\n  error: {\n    sj55zd: \"f1hcrxcs\"\n  },\n  warning: {\n    sj55zd: \"f1k5f75o\"\n  },\n  success: {\n    sj55zd: \"ffmvakt\"\n  }\n}, {\n  d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}\", \".ffmvakt{color:var(--colorPaletteGreenForeground1);}\"]\n});\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = state => {\n  'use no memo';\n\n  const {\n    validationState,\n    size\n  } = state;\n  const horizontal = state.orientation === 'horizontal';\n  const rootStyles = useRootStyles();\n  state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n  const labelStyles = useLabelStyles();\n  if (state.label) {\n    state.label.className = mergeClasses(fieldClassNames.label, horizontal && labelStyles.horizontal, horizontal && size === 'small' && labelStyles.horizontalSmall, horizontal && size === 'large' && labelStyles.horizontalLarge, !horizontal && labelStyles.vertical, !horizontal && size === 'large' && labelStyles.verticalLarge, state.label.className);\n  }\n  const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n  const validationMessageIconStyles = useValidationMessageIconStyles();\n  if (state.validationMessageIcon) {\n    state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n  }\n  const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n  const secondaryTextStyles = useSecondaryTextStyles();\n  if (state.validationMessage) {\n    state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n  }\n  if (state.hint) {\n    state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useFieldStyles.styles.js.map"],"names":["fieldClassNames","useFieldStyles_unstable","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","__styles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","vertical","z8tnut","Byoj8tv","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","horizontalSmall","horizontalLarge","useSecondaryTextBaseClassName","__resetStyles","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","state","validationState","size","orientation","rootStyles","className","mergeClasses","labelStyles","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-field",
-  "version": "9.1.68",
+  "version": "9.1.69",
   "description": "Fluent UI Field components",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -33,12 +33,12 @@
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-context-selector": "^9.1.62",
-    "@fluentui/react-icons": "^2.0.239",
-    "@fluentui/react-jsx-runtime": "^9.0.39",
-    "@fluentui/react-label": "^9.1.71",
+    "@fluentui/react-context-selector": "^9.1.63",
+    "@fluentui/react-icons": "^2.0.245",
+    "@fluentui/react-jsx-runtime": "^9.0.40",
+    "@fluentui/react-label": "^9.1.72",
     "@fluentui/react-theme": "^9.1.19",
-    "@fluentui/react-utilities": "^9.18.10",
+    "@fluentui/react-utilities": "^9.18.11",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },