npm - @fluentui/react-image - Versions diffs - 9.4.0 → 9.4.2 - Mend

@fluentui/react-image 9.4.0 → 9.4.2

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.

Files changed (17) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,12 +1,32 @@
 # Change Log - @fluentui/react-image
-This log was last generated on Thu, 26 Mar 2026 08:10:40 GMT and should not be manually modified.
+This log was last generated on Tue, 26 May 2026 09:34:21 GMT and should not be manually modified.
 <!-- Start content -->
+## [9.4.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.4.2)
+Tue, 26 May 2026 09:34:21 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.4.1..@fluentui/react-image_v9.4.2)
+### Patches
+- Bump @fluentui/react-utilities to v9.26.4 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.4.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
+## [9.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.4.1)
+Thu, 23 Apr 2026 14:21:16 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.4.0..@fluentui/react-image_v9.4.1)
+### Patches
+- Bump @fluentui/react-utilities to v9.26.3 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
 ## [9.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.4.0)
-Thu, 26 Mar 2026 08:10:40 GMT
+Thu, 26 Mar 2026 08:12:49 GMT
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.3.15..@fluentui/react-image_v9.4.0)
 ### Minor changes

package/dist/index.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import type { ComponentProps } from '@fluentui/react-utilities';
 import type { ComponentState } from '@fluentui/react-utilities';
 import type { ForwardRefComponent } from '@fluentui/react-utilities';
 import type { JSXElement } from '@fluentui/react-utilities';
-import * as React_2 from 'react';
+import type * as React_2 from 'react';
 import type { Slot } from '@fluentui/react-utilities';
 import type { SlotClassNames } from '@fluentui/react-utilities';

package/lib/components/Image/renderImage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Image/renderImage.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { ImageSlots, ImageBaseState } from './Image.types';\n\n/\n Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageBaseState): JSXElement => {\n assertSlots<ImageSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderImage_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;;CAGC,GACD,OAAO,MAAMC,uBAAuB,CAACC;IACnCF,YAAwBE;IAExB,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1	+ {"version":3,"sources":["../src/components/Image/renderImage.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { ImageSlots, ImageBaseState } from './Image.types';\n\n/\n Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageBaseState): JSXElement => {\n assertSlots<ImageSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderImage_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;;CAGC,GACD,OAAO,MAAMC,uBAAuB,CAACC;IACnCF,YAAwBE;IAExB,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/Image/useImage.js CHANGED Viewed

@@ -1,5 +1,4 @@
 'use client';
-import * as React from 'react';
 import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
 /**
  * Given user props, returns state and render function for an Image.

package/lib/components/Image/useImage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Image/useImage.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ImageBaseProps, ImageBaseState, ImageProps, ImageState } from './Image.types';\n\n/*\n Given user props, returns state and render function for an Image.\n /\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, block = false, fit = 'default', shadow = false, shape = 'square', ...imageProps } = props;\n const state = useImageBase_unstable(imageProps, ref);\n\n return {\n bordered,\n block,\n fit,\n shadow,\n shape,\n ...state,\n };\n};\n\n/\n Base hook for Image component, which manages state related to slot structure.\n * This hook excludes design props (shape, shadow, bordered, fit).\n \n @param props - User provided props to the Image component.\n * @param ref - User provided ref to be passed to the Image component.\n */\nexport const useImageBase_unstable = (props: ImageBaseProps, ref: React.Ref<HTMLImageElement>): ImageBaseState => {\n return {\n components: {\n root: 'img',\n },\n root: slot.always(\n getIntrinsicElementProps('img', {\n ref,\n ...props,\n }),\n { elementType: 'img' },\n ),\n };\n};\n"],"names":["~~React","~~getIntrinsicElementProps","slot","useImage_unstable","props","ref","bordered","block","fit","shadow","shape","imageProps","state","useImageBase_unstable","components","root","always","elementType"],"mappings":"AAAA;~~AAEA~~,~~YAAYA~~,~~WAAW,QAAQ;AAC/B,SAASC,~~wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAG3E;;CAEC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EAAEC,WAAW,KAAK,EAAEC,QAAQ,KAAK,EAAEC,MAAM,SAAS,EAAEC,SAAS,KAAK,EAAEC,QAAQ,QAAQ,EAAE,GAAGC,YAAY,GAAGP;IAC9G,MAAMQ,QAAQC,sBAAsBF,YAAYN;IAEhD,OAAO;QACLC;QACAC;QACAC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AAEF;;;;;;CAMC,GACD,OAAO,MAAMC,wBAAwB,CAACT,OAAuBC;IAC3D,OAAO;QACLS,YAAY;YACVC,MAAM;QACR;QACAA,MAAMb,KAAKc,MAAM,CACff,yBAAyB,OAAO;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEa,aAAa;QAAM;IAEzB;AACF,EAAE"}
1	+ {"version":3,"sources":["../src/components/Image/useImage.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ImageBaseProps, ImageBaseState, ImageProps, ImageState } from './Image.types';\n\n/*\n Given user props, returns state and render function for an Image.\n /\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, block = false, fit = 'default', shadow = false, shape = 'square', ...imageProps } = props;\n const state = useImageBase_unstable(imageProps, ref);\n\n return {\n bordered,\n block,\n fit,\n shadow,\n shape,\n ...state,\n };\n};\n\n/\n Base hook for Image component, which manages state related to slot structure.\n * This hook excludes design props (shape, shadow, bordered, fit).\n \n @param props - User provided props to the Image component.\n * @param ref - User provided ref to be passed to the Image component.\n */\nexport const useImageBase_unstable = (props: ImageBaseProps, ref: React.Ref<HTMLImageElement>): ImageBaseState => {\n return {\n components: {\n root: 'img',\n },\n root: slot.always(\n getIntrinsicElementProps('img', {\n ref,\n ...props,\n }),\n { elementType: 'img' },\n ),\n };\n};\n"],"names":["getIntrinsicElementProps","slot","useImage_unstable","props","ref","bordered","block","fit","shadow","shape","imageProps","state","useImageBase_unstable","components","root","always","elementType"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAG3E;;CAEC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EAAEC,WAAW,KAAK,EAAEC,QAAQ,KAAK,EAAEC,MAAM,SAAS,EAAEC,SAAS,KAAK,EAAEC,QAAQ,QAAQ,EAAE,GAAGC,YAAY,GAAGP;IAC9G,MAAMQ,QAAQC,sBAAsBF,YAAYN;IAEhD,OAAO;QACLC;QACAC;QACAC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AAEF;;;;;;CAMC,GACD,OAAO,MAAMC,wBAAwB,CAACT,OAAuBC;IAC3D,OAAO;QACLS,YAAY;YACVC,MAAM;QACR;QACAA,MAAMb,KAAKc,MAAM,CACff,yBAAyB,OAAO;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEa,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/Image/useImageStyles.styles.js CHANGED Viewed

@@ -91,6 +91,7 @@ export const useImageStyles_unstable = state => {
   // eslint-disable-next-line eqeqeq
   const hasExplicitSize = height != null || width != null;
   const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;
+  // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);
   return state;
 };

package/lib/components/Image/useImageStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["shorthands","mergeClasses","__styles","tokens","imageClassNames","root","useStyles","base","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","B7ck84d","mc9l5x","bordered","icvyot","vrafjx","oivjwe","wvpqe5","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","circular","rounded","square","shadow","E5pizo","center","st4lth","Ermj5k","contain","cover","none","fitFill","Bqenvij","a9b677","block","d","p","useImageStyles_unstable","state","styles","height","width","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"sources":["useImageStyles.styles.js"],"sourcesContent":["'use client';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const imageClassNames = {\n root: 'fui-Image'\n};\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n boxSizing: 'border-box',\n display: 'inline-block'\n },\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin)\n },\n // Shape variations\n circular: {\n borderRadius: tokens.borderRadiusCircular\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n square: {\n },\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4\n },\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center'\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center'\n },\n default: {\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center'\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top'\n },\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%'\n },\n // Block styles\n block: {\n width: '100%'\n }\n});\nexport const useImageStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n state.root.className = mergeClasses(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,eAAe,GAAG;EAC3BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAK,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAhB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAa,OAAA;IAAAjB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAc,MAAA;EAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,OAAA;IAAAF,MAAA;IAAAC,MAAA;EAAA;EAAA;EAAAE,KAAA;IAAAH,MAAA;IAAAC,MAAA;EAAA;EAAAG,IAAA;IAAAJ,MAAA;IAAAC,MAAA;EAAA;EAAAI,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAD,MAAA;EAAA;AAAA;EAAAE,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAuDjB,CAAC;AACF,OAAO,MAAMC,uBAAuB,GAAIC,KAAK,IAAG;EAC5C,aAAa;;EACb,MAAMC,MAAM,GAAGzC,SAAS,CAAC,CAAC;EAC1B,MAAM;IAAE0C,MAAM;IAAEC;EAAM,CAAC,GAAGH,KAAK,CAACzC,IAAI;EACpC;EACA,MAAM6C,eAAe,GAAGF,MAAM,IAAI,IAAI,IAAIC,KAAK,IAAI,IAAI;EACvD,MAAME,kBAAkB,GAAGL,KAAK,CAACM,GAAG,KAAK,SAAS,IAAI,CAACF,eAAe;~~EACtEJ~~,KAAK,CAACzC,IAAI,CAACgD,SAAS,GAAGpD,YAAY,CAACG,eAAe,CAACC,IAAI,EAAE0C,MAAM,CAACxC,IAAI,EAAEuC,KAAK,CAACJ,KAAK,IAAIK,MAAM,CAACL,KAAK,EAAEI,KAAK,CAAC3B,QAAQ,IAAI4B,MAAM,CAAC5B,QAAQ,EAAE2B,KAAK,CAACf,MAAM,IAAIgB,MAAM,CAAChB,MAAM,EAAEgB,MAAM,CAACD,KAAK,CAACM,GAAG,CAAC,EAAED,kBAAkB,IAAIJ,MAAM,CAACR,OAAO,EAAEQ,MAAM,CAACD,KAAK,CAACQ,KAAK,CAAC,EAAER,KAAK,CAACzC,IAAI,CAACgD,SAAS,CAAC;EACzQ,OAAOP,KAAK;AAChB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["shorthands","mergeClasses","__styles","tokens","imageClassNames","root","useStyles","base","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","B7ck84d","mc9l5x","bordered","icvyot","vrafjx","oivjwe","wvpqe5","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","circular","rounded","square","shadow","E5pizo","center","st4lth","Ermj5k","contain","cover","none","fitFill","Bqenvij","a9b677","block","d","p","useImageStyles_unstable","state","styles","height","width","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"sources":["useImageStyles.styles.js"],"sourcesContent":["'use client';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const imageClassNames = {\n root: 'fui-Image'\n};\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n boxSizing: 'border-box',\n display: 'inline-block'\n },\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin)\n },\n // Shape variations\n circular: {\n borderRadius: tokens.borderRadiusCircular\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n square: {\n },\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4\n },\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center'\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center'\n },\n default: {\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center'\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top'\n },\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%'\n },\n // Block styles\n block: {\n width: '100%'\n }\n});\nexport const useImageStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,eAAe,GAAG;EAC3BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAK,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAhB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAa,OAAA;IAAAjB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAc,MAAA;EAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,OAAA;IAAAF,MAAA;IAAAC,MAAA;EAAA;EAAA;EAAAE,KAAA;IAAAH,MAAA;IAAAC,MAAA;EAAA;EAAAG,IAAA;IAAAJ,MAAA;IAAAC,MAAA;EAAA;EAAAI,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAD,MAAA;EAAA;AAAA;EAAAE,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAuDjB,CAAC;AACF,OAAO,MAAMC,uBAAuB,GAAIC,KAAK,IAAG;EAC5C,aAAa;;EACb,MAAMC,MAAM,GAAGzC,SAAS,CAAC,CAAC;EAC1B,MAAM;IAAE0C,MAAM;IAAEC;EAAM,CAAC,GAAGH,KAAK,CAACzC,IAAI;EACpC;EACA,MAAM6C,eAAe,GAAGF,MAAM,IAAI,IAAI,IAAIC,KAAK,IAAI,IAAI;EACvD,MAAME,kBAAkB,GAAGL,KAAK,CAACM,GAAG,KAAK,SAAS,IAAI,CAACF,eAAe;EACtE;EACAJ,KAAK,CAACzC,IAAI,CAACgD,SAAS,GAAGpD,YAAY,CAACG,eAAe,CAACC,IAAI,EAAE0C,MAAM,CAACxC,IAAI,EAAEuC,KAAK,CAACJ,KAAK,IAAIK,MAAM,CAACL,KAAK,EAAEI,KAAK,CAAC3B,QAAQ,IAAI4B,MAAM,CAAC5B,QAAQ,EAAE2B,KAAK,CAACf,MAAM,IAAIgB,MAAM,CAAChB,MAAM,EAAEgB,MAAM,CAACD,KAAK,CAACM,GAAG,CAAC,EAAED,kBAAkB,IAAIJ,MAAM,CAACR,OAAO,EAAEQ,MAAM,CAACD,KAAK,CAACQ,KAAK,CAAC,EAAER,KAAK,CAACzC,IAAI,CAACgD,SAAS,CAAC;EACzQ,OAAOP,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/Image/useImageStyles.styles.raw.js CHANGED Viewed

@@ -67,6 +67,7 @@ export const useImageStyles_unstable = (state)=>{
     // eslint-disable-next-line eqeqeq
     const hasExplicitSize = height != null || width != null;
     const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);
     return state;
 };

package/lib/components/Image/useImageStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Image/useImageStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: { borderRadius: tokens.borderRadiusCircular },\n rounded: { borderRadius: tokens.borderRadiusMedium },\n square: {\n /* The square styles are exactly the same as the base styles. /\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n },\n default: {\n / The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n },\n\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState): ImageState => {\n 'use no memo';\n\n const styles = useStyles();\n\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n shouldApplyFitFill && styles.fitFill,\n styles[state.shape],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["shorthands","mergeClasses","makeStyles","tokens","imageClassNames","root","useStyles","base","borderColor","colorNeutralStroke1","borderRadius","borderRadiusNone","boxSizing","display","bordered","borderStyle","borderWidth","strokeWidthThin","circular","borderRadiusCircular","rounded","borderRadiusMedium","square","shadow","boxShadow","shadow4","center","objectFit","objectPosition","contain","default","cover","none","fitFill","height","width","block","useImageStyles_unstable","state","styles","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AACtE,SAASC,MAAM,QAAQ,wBAAwB;AAI/C,OAAO,MAAMC,kBAA8C;IACzDC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYJ,WAAW;IAC3B,cAAc;IACdK,MAAM;QACJ,GAAGP,WAAWQ,WAAW,CAACL,OAAOM,mBAAmB,CAAC;QACrDC,cAAcP,OAAOQ,gBAAgB;QAErCC,WAAW;QACXC,SAAS;IACX;IAEA,kBAAkB;IAClBC,UAAU;QACR,GAAGd,WAAWe,WAAW,CAAC,QAAQ;QAClC,GAAGf,WAAWgB,WAAW,CAACb,OAAOc,eAAe,CAAC;IACnD;IAEA,mBAAmB;IACnBC,UAAU;QAAER,cAAcP,OAAOgB,oBAAoB;IAAC;IACtDC,SAAS;QAAEV,cAAcP,OAAOkB,kBAAkB;IAAC;IACnDC,QAAQ;IAER;IAEA,gBAAgB;IAChBC,QAAQ;QACNC,WAAWrB,OAAOsB,OAAO;IAC3B;IAEA,iBAAiB;IACjBC,QAAQ;QACNC,WAAW;QACXC,gBAAgB;IAClB;IACAC,SAAS;QACPF,WAAW;QACXC,gBAAgB;IAClB;IACAE,SAAS;IAET;IACAC,OAAO;QACLJ,WAAW;QACXC,gBAAgB;IAClB;IACAI,MAAM;QACJL,WAAW;QACXC,gBAAgB;IAClB;IAEA,oEAAoE;IACpE,yEAAyE;IACzEK,SAAS;QACPC,QAAQ;QACRC,OAAO;IACT;IAEA,eAAe;IACfC,OAAO;QACLD,OAAO;IACT;AACF;AAEA,OAAO,MAAME,0BAA0B,CAACC;IACtC;IAEA,MAAMC,SAASjC;IAEf,MAAM,EAAE4B,MAAM,EAAEC,KAAK,EAAE,GAAGG,MAAMjC,IAAI;IACpC,kCAAkC;IAClC,MAAMmC,kBAAkBN,UAAU,QAAQC,SAAS;IACnD,MAAMM,qBAAqBH,MAAMI,GAAG,KAAK,aAAa,CAACF;~~IAEvDF~~,MAAMjC,IAAI,CAACsC,SAAS,GAAG1C,aACrBG,gBAAgBC,IAAI,EACpBkC,OAAOhC,IAAI,EACX+B,MAAMF,KAAK,IAAIG,OAAOH,KAAK,EAC3BE,MAAMxB,QAAQ,IAAIyB,OAAOzB,QAAQ,EACjCwB,MAAMf,MAAM,IAAIgB,OAAOhB,MAAM,EAC7BgB,MAAM,CAACD,MAAMI,GAAG,CAAC,EACjBD,sBAAsBF,OAAON,OAAO,EACpCM,MAAM,CAACD,MAAMM,KAAK,CAAC,EACnBN,MAAMjC,IAAI,CAACsC,SAAS;IAGtB,OAAOL;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/Image/useImageStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: { borderRadius: tokens.borderRadiusCircular },\n rounded: { borderRadius: tokens.borderRadiusMedium },\n square: {\n /* The square styles are exactly the same as the base styles. /\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n },\n default: {\n / The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n },\n\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState): ImageState => {\n 'use no memo';\n\n const styles = useStyles();\n\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n shouldApplyFitFill && styles.fitFill,\n styles[state.shape],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["shorthands","mergeClasses","makeStyles","tokens","imageClassNames","root","useStyles","base","borderColor","colorNeutralStroke1","borderRadius","borderRadiusNone","boxSizing","display","bordered","borderStyle","borderWidth","strokeWidthThin","circular","borderRadiusCircular","rounded","borderRadiusMedium","square","shadow","boxShadow","shadow4","center","objectFit","objectPosition","contain","default","cover","none","fitFill","height","width","block","useImageStyles_unstable","state","styles","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AACtE,SAASC,MAAM,QAAQ,wBAAwB;AAI/C,OAAO,MAAMC,kBAA8C;IACzDC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYJ,WAAW;IAC3B,cAAc;IACdK,MAAM;QACJ,GAAGP,WAAWQ,WAAW,CAACL,OAAOM,mBAAmB,CAAC;QACrDC,cAAcP,OAAOQ,gBAAgB;QAErCC,WAAW;QACXC,SAAS;IACX;IAEA,kBAAkB;IAClBC,UAAU;QACR,GAAGd,WAAWe,WAAW,CAAC,QAAQ;QAClC,GAAGf,WAAWgB,WAAW,CAACb,OAAOc,eAAe,CAAC;IACnD;IAEA,mBAAmB;IACnBC,UAAU;QAAER,cAAcP,OAAOgB,oBAAoB;IAAC;IACtDC,SAAS;QAAEV,cAAcP,OAAOkB,kBAAkB;IAAC;IACnDC,QAAQ;IAER;IAEA,gBAAgB;IAChBC,QAAQ;QACNC,WAAWrB,OAAOsB,OAAO;IAC3B;IAEA,iBAAiB;IACjBC,QAAQ;QACNC,WAAW;QACXC,gBAAgB;IAClB;IACAC,SAAS;QACPF,WAAW;QACXC,gBAAgB;IAClB;IACAE,SAAS;IAET;IACAC,OAAO;QACLJ,WAAW;QACXC,gBAAgB;IAClB;IACAI,MAAM;QACJL,WAAW;QACXC,gBAAgB;IAClB;IAEA,oEAAoE;IACpE,yEAAyE;IACzEK,SAAS;QACPC,QAAQ;QACRC,OAAO;IACT;IAEA,eAAe;IACfC,OAAO;QACLD,OAAO;IACT;AACF;AAEA,OAAO,MAAME,0BAA0B,CAACC;IACtC;IAEA,MAAMC,SAASjC;IAEf,MAAM,EAAE4B,MAAM,EAAEC,KAAK,EAAE,GAAGG,MAAMjC,IAAI;IACpC,kCAAkC;IAClC,MAAMmC,kBAAkBN,UAAU,QAAQC,SAAS;IACnD,MAAMM,qBAAqBH,MAAMI,GAAG,KAAK,aAAa,CAACF;IAEvD,oDAAoD;IACpDF,MAAMjC,IAAI,CAACsC,SAAS,GAAG1C,aACrBG,gBAAgBC,IAAI,EACpBkC,OAAOhC,IAAI,EACX+B,MAAMF,KAAK,IAAIG,OAAOH,KAAK,EAC3BE,MAAMxB,QAAQ,IAAIyB,OAAOzB,QAAQ,EACjCwB,MAAMf,MAAM,IAAIgB,OAAOhB,MAAM,EAC7BgB,MAAM,CAACD,MAAMI,GAAG,CAAC,EACjBD,sBAAsBF,OAAON,OAAO,EACpCM,MAAM,CAACD,MAAMM,KAAK,CAAC,EACnBN,MAAMjC,IAAI,CAACsC,SAAS;IAGtB,OAAOL;AACT,EAAE"}

package/lib-commonjs/components/Image/renderImage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Image/renderImage.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { ImageSlots, ImageBaseState } from './Image.types';\n\n/\n Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageBaseState): JSXElement => {\n assertSlots<ImageSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderImage_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAQjD,MAAMC,uBAAuB,CAACC;QACnCF,2BAAAA,EAAwBE;IAExB,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}
1	+ {"version":3,"sources":["../src/components/Image/renderImage.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { ImageSlots, ImageBaseState } from './Image.types';\n\n/\n Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageBaseState): JSXElement => {\n assertSlots<ImageSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderImage_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAQjD,MAAMC,uBAAuB,CAACC;QACnCF,2BAAAA,EAAwBE;IAExB,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

package/lib-commonjs/components/Image/useImage.js CHANGED Viewed

@@ -17,8 +17,6 @@ _export(exports, {
         return useImage_unstable;
     }
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reactutilities = require("@fluentui/react-utilities");
 const useImage_unstable = (props, ref)=>{
     const { bordered = false, block = false, fit = 'default', shadow = false, shape = 'square', ...imageProps } = props;

package/lib-commonjs/components/Image/useImage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Image/useImage.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ImageBaseProps, ImageBaseState, ImageProps, ImageState } from './Image.types';\n\n/*\n Given user props, returns state and render function for an Image.\n /\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, block = false, fit = 'default', shadow = false, shape = 'square', ...imageProps } = props;\n const state = useImageBase_unstable(imageProps, ref);\n\n return {\n bordered,\n block,\n fit,\n shadow,\n shape,\n ...state,\n };\n};\n\n/\n Base hook for Image component, which manages state related to slot structure.\n * This hook excludes design props (shape, shadow, bordered, fit).\n \n @param props - User provided props to the Image component.\n * @param ref - User provided ref to be passed to the Image component.\n */\nexport const useImageBase_unstable = (props: ImageBaseProps, ref: React.Ref<HTMLImageElement>): ImageBaseState => {\n return {\n components: {\n root: 'img',\n },\n root: slot.always(\n getIntrinsicElementProps('img', {\n ref,\n ...props,\n }),\n { elementType: 'img' },\n ),\n };\n};\n"],"names":["~~React","~~getIntrinsicElementProps","slot","useImage_unstable","props","ref","bordered","block","fit","shadow","shape","imageProps","state","useImageBase_unstable","components","root","always","elementType"],"mappings":"AAAA;;;;;;;;;;;;~~IA8Baa~~,qBAAAA;;;qBArBAV~~;;;;;iEAPU~~,~~QAAQ;gCACgB,~~4BAA4B;AAMpE,MAAMA,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EAAEC,WAAW,KAAK,EAAEC,QAAQ,KAAK,EAAEC,MAAM,SAAS,EAAEC,SAAS,KAAK,EAAEC,QAAQ,QAAQ,EAAE,GAAGC,YAAY,GAAGP;IAC9G,MAAMQ,QAAQC,sBAAsBF,YAAYN;IAEhD,OAAO;QACLC;QACAC;QACAC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AASK,8BAA8B,CAACR,OAAuBC;IAC3D,OAAO;QACLS,YAAY;YACVC,MAAM;QACR;QACAA,MAAMb,oBAAAA,CAAKc,MAAM,KACff,wCAAAA,EAAyB,OAAO;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEa,aAAa;QAAM;IAEzB;AACF,EAAE"}
1	+ {"version":3,"sources":["../src/components/Image/useImage.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ImageBaseProps, ImageBaseState, ImageProps, ImageState } from './Image.types';\n\n/*\n Given user props, returns state and render function for an Image.\n /\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, block = false, fit = 'default', shadow = false, shape = 'square', ...imageProps } = props;\n const state = useImageBase_unstable(imageProps, ref);\n\n return {\n bordered,\n block,\n fit,\n shadow,\n shape,\n ...state,\n };\n};\n\n/\n Base hook for Image component, which manages state related to slot structure.\n * This hook excludes design props (shape, shadow, bordered, fit).\n \n @param props - User provided props to the Image component.\n * @param ref - User provided ref to be passed to the Image component.\n */\nexport const useImageBase_unstable = (props: ImageBaseProps, ref: React.Ref<HTMLImageElement>): ImageBaseState => {\n return {\n components: {\n root: 'img',\n },\n root: slot.always(\n getIntrinsicElementProps('img', {\n ref,\n ...props,\n }),\n { elementType: 'img' },\n ),\n };\n};\n"],"names":["getIntrinsicElementProps","slot","useImage_unstable","props","ref","bordered","block","fit","shadow","shape","imageProps","state","useImageBase_unstable","components","root","always","elementType"],"mappings":"AAAA;;;;;;;;;;;;IA8BaY,qBAAAA;;;qBArBAV;;;;gCANkC,4BAA4B;AAMpE,MAAMA,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EAAEC,WAAW,KAAK,EAAEC,QAAQ,KAAK,EAAEC,MAAM,SAAS,EAAEC,SAAS,KAAK,EAAEC,QAAQ,QAAQ,EAAE,GAAGC,YAAY,GAAGP;IAC9G,MAAMQ,QAAQC,sBAAsBF,YAAYN;IAEhD,OAAO;QACLC;QACAC;QACAC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AASK,8BAA8B,CAACR,OAAuBC;IAC3D,OAAO;QACLS,YAAY;YACVC,MAAM;QACR;QACAA,MAAMb,oBAAAA,CAAKc,MAAM,KACff,wCAAAA,EAAyB,OAAO;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEa,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib-commonjs/components/Image/useImageStyles.styles.js CHANGED Viewed

@@ -160,6 +160,7 @@ const useImageStyles_unstable = (state)=>{
     // eslint-disable-next-line eqeqeq
     const hasExplicitSize = height != null || width != null;
     const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);
     return state;
 };

package/lib-commonjs/components/Image/useImageStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useImageStyles.styles.js"],"sourcesContent":["'use client';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const imageClassNames = {\n root: 'fui-Image'\n};\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n boxSizing: 'border-box',\n display: 'inline-block'\n },\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin)\n },\n // Shape variations\n circular: {\n borderRadius: tokens.borderRadiusCircular\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n square: {\n },\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4\n },\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center'\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center'\n },\n default: {\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center'\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top'\n },\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%'\n },\n // Block styles\n block: {\n width: '100%'\n }\n});\nexport const useImageStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n state.root.className = mergeClasses(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);\n return state;\n};\n"],"names":["shorthands","mergeClasses","__styles","tokens","imageClassNames","root","useStyles","base","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","B7ck84d","mc9l5x","bordered","icvyot","vrafjx","oivjwe","wvpqe5","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","circular","rounded","square","shadow","E5pizo","center","st4lth","Ermj5k","contain","cover","none","fitFill","Bqenvij","a9b677","block","d","p","useImageStyles_unstable","state","styles","height","width","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCI,eAAe;;;IA2DfyC,uBAAuB;;;;uBA7DiB,gBAAgB;AAE9D,wBAAwB;IAC3BxC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAK,IAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAC,QAAA,EAAA;QAAAhB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAa,OAAA,EAAA;QAAAjB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAc,MAAA,EAAA,CAAA;IAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,OAAA,EAAA;QAAAF,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAA,WAAA,CAAA;IAAAE,KAAA,EAAA;QAAAH,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAG,IAAA,EAAA;QAAAJ,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAI,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAD,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAuDjB,CAAC;AACK,iCAAiCE,KAAK,IAAG;IAC5C,aAAa;IACb,MAAMC,MAAM,GAAGzC,SAAS,CAAC,CAAC;IAC1B,MAAM,EAAE0C,MAAM,EAAEC,KAAAA,EAAO,GAAGH,KAAK,CAACzC,IAAI;IACpC,kCAAA;IACA,MAAM6C,eAAe,GAAGF,MAAM,IAAI,IAAI,IAAIC,KAAK,IAAI,IAAI;IACvD,MAAME,kBAAkB,GAAGL,KAAK,CAACM,GAAG,KAAK,SAAS,IAAI,CAACF,eAAe;~~IACtEJ~~,KAAK,CAACzC,IAAI,CAACgD,SAAS,OAAGpD,mBAAY,EAACG,eAAe,CAACC,IAAI,EAAE0C,MAAM,CAACxC,IAAI,EAAEuC,KAAK,CAACJ,KAAK,IAAIK,MAAM,CAACL,KAAK,EAAEI,KAAK,CAAC3B,QAAQ,IAAI4B,MAAM,CAAC5B,QAAQ,EAAE2B,KAAK,CAACf,MAAM,IAAIgB,MAAM,CAAChB,MAAM,EAAEgB,MAAM,CAACD,KAAK,CAACM,GAAG,CAAC,EAAED,kBAAkB,IAAIJ,MAAM,CAACR,OAAO,EAAEQ,MAAM,CAACD,KAAK,CAACQ,KAAK,CAAC,EAAER,KAAK,CAACzC,IAAI,CAACgD,SAAS,CAAC;IACzQ,OAAOP,KAAK;AAChB,CAAC"}
1	+ {"version":3,"sources":["useImageStyles.styles.js"],"sourcesContent":["'use client';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const imageClassNames = {\n root: 'fui-Image'\n};\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n boxSizing: 'border-box',\n display: 'inline-block'\n },\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin)\n },\n // Shape variations\n circular: {\n borderRadius: tokens.borderRadiusCircular\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n square: {\n },\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4\n },\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center'\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center'\n },\n default: {\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center'\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top'\n },\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%'\n },\n // Block styles\n block: {\n width: '100%'\n }\n});\nexport const useImageStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);\n return state;\n};\n"],"names":["shorthands","mergeClasses","__styles","tokens","imageClassNames","root","useStyles","base","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","B7ck84d","mc9l5x","bordered","icvyot","vrafjx","oivjwe","wvpqe5","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","circular","rounded","square","shadow","E5pizo","center","st4lth","Ermj5k","contain","cover","none","fitFill","Bqenvij","a9b677","block","d","p","useImageStyles_unstable","state","styles","height","width","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCI,eAAe;;;IA2DfyC,uBAAuB;;;;uBA7DiB,gBAAgB;AAE9D,wBAAwB;IAC3BxC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAK,IAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAC,QAAA,EAAA;QAAAhB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAa,OAAA,EAAA;QAAAjB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAc,MAAA,EAAA,CAAA;IAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,OAAA,EAAA;QAAAF,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAA,WAAA,CAAA;IAAAE,KAAA,EAAA;QAAAH,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAG,IAAA,EAAA;QAAAJ,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAI,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAD,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAuDjB,CAAC;AACK,iCAAiCE,KAAK,IAAG;IAC5C,aAAa;IACb,MAAMC,MAAM,GAAGzC,SAAS,CAAC,CAAC;IAC1B,MAAM,EAAE0C,MAAM,EAAEC,KAAAA,EAAO,GAAGH,KAAK,CAACzC,IAAI;IACpC,kCAAA;IACA,MAAM6C,eAAe,GAAGF,MAAM,IAAI,IAAI,IAAIC,KAAK,IAAI,IAAI;IACvD,MAAME,kBAAkB,GAAGL,KAAK,CAACM,GAAG,KAAK,SAAS,IAAI,CAACF,eAAe;IACtE,oDAAA;IACAJ,KAAK,CAACzC,IAAI,CAACgD,SAAS,OAAGpD,mBAAY,EAACG,eAAe,CAACC,IAAI,EAAE0C,MAAM,CAACxC,IAAI,EAAEuC,KAAK,CAACJ,KAAK,IAAIK,MAAM,CAACL,KAAK,EAAEI,KAAK,CAAC3B,QAAQ,IAAI4B,MAAM,CAAC5B,QAAQ,EAAE2B,KAAK,CAACf,MAAM,IAAIgB,MAAM,CAAChB,MAAM,EAAEgB,MAAM,CAACD,KAAK,CAACM,GAAG,CAAC,EAAED,kBAAkB,IAAIJ,MAAM,CAACR,OAAO,EAAEQ,MAAM,CAACD,KAAK,CAACQ,KAAK,CAAC,EAAER,KAAK,CAACzC,IAAI,CAACgD,SAAS,CAAC;IACzQ,OAAOP,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/Image/useImageStyles.styles.raw.js CHANGED Viewed

@@ -83,6 +83,7 @@ const useImageStyles_unstable = (state)=>{
     // eslint-disable-next-line eqeqeq
     const hasExplicitSize = height != null || width != null;
     const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(imageClassNames.root, styles.base, state.block && styles.block, state.bordered && styles.bordered, state.shadow && styles.shadow, styles[state.fit], shouldApplyFitFill && styles.fitFill, styles[state.shape], state.root.className);
     return state;
 };

package/lib-commonjs/components/Image/useImageStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Image/useImageStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: { borderRadius: tokens.borderRadiusCircular },\n rounded: { borderRadius: tokens.borderRadiusMedium },\n square: {\n /* The square styles are exactly the same as the base styles. /\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n },\n default: {\n / The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n },\n\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState): ImageState => {\n 'use no memo';\n\n const styles = useStyles();\n\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n shouldApplyFitFill && styles.fitFill,\n styles[state.shape],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["shorthands","mergeClasses","makeStyles","tokens","imageClassNames","root","useStyles","base","borderColor","colorNeutralStroke1","borderRadius","borderRadiusNone","boxSizing","display","bordered","borderStyle","borderWidth","strokeWidthThin","circular","borderRadiusCircular","rounded","borderRadiusMedium","square","shadow","boxShadow","shadow4","center","objectFit","objectPosition","contain","default","cover","none","fitFill","height","width","block","useImageStyles_unstable","state","styles","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"mappings":"AAAA;;;;;;;;;;;;IAOaI,eAAAA;;;IAkEAiC,uBAAAA;;;;uBAvEwC,iBAAiB;4BAC/C,wBAAwB;AAIxC,wBAAoD;IACzDhC,MAAM;AACR,EAAE;AAEF,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3B,cAAc;IACdK,MAAM;QACJ,GAAGP,iBAAAA,CAAWQ,WAAW,CAACL,kBAAAA,CAAOM,mBAAmB,CAAC;QACrDC,cAAcP,kBAAAA,CAAOQ,gBAAgB;QAErCC,WAAW;QACXC,SAAS;IACX;IAEA,kBAAkB;IAClBC,UAAU;QACR,GAAGd,iBAAAA,CAAWe,WAAW,CAAC,QAAQ;QAClC,GAAGf,iBAAAA,CAAWgB,WAAW,CAACb,kBAAAA,CAAOc,eAAe,CAAC;IACnD;IAEA,mBAAmB;IACnBC,UAAU;QAAER,cAAcP,kBAAAA,CAAOgB,oBAAoB;IAAC;IACtDC,SAAS;QAAEV,cAAcP,kBAAAA,CAAOkB,kBAAkB;IAAC;IACnDC,QAAQ,CAER;IAEA,gBAAgB;IAChBC,QAAQ;QACNC,WAAWrB,kBAAAA,CAAOsB,OAAO;IAC3B;IAEA,iBAAiB;IACjBC,QAAQ;QACNC,WAAW;QACXC,gBAAgB;IAClB;IACAC,SAAS;QACPF,WAAW;QACXC,gBAAgB;IAClB;IACAE,SAAS,CAET;IACAC,OAAO;QACLJ,WAAW;QACXC,gBAAgB;IAClB;IACAI,MAAM;QACJL,WAAW;QACXC,gBAAgB;IAClB;IAEA,oEAAoE;IACpE,yEAAyE;IACzEK,SAAS;QACPC,QAAQ;QACRC,OAAO;IACT;IAEA,eAAe;IACfC,OAAO;QACLD,OAAO;IACT;AACF;AAEO,gCAAgC,CAACG;IACtC;IAEA,MAAMC,SAASjC;IAEf,MAAM,EAAE4B,MAAM,EAAEC,KAAK,EAAE,GAAGG,MAAMjC,IAAI;IACpC,kCAAkC;IAClC,MAAMmC,kBAAkBN,UAAU,QAAQC,SAAS;IACnD,MAAMM,qBAAqBH,MAAMI,GAAG,KAAK,aAAa,CAACF;~~IAEvDF~~,MAAMjC,IAAI,CAACsC,SAAS,~~OAAG1C~~,~~mBAAAA~~,EACrBG,gBAAgBC,IAAI,EACpBkC,OAAOhC,IAAI,EACX+B,MAAMF,KAAK,IAAIG,OAAOH,KAAK,EAC3BE,MAAMxB,QAAQ,IAAIyB,OAAOzB,QAAQ,EACjCwB,MAAMf,MAAM,IAAIgB,OAAOhB,MAAM,EAC7BgB,MAAM,CAACD,MAAMI,GAAG,CAAC,EACjBD,sBAAsBF,OAAON,OAAO,EACpCM,MAAM,CAACD,MAAMM,KAAK,CAAC,EACnBN,MAAMjC,IAAI,CAACsC,SAAS;IAGtB,OAAOL;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/Image/useImageStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n borderRadius: tokens.borderRadiusNone,\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: { borderRadius: tokens.borderRadiusCircular },\n rounded: { borderRadius: tokens.borderRadiusMedium },\n square: {\n /* The square styles are exactly the same as the base styles. /\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n },\n default: {\n / The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n },\n\n // When no explicit height/width props are provided, apply full-size\n // sizing so fit modes behave as intended (object-fit fills the element).\n fitFill: {\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState): ImageState => {\n 'use no memo';\n\n const styles = useStyles();\n\n const { height, width } = state.root;\n // eslint-disable-next-line eqeqeq\n const hasExplicitSize = height != null \|\| width != null;\n const shouldApplyFitFill = state.fit !== 'default' && !hasExplicitSize;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n shouldApplyFitFill && styles.fitFill,\n styles[state.shape],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["shorthands","mergeClasses","makeStyles","tokens","imageClassNames","root","useStyles","base","borderColor","colorNeutralStroke1","borderRadius","borderRadiusNone","boxSizing","display","bordered","borderStyle","borderWidth","strokeWidthThin","circular","borderRadiusCircular","rounded","borderRadiusMedium","square","shadow","boxShadow","shadow4","center","objectFit","objectPosition","contain","default","cover","none","fitFill","height","width","block","useImageStyles_unstable","state","styles","hasExplicitSize","shouldApplyFitFill","fit","className","shape"],"mappings":"AAAA;;;;;;;;;;;;IAOaI,eAAAA;;;IAkEAiC,uBAAAA;;;;uBAvEwC,iBAAiB;4BAC/C,wBAAwB;AAIxC,wBAAoD;IACzDhC,MAAM;AACR,EAAE;AAEF,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3B,cAAc;IACdK,MAAM;QACJ,GAAGP,iBAAAA,CAAWQ,WAAW,CAACL,kBAAAA,CAAOM,mBAAmB,CAAC;QACrDC,cAAcP,kBAAAA,CAAOQ,gBAAgB;QAErCC,WAAW;QACXC,SAAS;IACX;IAEA,kBAAkB;IAClBC,UAAU;QACR,GAAGd,iBAAAA,CAAWe,WAAW,CAAC,QAAQ;QAClC,GAAGf,iBAAAA,CAAWgB,WAAW,CAACb,kBAAAA,CAAOc,eAAe,CAAC;IACnD;IAEA,mBAAmB;IACnBC,UAAU;QAAER,cAAcP,kBAAAA,CAAOgB,oBAAoB;IAAC;IACtDC,SAAS;QAAEV,cAAcP,kBAAAA,CAAOkB,kBAAkB;IAAC;IACnDC,QAAQ,CAER;IAEA,gBAAgB;IAChBC,QAAQ;QACNC,WAAWrB,kBAAAA,CAAOsB,OAAO;IAC3B;IAEA,iBAAiB;IACjBC,QAAQ;QACNC,WAAW;QACXC,gBAAgB;IAClB;IACAC,SAAS;QACPF,WAAW;QACXC,gBAAgB;IAClB;IACAE,SAAS,CAET;IACAC,OAAO;QACLJ,WAAW;QACXC,gBAAgB;IAClB;IACAI,MAAM;QACJL,WAAW;QACXC,gBAAgB;IAClB;IAEA,oEAAoE;IACpE,yEAAyE;IACzEK,SAAS;QACPC,QAAQ;QACRC,OAAO;IACT;IAEA,eAAe;IACfC,OAAO;QACLD,OAAO;IACT;AACF;AAEO,gCAAgC,CAACG;IACtC;IAEA,MAAMC,SAASjC;IAEf,MAAM,EAAE4B,MAAM,EAAEC,KAAK,EAAE,GAAGG,MAAMjC,IAAI;IACpC,kCAAkC;IAClC,MAAMmC,kBAAkBN,UAAU,QAAQC,SAAS;IACnD,MAAMM,qBAAqBH,MAAMI,GAAG,KAAK,aAAa,CAACF;IAEvD,oDAAoD;IACpDF,MAAMjC,IAAI,CAACsC,SAAS,GAAG1C,uBAAAA,EACrBG,gBAAgBC,IAAI,EACpBkC,OAAOhC,IAAI,EACX+B,MAAMF,KAAK,IAAIG,OAAOH,KAAK,EAC3BE,MAAMxB,QAAQ,IAAIyB,OAAOzB,QAAQ,EACjCwB,MAAMf,MAAM,IAAIgB,OAAOhB,MAAM,EAC7BgB,MAAM,CAACD,MAAMI,GAAG,CAAC,EACjBD,sBAAsBF,OAAON,OAAO,EACpCM,MAAM,CAACD,MAAMM,KAAK,CAAC,EACnBN,MAAMjC,IAAI,CAACsC,SAAS;IAGtB,OAAOL;AACT,EAAE"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-image",
-  "version": "9.4.0",
+  "version": "9.4.2",
   "description": "Fluent UI React Image component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -13,8 +13,8 @@
   "license": "MIT",
   "dependencies": {
     "@fluentui/react-shared-contexts": "^9.26.2",
-    "@fluentui/react-utilities": "^9.26.2",
-    "@fluentui/react-jsx-runtime": "^9.4.1",
+    "@fluentui/react-utilities": "^9.26.4",
+    "@fluentui/react-jsx-runtime": "^9.4.3",
     "@fluentui/react-theme": "^9.2.1",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"