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

@fluentui/react-swatch-picker 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 (85) hide show

package/lib-commonjs/components/ImageSwatch/useImageSwatchStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useImageSwatchStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const imageSwatchClassNames = {\n root: 'fui-ImageSwatch'\n};\n/*\n Styles for the root slot\n / const useStyles = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n backgroundSize: 'cover',\n backgroundRepeat: 'no-repeat',\n padding: '0',\n ':hover': {\n cursor: 'pointer',\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke1}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n },\n ':hover:active': {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`\n },\n ':focus': {\n outline: 'none'\n },\n ':focus-visible': {\n outline: 'none'\n },\n ...createCustomFocusIndicatorStyle({\n border: 'none',\n outline: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n }),\n // High contrast styles\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke2Hover}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`\n }\n }\n});\nconst useStylesSelected = makeStyles({\n selected: {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke1}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokeHover}, inset 0 0 0 6px ${tokens.colorStrokeFocus1}`\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 7px ${tokens.colorStrokeFocus1}`\n },\n ...createCustomFocusIndicatorStyle({\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus2}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`\n }),\n '@media (forced-colors: active)': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`\n }\n }\n});\nconst useSizeStyles = makeStyles({\n 'extra-small': {\n width: '20px',\n height: '20px'\n },\n small: {\n width: '24px',\n height: '24px'\n },\n medium: {\n width: '28px',\n height: '28px'\n },\n large: {\n width: '32px',\n height: '32px'\n }\n});\nconst useShapeStyles = makeStyles({\n rounded: {\n borderRadius: tokens.borderRadiusMedium,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusMedium\n })\n },\n circular: {\n borderRadius: tokens.borderRadiusCircular,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusCircular\n })\n },\n square: {\n borderRadius: tokens.borderRadiusNone,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusNone\n })\n }\n});\n/\n Apply styling to the ImageSwatch slots based on the state\n */ export const useImageSwatchStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const selectedStyles = useStylesSelected();\n const sizeStyles = useSizeStyles();\n const shapeStyles = useShapeStyles();\n const { size = 'medium', shape = 'square' } = state;\n state.root.className = mergeClasses(imageSwatchClassNames.root, styles, sizeStyles[size], shapeStyles[shape], state.selected && selectedStyles.selected, state.root.className);\n return state;\n};\n"],"names":["~~imageSwatchClassNames~~","~~useImageSwatchStyles_unstable~~","~~root~~","~~useStyles~~","~~__resetStyles~~","r","s","useStylesSelected","~~__styles","~~selected","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","E5pizo","Bvxd0ez","vajtyg","j6ew2k","Bspt33j","d","p","h","m","useSizeStyles","a9b677","Bqenvij","small","medium","large","useShapeStyles","rounded","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","circular","square","state","styles","selectedStyles","sizeStyles","shapeStyles","size","shape","className"~~,"mergeClasses"~~],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;~~IAGaA~~,qBAAqB;~~eAArBA;;IAqGIC,6BAA6B;eAA7BA~~;;;uBAxGyC;~~AAGnD~~,~~MAAMD,wBAAwB~~;~~IACjCE~~,~~MAAM~~;AACV;~~AACA~~;;CAEA,GAAI,MAAMC,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~oBAAA,EAAA,YAAA,MAAA;~~IAAAC~~,~~GAAA~~;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,~~GAAA~~;QAAA;KAAA;AAAA;~~AAsCtB~~,MAAMC,~~oBAAiB~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAC~~,~~UAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;IAAA;AAAA,GAAA;IAAAC,~~GAAA~~;QAAA;YAAA;YAAA;gBAAAC,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;IAAAC,~~GAAA~~;QAAA;QAAA;KAAA;IAAAC,~~GAAA~~;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;KAAA;AAAA;~~AAkB1B~~,MAAMC,~~gBAAa~~,WAAA,~~GAAG5B~~,~~IAAAA,~~eAAA,EAAA;IAAA,eAAA;~~QAAA6B~~,~~QAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAC,~~OAAA~~;QAAAF,~~QAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAE,~~QAAA~~;QAAAH,~~QAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAG,~~OAAA~~;QAAAJ,~~QAAA~~;QAAAC,~~SAAA~~;IAAA;AAAA,GAAA;IAAAN,~~GAAA~~;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;~~AAkBtB~~,MAAMU,~~iBAAc~~,WAAA,~~GAAGlC~~,~~IAAAA~~,~~eAAA,~~EAAA;~~IAAAmC~~,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAC,~~UAAA~~;QAAAV,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAE,~~QAAA~~;QAAAX,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;IAAA;AAAA,GAAA;IAAArB,~~GAAA~~;QAAA;YAAA;YAAA;gBAAAC,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;KAAA;AAAA;~~AAsBZ~~,~~MAAMhC~~,~~gCAAiCuD~~,~~CAAAA~~;~~IAC9C~~;~~IACA~~,MAAMC,~~SAAStD~~;~~IACf~~,~~MAAMuD~~,~~iBAAiBnD~~;~~IACvB~~,MAAMoD,~~aAAavB~~;~~IACnB~~,~~MAAMwB~~,~~cAAclB~~;~~IACpB~~,MAAM,~~EAAEmB~~,~~OAAO~~,QAAQ,EAAEC,~~QAAQ~~,QAAA,EAAU,GAAGN;~~IAC9CA~~,~~MAAMtD~~,IAAI,~~CAAC6D~~,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAAChE~~,~~sBAAsBE~~,IAAI,~~EAAEuD~~,~~QAAQE~~,UAAU,CAACE,~~KAAK~~,EAAED,WAAW,CAACE,~~MAAM~~,EAAEN,~~MAAM/C~~,QAAQ,~~IAAIiD~~,~~eAAejD~~,QAAQ,~~EAAE+C~~,~~MAAMtD~~,IAAI,~~CAAC6D~~,SAAS;~~IAC7K~~,OAAOP;~~AACX~~"}
1	+ {"version":3,"sources":["useImageSwatchStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const imageSwatchClassNames = {\n root: 'fui-ImageSwatch'\n};\n/*\n Styles for the root slot\n / const useStyles = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n backgroundSize: 'cover',\n backgroundRepeat: 'no-repeat',\n padding: '0',\n ':hover': {\n cursor: 'pointer',\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke1}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n },\n ':hover:active': {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`\n },\n ':focus': {\n outline: 'none'\n },\n ':focus-visible': {\n outline: 'none'\n },\n ...createCustomFocusIndicatorStyle({\n border: 'none',\n outline: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n }),\n // High contrast styles\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke2Hover}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`\n }\n }\n});\nconst useStylesSelected = makeStyles({\n selected: {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke1}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokeHover}, inset 0 0 0 6px ${tokens.colorStrokeFocus1}`\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 7px ${tokens.colorStrokeFocus1}`\n },\n ...createCustomFocusIndicatorStyle({\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus2}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`\n }),\n '@media (forced-colors: active)': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`\n }\n }\n});\nconst useSizeStyles = makeStyles({\n 'extra-small': {\n width: '20px',\n height: '20px'\n },\n small: {\n width: '24px',\n height: '24px'\n },\n medium: {\n width: '28px',\n height: '28px'\n },\n large: {\n width: '32px',\n height: '32px'\n }\n});\nconst useShapeStyles = makeStyles({\n rounded: {\n borderRadius: tokens.borderRadiusMedium,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusMedium\n })\n },\n circular: {\n borderRadius: tokens.borderRadiusCircular,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusCircular\n })\n },\n square: {\n borderRadius: tokens.borderRadiusNone,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusNone\n })\n }\n});\n/\n Apply styling to the ImageSwatch slots based on the state\n */ export const useImageSwatchStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const selectedStyles = useStylesSelected();\n const sizeStyles = useSizeStyles();\n const shapeStyles = useShapeStyles();\n const { size = 'medium', shape = 'square' } = state;\n state.root.className = mergeClasses(imageSwatchClassNames.root, styles, sizeStyles[size], shapeStyles[shape], state.selected && selectedStyles.selected, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","__resetStyles","tokens","createCustomFocusIndicatorStyle","imageSwatchClassNames","root","useStyles","r","s","useStylesSelected","selected","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","E5pizo","Bvxd0ez","vajtyg","j6ew2k","Bspt33j","d","p","h","m","useSizeStyles","a9b677","Bqenvij","small","medium","large","useShapeStyles","rounded","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","circular","square","useImageSwatchStyles_unstable","state","styles","selectedStyles","sizeStyles","shapeStyles","size","shape","className"],"mappings":"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"}

package/lib-commonjs/components/ImageSwatch/useImageSwatchStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/ImageSwatch/useImageSwatchStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ImageSwatchSlots, ImageSwatchState } from './ImageSwatch.types';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\n\nexport const imageSwatchClassNames: SlotClassNames<ImageSwatchSlots> = {\n root: 'fui-ImageSwatch',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n backgroundSize: 'cover',\n backgroundRepeat: 'no-repeat',\n padding: '0',\n ':hover': {\n cursor: 'pointer',\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke1}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`,\n },\n ':hover:active': {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`,\n },\n ':focus': {\n outline: 'none',\n },\n ':focus-visible': {\n outline: 'none',\n },\n ...createCustomFocusIndicatorStyle({\n border: 'none',\n outline: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`,\n }),\n\n // High contrast styles\n\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke2Hover}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`,\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`,\n },\n },\n});\n\nconst useStylesSelected = makeStyles({\n selected: {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke1}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokeHover}, inset 0 0 0 6px ${tokens.colorStrokeFocus1}`,\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 7px ${tokens.colorStrokeFocus1}`,\n },\n ...createCustomFocusIndicatorStyle({\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus2}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n }),\n '@media (forced-colors: active)': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n },\n },\n});\n\nconst useSizeStyles = makeStyles({\n 'extra-small': {\n width: '20px',\n height: '20px',\n },\n small: {\n width: '24px',\n height: '24px',\n },\n medium: {\n width: '28px',\n height: '28px',\n },\n large: {\n width: '32px',\n height: '32px',\n },\n});\n\nconst useShapeStyles = makeStyles({\n rounded: {\n borderRadius: tokens.borderRadiusMedium,\n ...createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusMedium }),\n },\n circular: {\n borderRadius: tokens.borderRadiusCircular,\n ...createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusCircular }),\n },\n square: {\n borderRadius: tokens.borderRadiusNone,\n ...createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusNone }),\n },\n});\n\n/\n Apply styling to the ImageSwatch slots based on the state\n */\nexport const useImageSwatchStyles_unstable = (state: ImageSwatchState): ImageSwatchState => {\n 'use no memo';\n\n const styles = useStyles();\n const selectedStyles = useStylesSelected();\n const sizeStyles = useSizeStyles();\n const shapeStyles = useShapeStyles();\n\n const { size = 'medium', shape = 'square' } = state;\n\n state.root.className = mergeClasses(\n imageSwatchClassNames.root,\n styles,\n sizeStyles[size],\n shapeStyles[shape],\n state.selected && selectedStyles.selected,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["~~imageSwatchClassNames~~","~~useImageSwatchStyles_unstable~~","~~root~~","~~useStyles~~","~~makeResetStyles~~","display","boxSizing","border","~~tokens","~~colorTransparentStroke","backgroundSize","backgroundRepeat","padding","cursor","boxShadow","strokeWidthThick","colorBrandStroke1","strokeWidthThicker","colorStrokeFocus1","colorCompoundBrandStrokePressed","strokeWidthThickest","outline","~~createCustomFocusIndicatorStyle","~~colorStrokeFocus2","forcedColorAdjust","colorBrandStroke2Hover","colorBrandStroke2Pressed","useStylesSelected","~~makeStyles","~~selected","colorCompoundBrandStrokeHover","useSizeStyles","width","height","small","medium","large","useShapeStyles","rounded","borderRadius","borderRadiusMedium","circular","borderRadiusCircular","square","borderRadiusNone","state","styles","selectedStyles","sizeStyles","shapeStyles","size","shape","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAMaA~~,qBAAAA~~;eAAAA;;IAwGAC,6BAAAA;eAAAA~~;;;uBA9G6C;~~4BAGnC~~;~~8BACyB~~;~~AAEzC~~,~~MAAMD,wBAA0D~~;~~IACrEE~~,MAAM;AACR;~~AAEA~~;;CAEC,GACD,MAAMC,~~YAAYC~~,~~IAAAA,~~sBAAAA,EAAgB;~~IAChCC~~,SAAS;IACTC,WAAW;IACXC,QAAQ,CAAC,UAAU,~~EAAEC~~,kBAAAA,~~CAAOC~~,sBAAsB,~~CAAC,CAAC~~;IACpDC,gBAAgB;IAChBC,kBAAkB;IAClBC,SAAS;IACT,UAAU;QACRC,QAAQ;~~QACRN~~,QAAQ;~~QACRO~~,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOO~~,gBAAgB,CAAC,CAAC,~~EAAEP~~,kBAAAA,~~CAAOQ~~,iBAAiB,CAAC,cAAc,~~EAAER~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;IACvJ;IACA,iBAAiB;~~QACfX~~,QAAQ;~~QACRO~~,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOW~~,+BAA+B,CAAC,cAAc,~~EAAEX~~,kBAAAA,~~CAAOY~~,mBAAmB,CAAC,CAAC,~~EAAEZ~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;IACxK;IACA,UAAU;QACRG,SAAS;IACX;IACA,kBAAkB;QAChBA,SAAS;IACX;IACA,~~GAAGC~~,~~IAAAA,~~6CAAAA,EAAgC;~~QACjCf~~,QAAQ;~~QACRc~~,SAAS;QACTP,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOO~~,gBAAgB,CAAC,CAAC,~~EAAEP~~,kBAAAA,~~CAAOe~~,iBAAiB,CAAC,cAAc,~~EAAEf~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;IACvJ,EAAE;IAEF,uBAAuB;IAEvB,kCAAkC;~~QAChCM~~,mBAAmB;QACnB,UAAU;~~YACRV~~,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOO~~,gBAAgB,CAAC,CAAC,~~EAAEP~~,kBAAAA,~~CAAOiB~~,sBAAsB,CAAC,cAAc,~~EAAEjB~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QAC5J;QACA,iBAAiB;YACfJ,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOkB~~,wBAAwB,CAAC,cAAc,~~EAAElB~~,kBAAAA,~~CAAOY~~,mBAAmB,CAAC,CAAC,~~EAAEZ~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QACjK;IACF;AACF;AAEA,~~MAAMS~~,~~oBAAoBC~~,~~IAAAA,~~iBAAAA,EAAW;~~IACnCC~~,UAAU;~~QACRtB~~,QAAQ;~~QACRO~~,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOQ~~,iBAAiB,CAAC,kBAAkB,~~EAAER~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QAC9H,UAAU;YACRJ,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOY~~,mBAAmB,CAAC,CAAC,~~EAAEZ~~,kBAAAA,~~CAAOsB~~,6BAA6B,CAAC,kBAAkB,~~EAAEtB~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QAC7I;QACA,iBAAiB;YACfJ,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOY~~,mBAAmB,CAAC,CAAC,~~EAAEZ~~,kBAAAA,~~CAAOW~~,+BAA+B,CAAC,kBAAkB,~~EAAEX~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QAC/I;QACA,~~GAAGI~~,~~IAAAA,~~6CAAAA,EAAgC;~~YACjCR~~,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOe~~,iBAAiB,CAAC,kBAAkB,~~EAAEf~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QAChI,EAAE;QACF,kCAAkC;YAChCJ,WAAW,CAAC,YAAY,~~EAAEN~~,kBAAAA,~~CAAOS~~,kBAAkB,CAAC,CAAC,~~EAAET~~,kBAAAA,~~CAAOkB~~,wBAAwB,CAAC,kBAAkB,~~EAAElB~~,kBAAAA,~~CAAOU~~,iBAAiB,~~CAAC,CAAC~~;QACvI;IACF;AACF;AAEA,~~MAAMa~~,~~gBAAgBH~~,~~IAAAA~~,~~iBAAAA,~~EAAW;IAC/B,eAAe;~~QACbI~~,OAAO;QACPC,QAAQ;IACV;IACAC,OAAO;QACLF,OAAO;QACPC,QAAQ;IACV;IACAE,QAAQ;QACNH,OAAO;QACPC,QAAQ;IACV;IACAG,OAAO;QACLJ,OAAO;QACPC,QAAQ;IACV;AACF;AAEA,MAAMI,~~iBAAiBT~~,~~IAAAA,~~iBAAAA,EAAW;~~IAChCU~~,SAAS;QACPC,~~cAAc/B~~,kBAAAA,~~CAAOgC~~,kBAAkB;QACvC,~~GAAGlB~~,~~IAAAA,~~6CAAAA,EAAgC;~~YAAEiB~~,~~cAAc/B~~,kBAAAA,~~CAAOgC~~,kBAAkB;QAAC,EAAE;IACjF;IACAC,UAAU;QACRF,~~cAAc/B~~,kBAAAA,~~CAAOkC~~,oBAAoB;QACzC,~~GAAGpB~~,~~IAAAA,~~6CAAAA,EAAgC;~~YAAEiB~~,~~cAAc/B~~,kBAAAA,~~CAAOkC~~,oBAAoB;QAAC,EAAE;IACnF;IACAC,QAAQ;QACNJ,~~cAAc/B~~,kBAAAA,~~CAAOoC~~,gBAAgB;QACrC,~~GAAGtB~~,~~IAAAA,~~6CAAAA,EAAgC;~~YAAEiB~~,~~cAAc/B~~,kBAAAA,~~CAAOoC~~,gBAAgB;QAAC,EAAE;IAC/E;AACF;AAKO,~~MAAM3C~~,gCAAgC,~~CAAC4C~~;IAC5C;IAEA,MAAMC,~~SAAS3C~~;IACf,~~MAAM4C~~,iBAAiBpB;IACvB,MAAMqB,~~aAAajB~~;IACnB,~~MAAMkB~~,~~cAAcZ~~;IAEpB,MAAM,~~EAAEa~~,OAAO,QAAQ,EAAEC,QAAQ,QAAQ,EAAE,GAAGN;IAE9CA,~~MAAM3C~~,IAAI,~~CAACkD~~,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAAA,~~EACrBrD~~,~~sBAAsBE~~,IAAI,~~EAC1B4C~~,QACAE,UAAU,CAACE,KAAK,EAChBD,WAAW,CAACE,MAAM,EAClBN,~~MAAMhB~~,QAAQ,~~IAAIkB~~,~~eAAelB~~,QAAQ,~~EACzCgB~~,~~MAAM3C~~,IAAI,~~CAACkD~~,SAAS;IAGtB,OAAOP;AACT"}
1	+ {"version":3,"sources":["../src/components/ImageSwatch/useImageSwatchStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ImageSwatchSlots, ImageSwatchState } from './ImageSwatch.types';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\n\nexport const imageSwatchClassNames: SlotClassNames<ImageSwatchSlots> = {\n root: 'fui-ImageSwatch',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n border: `1px solid ${tokens.colorTransparentStroke}`,\n backgroundSize: 'cover',\n backgroundRepeat: 'no-repeat',\n padding: '0',\n ':hover': {\n cursor: 'pointer',\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke1}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`,\n },\n ':hover:active': {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`,\n },\n ':focus': {\n outline: 'none',\n },\n ':focus-visible': {\n outline: 'none',\n },\n ...createCustomFocusIndicatorStyle({\n border: 'none',\n outline: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`,\n }),\n\n // High contrast styles\n\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke2Hover}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`,\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`,\n },\n },\n});\n\nconst useStylesSelected = makeStyles({\n selected: {\n border: 'none',\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke1}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n ':hover': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokeHover}, inset 0 0 0 6px ${tokens.colorStrokeFocus1}`,\n },\n ':hover:active': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 7px ${tokens.colorStrokeFocus1}`,\n },\n ...createCustomFocusIndicatorStyle({\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus2}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n }),\n '@media (forced-colors: active)': {\n boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n },\n },\n});\n\nconst useSizeStyles = makeStyles({\n 'extra-small': {\n width: '20px',\n height: '20px',\n },\n small: {\n width: '24px',\n height: '24px',\n },\n medium: {\n width: '28px',\n height: '28px',\n },\n large: {\n width: '32px',\n height: '32px',\n },\n});\n\nconst useShapeStyles = makeStyles({\n rounded: {\n borderRadius: tokens.borderRadiusMedium,\n ...createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusMedium }),\n },\n circular: {\n borderRadius: tokens.borderRadiusCircular,\n ...createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusCircular }),\n },\n square: {\n borderRadius: tokens.borderRadiusNone,\n ...createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusNone }),\n },\n});\n\n/\n Apply styling to the ImageSwatch slots based on the state\n */\nexport const useImageSwatchStyles_unstable = (state: ImageSwatchState): ImageSwatchState => {\n 'use no memo';\n\n const styles = useStyles();\n const selectedStyles = useStylesSelected();\n const sizeStyles = useSizeStyles();\n const shapeStyles = useShapeStyles();\n\n const { size = 'medium', shape = 'square' } = state;\n\n state.root.className = mergeClasses(\n imageSwatchClassNames.root,\n styles,\n sizeStyles[size],\n shapeStyles[shape],\n state.selected && selectedStyles.selected,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","makeResetStyles","tokens","createCustomFocusIndicatorStyle","imageSwatchClassNames","root","useStyles","display","boxSizing","border","colorTransparentStroke","backgroundSize","backgroundRepeat","padding","cursor","boxShadow","strokeWidthThick","colorBrandStroke1","strokeWidthThicker","colorStrokeFocus1","colorCompoundBrandStrokePressed","strokeWidthThickest","outline","colorStrokeFocus2","forcedColorAdjust","colorBrandStroke2Hover","colorBrandStroke2Pressed","useStylesSelected","selected","colorCompoundBrandStrokeHover","useSizeStyles","width","height","small","medium","large","useShapeStyles","rounded","borderRadius","borderRadiusMedium","circular","borderRadiusCircular","square","borderRadiusNone","useImageSwatchStyles_unstable","state","styles","selectedStyles","sizeStyles","shapeStyles","size","shape","className"],"mappings":"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"}

package/lib-commonjs/components/SwatchPicker/SwatchPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPicker/SwatchPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSwatchPicker_unstable } from './useSwatchPicker';\nimport { renderSwatchPicker_unstable } from './renderSwatchPicker';\nimport { useSwatchPickerStyles_unstable } from './useSwatchPickerStyles.styles';\nimport type { SwatchPickerProps } from './SwatchPicker.types';\nimport { useSwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n SwatchPicker component - TODO: add more docs\n */\nexport const SwatchPicker: ForwardRefComponent<SwatchPickerProps> = React.forwardRef((props, ref) => {\n const state = useSwatchPicker_unstable(props, ref);\n const contextValues = useSwatchPickerContextValues(state);\n\n useSwatchPickerStyles_unstable(state);\n useCustomStyleHook_unstable('useSwatchPickerStyles_unstable')(state);\n\n return renderSwatchPicker_unstable(state, contextValues);\n});\n\nSwatchPicker.displayName = 'SwatchPicker';\n"],"names":["~~SwatchPicker~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useSwatchPicker_unstable~~","~~contextValues~~","~~useSwatchPickerContextValues~~","~~useSwatchPickerStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderSwatchPicker_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAYaA;;;eAAAA;;;;~~iEAZU;~~iCAEkB~~;~~oCACG~~;~~6CACG~~;~~8BAEF~~;~~qCACD~~;~~AAKrC~~,~~MAAMA~~,~~eAAAA,~~WAAAA,~~GAAuDC~~,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,~~QAAQC~~,~~IAAAA,~~yCAAAA,~~EAAyBH~~,OAAOC;IAC9C,~~MAAMG~~,~~gBAAgBC~~,~~IAAAA,~~0CAAAA,~~EAA6BH~~;~~IAEnDI~~,~~IAAAA,~~2DAAAA,EAA+BJ;~~IAC~~/BK,~~IAAAA,~~gDAAAA,EAA4B,~~kCAAkCL~~;IAE9D,~~OAAOM,IAAAA~~,+CAAAA,~~EAA4BN~~,~~OAAOE~~;AAC5C;~~AAEAP~~,~~aAAaY~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/SwatchPicker/SwatchPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSwatchPicker_unstable } from './useSwatchPicker';\nimport { renderSwatchPicker_unstable } from './renderSwatchPicker';\nimport { useSwatchPickerStyles_unstable } from './useSwatchPickerStyles.styles';\nimport type { SwatchPickerProps } from './SwatchPicker.types';\nimport { useSwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n SwatchPicker component - TODO: add more docs\n */\nexport const SwatchPicker: ForwardRefComponent<SwatchPickerProps> = React.forwardRef((props, ref) => {\n const state = useSwatchPicker_unstable(props, ref);\n const contextValues = useSwatchPickerContextValues(state);\n\n useSwatchPickerStyles_unstable(state);\n useCustomStyleHook_unstable('useSwatchPickerStyles_unstable')(state);\n\n return renderSwatchPicker_unstable(state, contextValues);\n});\n\nSwatchPicker.displayName = 'SwatchPicker';\n"],"names":["React","useSwatchPicker_unstable","renderSwatchPicker_unstable","useSwatchPickerStyles_unstable","useSwatchPickerContextValues","useCustomStyleHook_unstable","SwatchPicker","forwardRef","props","ref","state","contextValues","displayName"],"mappings":";;;;+BAYaM;;;;;;;iEAZU,QAAQ;iCAEU,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;8BAEnC,8BAA8B;qCAC/B,kCAAkC;AAKvE,qBAAMA,WAAAA,GAAuDN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQT,yCAAAA,EAAyBO,OAAOC;IAC9C,MAAME,oBAAgBP,0CAAAA,EAA6BM;QAEnDP,2DAAAA,EAA+BO;QAC/BL,gDAAAA,EAA4B,kCAAkCK;IAE9D,WAAOR,+CAAAA,EAA4BQ,OAAOC;AAC5C,GAAG;AAEHL,aAAaM,WAAW,GAAG"}

package/lib-commonjs/components/SwatchPicker/SwatchPicker.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPicker/SwatchPicker.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot, EventHandler, EventData } from '@fluentui/react-utilities';\nimport { SwatchPickerContextValue } from '../../contexts/swatchPicker';\n\nexport type SwatchPickerSlots = {\n root: Slot<'div'>;\n};\n\nexport type SwatchPickerOnSelectEventHandler = EventHandler<SwatchPickerOnSelectionChangeData>;\n\nexport type SwatchPickerOnSelectionChangeData = EventData<'click', React.MouseEvent<HTMLButtonElement>> & {\n selectedValue: string;\n selectedSwatch: string;\n};\n\n/*\n SwatchPicker Props\n /\nexport type SwatchPickerProps = ComponentProps<SwatchPickerSlots> & {\n /\n Default selected value\n /\n defaultSelectedValue?: string;\n\n /\n Whether SwatchPicker is row or grid\n /\n layout?: 'row' \| 'grid';\n\n /\n Triggers a callback when the value has been changed\n /\n onSelectionChange?: EventHandler<SwatchPickerOnSelectionChangeData>;\n\n /\n Controlled selected value\n /\n selectedValue?: string;\n\n /\n Swatch size\n * @defaultvalue 'medium'\n /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large';\n\n /\n Swatch shape\n * @defaultvalue 'square'\n /\n shape?: 'rounded' \| 'square' \| 'circular';\n\n /\n Spacing between swatches\n * @defaultvalue 'medium'\n /\n spacing?: 'small' \| 'medium';\n};\n\n/\n State used in rendering SwatchPicker\n */\nexport type SwatchPickerState = ComponentState<SwatchPickerSlots> &\n SwatchPickerContextValue &\n Pick<SwatchPickerProps, 'layout' \| 'size' \| 'shape' \| 'spacing'> & {\n isGrid: boolean;\n };\n"],"names":[],"~~rangeMappings~~"~~:";;;;;"~~,"mappings":";;;;;iEAAuB"}
1	+ {"version":3,"sources":["../src/components/SwatchPicker/SwatchPicker.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot, EventHandler, EventData } from '@fluentui/react-utilities';\nimport { SwatchPickerContextValue } from '../../contexts/swatchPicker';\n\nexport type SwatchPickerSlots = {\n root: Slot<'div'>;\n};\n\nexport type SwatchPickerOnSelectEventHandler = EventHandler<SwatchPickerOnSelectionChangeData>;\n\nexport type SwatchPickerOnSelectionChangeData = EventData<'click', React.MouseEvent<HTMLButtonElement>> & {\n selectedValue: string;\n selectedSwatch: string;\n};\n\n/*\n SwatchPicker Props\n /\nexport type SwatchPickerProps = ComponentProps<SwatchPickerSlots> & {\n /\n Default selected value\n /\n defaultSelectedValue?: string;\n\n /\n Whether SwatchPicker is row or grid\n /\n layout?: 'row' \| 'grid';\n\n /\n Triggers a callback when the value has been changed\n /\n onSelectionChange?: EventHandler<SwatchPickerOnSelectionChangeData>;\n\n /\n Controlled selected value\n /\n selectedValue?: string;\n\n /\n Swatch size\n * @defaultvalue 'medium'\n /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large';\n\n /\n Swatch shape\n * @defaultvalue 'square'\n /\n shape?: 'rounded' \| 'square' \| 'circular';\n\n /\n Spacing between swatches\n * @defaultvalue 'medium'\n /\n spacing?: 'small' \| 'medium';\n};\n\n/\n State used in rendering SwatchPicker\n */\nexport type SwatchPickerState = ComponentState<SwatchPickerSlots> &\n SwatchPickerContextValue &\n Pick<SwatchPickerProps, 'layout' \| 'size' \| 'shape' \| 'spacing'> & {\n isGrid: boolean;\n };\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

package/lib-commonjs/components/SwatchPicker/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPicker/index.ts"],"sourcesContent":["export { SwatchPicker } from './SwatchPicker';\nexport type {\n SwatchPickerOnSelectEventHandler,\n SwatchPickerOnSelectionChangeData,\n SwatchPickerProps,\n SwatchPickerSlots,\n SwatchPickerState,\n} from './SwatchPicker.types';\nexport { renderSwatchPicker_unstable } from './renderSwatchPicker';\nexport { useSwatchPicker_unstable } from './useSwatchPicker';\nexport { swatchPickerClassNames, useSwatchPickerStyles_unstable } from './useSwatchPickerStyles.styles';\n"],"names":["SwatchPicker","renderSwatchPicker_unstable","~~swatchPickerClassNames~~","~~useSwatchPickerStyles_unstable~~","~~useSwatchPicker_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~YAAY;eAAZA,~~0BAAY~~;;IAQZC,2BAA2B;eAA3BA~~,+CAA2B~~;;IAE3BC~~,~~sBAAsB;eAAtBA,~~mDAAsB~~;;IAAEC~~,~~8BAA8B;eAA9BA,~~2DAA8B~~;;IADtDC~~,~~wBAAwB;eAAxBA,~~yCAAwB;;;8BATJ;~~oCAQe~~;~~iCACH~~;~~6CAC8B~~"}
1	+ {"version":3,"sources":["../src/components/SwatchPicker/index.ts"],"sourcesContent":["export { SwatchPicker } from './SwatchPicker';\nexport type {\n SwatchPickerOnSelectEventHandler,\n SwatchPickerOnSelectionChangeData,\n SwatchPickerProps,\n SwatchPickerSlots,\n SwatchPickerState,\n} from './SwatchPicker.types';\nexport { renderSwatchPicker_unstable } from './renderSwatchPicker';\nexport { useSwatchPicker_unstable } from './useSwatchPicker';\nexport { swatchPickerClassNames, useSwatchPickerStyles_unstable } from './useSwatchPickerStyles.styles';\n"],"names":["SwatchPicker","renderSwatchPicker_unstable","useSwatchPicker_unstable","swatchPickerClassNames","useSwatchPickerStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eAQZC,+CAA2B;;;eAE3BE,mDAAsB;;;eAAEC,2DAA8B;;;eADtDF,yCAAwB;;;8BATJ,iBAAiB;oCAQF,uBAAuB;iCAC1B,oBAAoB;6CACU,iCAAiC"}

package/lib-commonjs/components/SwatchPicker/renderSwatchPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPicker/renderSwatchPicker.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { SwatchPickerProvider } from '../../contexts/swatchPicker';\nimport type { SwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport type { SwatchPickerState, SwatchPickerSlots } from './SwatchPicker.types';\n\n/\n Render the final JSX of SwatchPicker\n */\nexport const renderSwatchPicker_unstable = (state: SwatchPickerState, contextValues: SwatchPickerContextValues) => {\n assertSlots<SwatchPickerSlots>(state);\n\n return (\n <SwatchPickerProvider value={contextValues.swatchPicker}>\n <state.root>{state.root.children}</state.root>\n </SwatchPickerProvider>\n );\n};\n"],"names":["~~renderSwatchPicker_unstable~~","~~state~~","~~contextValues~~","~~assertSlots~~","~~_jsx~~","~~SwatchPickerProvider","~~value","swatchPicker","root","children"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAWaA;;;eAAAA;;;~~4BAVb;~~gCAE4B~~;~~8BACS~~;~~AAO9B~~,~~MAAMA~~,~~8BAA8B,~~CAACC,OAA0BC;~~IACpEC~~,~~IAAAA,~~2BAAAA,EAA+BF;IAE/B,OAAA,WAAA,~~GACEG~~,~~IAAAA,~~eAAA,~~EAACC~~,kCAAAA,EAAAA;~~QAAqBC~~,~~OAAOJ~~,~~cAAcK~~,YAAY;kBACrD,WAAA,~~GAAAH~~,~~IAAAA,~~eAAA,EAACH,~~MAAMO~~,IAAI,EAAA;~~sBAAEP~~,~~MAAMO~~,IAAI,CAACC,QAAQ;;;AAGtC"}
1	+ {"version":3,"sources":["../src/components/SwatchPicker/renderSwatchPicker.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { SwatchPickerProvider } from '../../contexts/swatchPicker';\nimport type { SwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport type { SwatchPickerState, SwatchPickerSlots } from './SwatchPicker.types';\n\n/\n Render the final JSX of SwatchPicker\n */\nexport const renderSwatchPicker_unstable = (state: SwatchPickerState, contextValues: SwatchPickerContextValues) => {\n assertSlots<SwatchPickerSlots>(state);\n\n return (\n <SwatchPickerProvider value={contextValues.swatchPicker}>\n <state.root>{state.root.children}</state.root>\n </SwatchPickerProvider>\n );\n};\n"],"names":["assertSlots","SwatchPickerProvider","renderSwatchPicker_unstable","state","contextValues","value","swatchPicker","root","children"],"mappings":";;;;+BAWaE;;;;;;4BAVb,gDAAiD;gCAErB,4BAA4B;8BACnB,8BAA8B;AAO5D,oCAAoC,CAACC,OAA0BC;QACpEJ,2BAAAA,EAA+BG;IAE/B,OAAA,WAAA,OACE,eAAA,EAACF,kCAAAA,EAAAA;QAAqBI,OAAOD,cAAcE,YAAY;kBACrD,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA;sBAAEJ,MAAMI,IAAI,CAACC,QAAQ;;;AAGtC,EAAE"}

package/lib-commonjs/components/SwatchPicker/useSwatchPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPicker/useSwatchPicker.ts"],"sourcesContent":["import * as React from 'react';\n\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\n\nimport type { SwatchPickerProps, SwatchPickerState } from './SwatchPicker.types';\n\n/*\n Create the state required to render SwatchPicker.\n \n The returned state can be modified with hooks such as useSwatchPickerStyles_unstable,\n * before being passed to renderSwatchPicker_unstable.\n \n @param props - props from this instance of SwatchPicker\n * @param ref - reference to root HTMLElement of SwatchPicker\n */\nexport const useSwatchPicker_unstable = (\n props: SwatchPickerProps,\n ref: React.Ref<HTMLDivElement>,\n): SwatchPickerState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props);\n\n const { layout, onSelectionChange, size = 'medium', shape, spacing = 'medium', style, ...rest } = props;\n\n const isGrid = layout === 'grid';\n const focusAttributes = useArrowNavigationGroup({\n circular: true,\n axis: isGrid ? 'grid-linear' : 'both',\n memorizeCurrent: true,\n });\n\n const role = isGrid ? 'grid' : 'radiogroup';\n\n const [selectedValue, setSelectedValue] = useControllableState({\n state: props.selectedValue,\n defaultState: props.defaultSelectedValue,\n initialState: '',\n });\n\n const requestSelectionChange: SwatchPickerState['requestSelectionChange'] = useEventCallback((event, data) => {\n onSelectionChange?.(event, {\n type: 'click',\n event,\n selectedValue: data.selectedValue,\n selectedSwatch: data.selectedSwatch,\n });\n setSelectedValue(data.selectedValue);\n });\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role,\n ...focusAttributes,\n ...rest,\n }),\n { elementType: 'div' },\n ),\n isGrid,\n requestSelectionChange,\n selectedValue,\n size,\n shape,\n spacing,\n };\n};\n"],"names":["useSwatchPicker_unstable","props","ref","~~useFieldControlProps_unstable","~~layout","onSelectionChange","size","shape","spacing","style","rest","isGrid","focusAttributes","~~useArrowNavigationGroup","~~circular","axis","memorizeCurrent","role","selectedValue","setSelectedValue","~~useControllableState","~~state","defaultState","defaultSelectedValue","initialState","requestSelectionChange","~~useEventCallback","~~event","data","type","selectedSwatch","components","root","~~slot","~~always","~~getIntrinsicElementProps","~~elementType"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAiBaA;;;eAAAA;;;;~~iEAjBU;~~4BAEuB~~;~~8BACN~~;~~gCAC+C~~;~~AAahF~~,~~MAAMA~~,~~2BAA2B,~~CACtCC,OACAC;IAEA,+CAA+C;IAC/CD,~~QAAQE~~,~~IAAAA,~~yCAAAA,~~EAA8BF~~;IAEtC,MAAM,~~EAAEG~~,MAAM,EAAEC,iBAAiB,EAAEC,OAAO,QAAQ,EAAEC,KAAK,EAAEC,UAAU,QAAQ,EAAEC,KAAK,EAAE,GAAGC,MAAM,~~GAAGT~~;IAElG,~~MAAMU~~,SAASP,WAAW;IAC1B,MAAMQ,~~kBAAkBC~~,~~IAAAA~~,~~qCAAAA,~~EAAwB;~~QAC9CC~~,UAAU;QACVC,~~MAAMJ~~,SAAS,gBAAgB;QAC/BK,iBAAiB;IACnB;IAEA,MAAMC,~~OAAON~~,SAAS,SAAS;IAE/B,MAAM,~~CAACO~~,eAAeC,iBAAiB,~~GAAGC~~,~~IAAAA,~~oCAAAA,EAAqB;~~QAC7DC~~,~~OAAOpB~~,~~MAAMiB~~,aAAa;~~QAC1BI~~,~~cAAcrB~~,~~MAAMsB~~,oBAAoB;QACxCC,cAAc;IAChB;IAEA,MAAMC,~~yBAAsEC~~,~~IAAAA,~~gCAAAA,EAAiB,~~CAACC~~,OAAOC;~~QACnGvB~~,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,~~kBAAoBsB~~,OAAO;YACzBE,MAAM;YACNF;~~YACAT~~,~~eAAeU~~,~~KAAKV~~,aAAa;~~YACjCY~~,gBAAgBF,KAAKE,cAAc;QACrC;~~QACAX~~,~~iBAAiBS~~,~~KAAKV~~,aAAa;IACrC;IAEA,OAAO;~~QACLa~~,YAAY;YACVC,MAAM;QACR;QACAA,~~MAAMC~~,oBAAAA,~~CAAKC~~,MAAM,~~CACfC~~,~~IAAAA,~~wCAAAA,EAAyB,OAAO;~~YAC9BjC~~;~~YACAe~~;YACA,~~GAAGL~~,eAAe;YAClB,GAAGF,IAAI;QACT,IACA;~~YAAE0B~~,aAAa;QAAM;~~QAEvBzB~~;~~QACAc~~;~~QACAP~~;~~QACAZ~~;QACAC;QACAC;IACF;AACF"}
1	+ {"version":3,"sources":["../src/components/SwatchPicker/useSwatchPicker.ts"],"sourcesContent":["import * as React from 'react';\n\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\n\nimport type { SwatchPickerProps, SwatchPickerState } from './SwatchPicker.types';\n\n/*\n Create the state required to render SwatchPicker.\n \n The returned state can be modified with hooks such as useSwatchPickerStyles_unstable,\n * before being passed to renderSwatchPicker_unstable.\n \n @param props - props from this instance of SwatchPicker\n * @param ref - reference to root HTMLElement of SwatchPicker\n */\nexport const useSwatchPicker_unstable = (\n props: SwatchPickerProps,\n ref: React.Ref<HTMLDivElement>,\n): SwatchPickerState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props);\n\n const { layout, onSelectionChange, size = 'medium', shape, spacing = 'medium', style, ...rest } = props;\n\n const isGrid = layout === 'grid';\n const focusAttributes = useArrowNavigationGroup({\n circular: true,\n axis: isGrid ? 'grid-linear' : 'both',\n memorizeCurrent: true,\n });\n\n const role = isGrid ? 'grid' : 'radiogroup';\n\n const [selectedValue, setSelectedValue] = useControllableState({\n state: props.selectedValue,\n defaultState: props.defaultSelectedValue,\n initialState: '',\n });\n\n const requestSelectionChange: SwatchPickerState['requestSelectionChange'] = useEventCallback((event, data) => {\n onSelectionChange?.(event, {\n type: 'click',\n event,\n selectedValue: data.selectedValue,\n selectedSwatch: data.selectedSwatch,\n });\n setSelectedValue(data.selectedValue);\n });\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role,\n ...focusAttributes,\n ...rest,\n }),\n { elementType: 'div' },\n ),\n isGrid,\n requestSelectionChange,\n selectedValue,\n size,\n shape,\n spacing,\n };\n};\n"],"names":["React","useFieldControlProps_unstable","useArrowNavigationGroup","getIntrinsicElementProps","useControllableState","useEventCallback","slot","useSwatchPicker_unstable","props","ref","layout","onSelectionChange","size","shape","spacing","style","rest","isGrid","focusAttributes","circular","axis","memorizeCurrent","role","selectedValue","setSelectedValue","state","defaultState","defaultSelectedValue","initialState","requestSelectionChange","event","data","type","selectedSwatch","components","root","always","elementType"],"mappings":";;;;+BAiBaO;;;;;;;iEAjBU,QAAQ;4BAEe,wBAAwB;8BAC9B,0BAA0B;gCACqB,4BAA4B;AAa5G,iCAAiC,CACtCC,OACAC;IAEA,+CAA+C;IAC/CD,YAAQP,yCAAAA,EAA8BO;IAEtC,MAAM,EAAEE,MAAM,EAAEC,iBAAiB,EAAEC,OAAO,QAAQ,EAAEC,KAAK,EAAEC,UAAU,QAAQ,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGR;IAElG,MAAMS,SAASP,WAAW;IAC1B,MAAMQ,kBAAkBhB,yCAAAA,EAAwB;QAC9CiB,UAAU;QACVC,MAAMH,SAAS,gBAAgB;QAC/BI,iBAAiB;IACnB;IAEA,MAAMC,OAAOL,SAAS,SAAS;IAE/B,MAAM,CAACM,eAAeC,iBAAiB,OAAGpB,oCAAAA,EAAqB;QAC7DqB,OAAOjB,MAAMe,aAAa;QAC1BG,cAAclB,MAAMmB,oBAAoB;QACxCC,cAAc;IAChB;IAEA,MAAMC,6BAAsExB,gCAAAA,EAAiB,CAACyB,OAAOC;QACnGpB,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,kBAAoBmB,OAAO;YACzBE,MAAM;YACNF;YACAP,eAAeQ,KAAKR,aAAa;YACjCU,gBAAgBF,KAAKE,cAAc;QACrC;QACAT,iBAAiBO,KAAKR,aAAa;IACrC;IAEA,OAAO;QACLW,YAAY;YACVC,MAAM;QACR;QACAA,MAAM7B,oBAAAA,CAAK8B,MAAM,KACfjC,wCAAAA,EAAyB,OAAO;YAC9BM;YACAa;YACA,GAAGJ,eAAe;YAClB,GAAGF,IAAI;QACT,IACA;YAAEqB,aAAa;QAAM;QAEvBpB;QACAY;QACAN;QACAX;QACAC;QACAC;IACF;AACF,EAAE"}

package/lib-commonjs/components/SwatchPicker/useSwatchPickerStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useSwatchPickerStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const swatchPickerClassNames = {\n root: 'fui-SwatchPicker'\n};\n/*\n Styles for the root slot\n / const useStyles = makeStyles({\n root: {\n padding: `${tokens.spacingHorizontalNone} ${tokens.spacingVerticalNone}`,\n display: 'flex'\n },\n row: {\n flexDirection: 'row'\n },\n grid: {\n flexDirection: 'column'\n },\n spacingSmall: {\n gap: '2px'\n },\n spacingMedium: {\n gap: '4px'\n }\n});\n/\n Apply styling to the SwatchPicker slots based on the state\n */ export const useSwatchPickerStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const layoutStyle = state.isGrid ? styles.grid : styles.row;\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n state.root.className = mergeClasses(swatchPickerClassNames.root, styles.root, layoutStyle, spacingStyle, state.root.className);\n return state;\n};\n"],"names":["~~swatchPickerClassNames~~","~~useSwatchPickerStyles_unstable~~","~~root~~","~~useStyles~~","~~__styles~~","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mc9l5x","row","Beiy3e4","grid","spacingSmall","i8kkvl","Belr9w4","rmohyg","spacingMedium","d","p","state","styles","layoutStyle","isGrid","spacingStyle","spacing","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAEaA~~,sBAAsB;~~eAAtBA;;IAyBIC,8BAA8B;eAA9BA~~;;;uBA3BwB;~~AAElC~~,~~MAAMD~~,~~yBAAyB~~;~~IAClCE~~,~~MAAM~~;~~AACV;AACA~~;;CAEA,GAAI,MAAMC,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAF~~,~~MAAA~~;~~QAAAG~~,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;IAAAC,~~KAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAC,~~MAAA~~;QAAAD,~~SAAA~~;IAAA;IAAAE,~~cAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;IAAAC,~~eAAA~~;QAAAH,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;AAAA,GAAA;IAAAE,~~GAAA~~;QAAA;YAAA;YAAA;gBAAAC,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~,CAAA;YAAA;SAAA;KAAA;AAAA;~~AAoBX~~,~~MAAMnB~~,~~iCAAkCoB~~,~~CAAAA~~;~~IAC/C~~;~~IACA~~,MAAMC,~~SAASnB~~;~~IACf~~,MAAMoB,~~cAAcF~~,~~MAAMG~~,MAAM,GAAGF,~~OAAOT~~,IAAI,~~GAAGS~~,~~OAAOX~~,GAAG;IAC3D,~~MAAMc~~,~~eAAeJ~~,~~MAAMK~~,OAAO,KAAK,~~UAAUJ~~,~~OAAOR~~,YAAY,~~GAAGQ~~,~~OAAOJ~~,aAAa;~~IAC3FG~~,~~MAAMnB~~,IAAI,CAACyB,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAAC5B~~,~~uBAAuBE~~,IAAI,EAAEoB,~~OAAOpB~~,IAAI,EAAEqB,~~aAAaE~~,~~cAAcJ~~,~~MAAMnB~~,IAAI,CAACyB,SAAS;~~IAC7H~~,OAAON;~~AACX~~"}
1	+ {"version":3,"sources":["useSwatchPickerStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const swatchPickerClassNames = {\n root: 'fui-SwatchPicker'\n};\n/*\n Styles for the root slot\n / const useStyles = makeStyles({\n root: {\n padding: `${tokens.spacingHorizontalNone} ${tokens.spacingVerticalNone}`,\n display: 'flex'\n },\n row: {\n flexDirection: 'row'\n },\n grid: {\n flexDirection: 'column'\n },\n spacingSmall: {\n gap: '2px'\n },\n spacingMedium: {\n gap: '4px'\n }\n});\n/\n Apply styling to the SwatchPicker slots based on the state\n */ export const useSwatchPickerStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const layoutStyle = state.isGrid ? styles.grid : styles.row;\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n state.root.className = mergeClasses(swatchPickerClassNames.root, styles.root, layoutStyle, spacingStyle, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","swatchPickerClassNames","root","useStyles","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mc9l5x","row","Beiy3e4","grid","spacingSmall","i8kkvl","Belr9w4","rmohyg","spacingMedium","d","p","useSwatchPickerStyles_unstable","state","styles","layoutStyle","isGrid","spacingStyle","spacing","className"],"mappings":";;;;;;;;;;;IAEaG,sBAAsB;;;kCAyBY;eAA9BmB;;;uBA3BwB,gBAAgB;AAElD,+BAA+B;IAClClB,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,GAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,IAAA,EAAA;QAAAD,OAAA,EAAA;IAAA;IAAAE,YAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,aAAA,EAAA;QAAAH,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAiBrB,CAAC;AAGS,wCAAwCE,KAAK,IAAG;IACvD,aAAa;IACb,MAAMC,MAAM,GAAGnB,SAAS,CAAC,CAAC;IAC1B,MAAMoB,WAAW,GAAGF,KAAK,CAACG,MAAM,GAAGF,MAAM,CAACV,IAAI,GAAGU,MAAM,CAACZ,GAAG;IAC3D,MAAMe,YAAY,GAAGJ,KAAK,CAACK,OAAO,KAAK,OAAO,GAAGJ,MAAM,CAACT,YAAY,GAAGS,MAAM,CAACL,aAAa;IAC3FI,KAAK,CAACnB,IAAI,CAACyB,SAAS,OAAG5B,mBAAY,EAACE,sBAAsB,CAACC,IAAI,EAAEoB,MAAM,CAACpB,IAAI,EAAEqB,WAAW,EAAEE,YAAY,EAAEJ,KAAK,CAACnB,IAAI,CAACyB,SAAS,CAAC;IAC9H,OAAON,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/SwatchPicker/useSwatchPickerStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPicker/useSwatchPickerStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SwatchPickerSlots, SwatchPickerState } from './SwatchPicker.types';\nimport { tokens } from '@fluentui/react-theme';\nexport const swatchPickerClassNames: SlotClassNames<SwatchPickerSlots> = {\n root: 'fui-SwatchPicker',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n padding: `${tokens.spacingHorizontalNone} ${tokens.spacingVerticalNone}`,\n display: 'flex',\n },\n row: {\n flexDirection: 'row',\n },\n grid: {\n flexDirection: 'column',\n },\n spacingSmall: { gap: '2px' },\n spacingMedium: { gap: '4px' },\n});\n\n/\n Apply styling to the SwatchPicker slots based on the state\n */\nexport const useSwatchPickerStyles_unstable = (state: SwatchPickerState): SwatchPickerState => {\n 'use no memo';\n\n const styles = useStyles();\n const layoutStyle = state.isGrid ? styles.grid : styles.row;\n\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n state.root.className = mergeClasses(\n swatchPickerClassNames.root,\n styles.root,\n layoutStyle,\n spacingStyle,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["~~swatchPickerClassNames~~","~~useSwatchPickerStyles_unstable~~","~~root~~","~~useStyles~~","~~makeStyles~~","~~padding~~","~~tokens~~","spacingHorizontalNone","spacingVerticalNone","display","row","flexDirection","grid","spacingSmall","gap","spacingMedium","state","styles","layoutStyle","isGrid","spacingStyle","spacing","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAIaA~~,sBAAAA~~;eAAAA;;IAyBAC,8BAAAA;eAAAA~~;;;uBA7B4B;~~4BAGlB;AAChB~~,~~MAAMD,yBAA4D~~;~~IACvEE~~,MAAM;AACR;~~AAEA~~;;CAEC,GACD,MAAMC,~~YAAYC~~,~~IAAAA,~~iBAAAA,EAAW;~~IAC3BF~~,MAAM;~~QACJG~~,SAAS,~~CAAC~~,~~EAAEC,~~kBAAAA,~~CAAOC~~,qBAAqB,CAAC,CAAC,~~EAAED~~,kBAAAA,~~CAAOE~~,mBAAmB,~~CAAC,CAAC~~;QACxEC,SAAS;IACX;IACAC,KAAK;QACHC,eAAe;IACjB;IACAC,MAAM;QACJD,eAAe;IACjB;IACAE,cAAc;QAAEC,KAAK;IAAM;IAC3BC,eAAe;QAAED,KAAK;IAAM;AAC9B;AAKO,~~MAAMb~~,iCAAiC,~~CAACe~~;IAC7C;IAEA,MAAMC,~~SAASd~~;IACf,~~MAAMe~~,cAAcF,MAAMG,MAAM,GAAGF,~~OAAOL~~,IAAI,~~GAAGK~~,~~OAAOP~~,GAAG;IAE3D,~~MAAMU~~,eAAeJ,MAAMK,OAAO,KAAK,UAAUJ,~~OAAOJ~~,YAAY,~~GAAGI~~,~~OAAOF~~,aAAa;~~IAC3FC~~,~~MAAMd~~,IAAI,~~CAACoB~~,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAAA,~~EACrBvB~~,~~uBAAuBE~~,IAAI,~~EAC3Be~~,~~OAAOf~~,IAAI,~~EACXgB~~,aACAE,cACAJ,~~MAAMd~~,IAAI,~~CAACoB~~,SAAS;IAGtB,OAAON;AACT"}
1	+ {"version":3,"sources":["../src/components/SwatchPicker/useSwatchPickerStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SwatchPickerSlots, SwatchPickerState } from './SwatchPicker.types';\nimport { tokens } from '@fluentui/react-theme';\nexport const swatchPickerClassNames: SlotClassNames<SwatchPickerSlots> = {\n root: 'fui-SwatchPicker',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n padding: `${tokens.spacingHorizontalNone} ${tokens.spacingVerticalNone}`,\n display: 'flex',\n },\n row: {\n flexDirection: 'row',\n },\n grid: {\n flexDirection: 'column',\n },\n spacingSmall: { gap: '2px' },\n spacingMedium: { gap: '4px' },\n});\n\n/\n Apply styling to the SwatchPicker slots based on the state\n */\nexport const useSwatchPickerStyles_unstable = (state: SwatchPickerState): SwatchPickerState => {\n 'use no memo';\n\n const styles = useStyles();\n const layoutStyle = state.isGrid ? styles.grid : styles.row;\n\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n state.root.className = mergeClasses(\n swatchPickerClassNames.root,\n styles.root,\n layoutStyle,\n spacingStyle,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","swatchPickerClassNames","root","useStyles","padding","spacingHorizontalNone","spacingVerticalNone","display","row","flexDirection","grid","spacingSmall","gap","spacingMedium","useSwatchPickerStyles_unstable","state","styles","layoutStyle","isGrid","spacingStyle","spacing","className"],"mappings":";;;;;;;;;;;IAIaG,sBAAAA;;;kCAyBAa;;;;uBA7B4B,iBAAiB;4BAGnC,wBAAwB;AACxC,+BAAkE;IACvEZ,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYL,iBAAAA,EAAW;IAC3BI,MAAM;QACJE,SAAS,GAAGJ,kBAAAA,CAAOK,qBAAqB,CAAC,CAAC,EAAEL,kBAAAA,CAAOM,mBAAmB,EAAE;QACxEC,SAAS;IACX;IACAC,KAAK;QACHC,eAAe;IACjB;IACAC,MAAM;QACJD,eAAe;IACjB;IACAE,cAAc;QAAEC,KAAK;IAAM;IAC3BC,eAAe;QAAED,KAAK;IAAM;AAC9B;AAKO,MAAME,iCAAiC,CAACC;IAC7C;IAEA,MAAMC,SAASb;IACf,MAAMc,cAAcF,MAAMG,MAAM,GAAGF,OAAON,IAAI,GAAGM,OAAOR,GAAG;IAE3D,MAAMW,eAAeJ,MAAMK,OAAO,KAAK,UAAUJ,OAAOL,YAAY,GAAGK,OAAOH,aAAa;IAC3FE,MAAMb,IAAI,CAACmB,SAAS,OAAGtB,mBAAAA,EACrBE,uBAAuBC,IAAI,EAC3Bc,OAAOd,IAAI,EACXe,aACAE,cACAJ,MAAMb,IAAI,CAACmB,SAAS;IAGtB,OAAON;AACT,EAAE"}

package/lib-commonjs/components/SwatchPickerRow/SwatchPickerRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPickerRow/SwatchPickerRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSwatchPickerRow_unstable } from './useSwatchPickerRow';\nimport { renderSwatchPickerRow_unstable } from './renderSwatchPickerRow';\nimport { useSwatchPickerRowStyles_unstable } from './useSwatchPickerRowStyles.styles';\nimport type { SwatchPickerRowProps } from './SwatchPickerRow.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n SwatchPickerRow component is used to render a row of swatches.\n */\nexport const SwatchPickerRow: ForwardRefComponent<SwatchPickerRowProps> = React.forwardRef((props, ref) => {\n const state = useSwatchPickerRow_unstable(props, ref);\n\n useSwatchPickerRowStyles_unstable(state);\n useCustomStyleHook_unstable('useSwatchPickerRowStyles_unstable')(state);\n return renderSwatchPickerRow_unstable(state);\n});\n\nSwatchPickerRow.displayName = 'SwatchPickerRow';\n"],"names":["~~SwatchPickerRow~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useSwatchPickerRow_unstable~~","~~useSwatchPickerRowStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderSwatchPickerRow_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAWaA;;;eAAAA;;;;~~iEAXU;~~oCAEqB~~;~~uCACG~~;~~gDACG~~;~~qCAEN~~;~~AAKrC~~,~~MAAMA~~,~~kBAAAA,~~WAAAA,~~GAA6DC~~,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,~~QAAQC~~,~~IAAAA,+CAAAA~~,~~EAA4BH~~,OAAOC;~~IAEjDG~~,~~IAAAA,~~iEAAAA,~~EAAkCF~~;~~IAClCG~~,~~IAAAA,~~gDAAAA,EAA4B,~~qCAAqCH~~;IACjE,~~OAAOI~~,~~IAAAA,~~qDAAAA,EAA+BJ;AACxC;~~AAEAL~~,~~gBAAgBU~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/SwatchPickerRow/SwatchPickerRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSwatchPickerRow_unstable } from './useSwatchPickerRow';\nimport { renderSwatchPickerRow_unstable } from './renderSwatchPickerRow';\nimport { useSwatchPickerRowStyles_unstable } from './useSwatchPickerRowStyles.styles';\nimport type { SwatchPickerRowProps } from './SwatchPickerRow.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n SwatchPickerRow component is used to render a row of swatches.\n */\nexport const SwatchPickerRow: ForwardRefComponent<SwatchPickerRowProps> = React.forwardRef((props, ref) => {\n const state = useSwatchPickerRow_unstable(props, ref);\n\n useSwatchPickerRowStyles_unstable(state);\n useCustomStyleHook_unstable('useSwatchPickerRowStyles_unstable')(state);\n return renderSwatchPickerRow_unstable(state);\n});\n\nSwatchPickerRow.displayName = 'SwatchPickerRow';\n"],"names":["React","useSwatchPickerRow_unstable","renderSwatchPickerRow_unstable","useSwatchPickerRowStyles_unstable","useCustomStyleHook_unstable","SwatchPickerRow","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAWaK;;;;;;;iEAXU,QAAQ;oCAEa,uBAAuB;uCACpB,0BAA0B;gDACvB,oCAAoC;qCAE1C,kCAAkC;AAKvE,wBAAMA,WAAAA,GAA6DL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQR,mDAAAA,EAA4BM,OAAOC;QAEjDL,iEAAAA,EAAkCM;QAClCL,gDAAAA,EAA4B,qCAAqCK;IACjE,WAAOP,qDAAAA,EAA+BO;AACxC,GAAG;AAEHJ,gBAAgBK,WAAW,GAAG"}

package/lib-commonjs/components/SwatchPickerRow/SwatchPickerRow.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPickerRow/SwatchPickerRow.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerProps } from '../SwatchPicker/SwatchPicker.types';\n\nexport type SwatchPickerRowSlots = {\n root: Slot<'div'>;\n};\n\n/*\n SwatchPickerRow Props\n /\nexport type SwatchPickerRowProps = ComponentProps<SwatchPickerRowSlots>;\n\n/\n State used in rendering SwatchPickerRow\n */\nexport type SwatchPickerRowState = ComponentState<SwatchPickerRowSlots> & Pick<SwatchPickerProps, 'spacing'>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AAYA;;CAEC"}
1	+ {"version":3,"sources":["../src/components/SwatchPickerRow/SwatchPickerRow.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerProps } from '../SwatchPicker/SwatchPicker.types';\n\nexport type SwatchPickerRowSlots = {\n root: Slot<'div'>;\n};\n\n/*\n SwatchPickerRow Props\n /\nexport type SwatchPickerRowProps = ComponentProps<SwatchPickerRowSlots>;\n\n/\n State used in rendering SwatchPickerRow\n */\nexport type SwatchPickerRowState = ComponentState<SwatchPickerRowSlots> & Pick<SwatchPickerProps, 'spacing'>;\n"],"names":[],"mappings":"AAYA;;CAEC,GACD,WAA6G"}

package/lib-commonjs/components/SwatchPickerRow/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPickerRow/index.ts"],"sourcesContent":["export { SwatchPickerRow } from './SwatchPickerRow';\nexport type { SwatchPickerRowProps, SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow.types';\nexport { renderSwatchPickerRow_unstable } from './renderSwatchPickerRow';\nexport { useSwatchPickerRow_unstable } from './useSwatchPickerRow';\nexport { swatchPickerRowClassNames, useSwatchPickerRowStyles_unstable } from './useSwatchPickerRowStyles.styles';\n"],"names":["SwatchPickerRow","renderSwatchPickerRow_unstable","~~swatchPickerRowClassNames~~","~~useSwatchPickerRowStyles_unstable~~","~~useSwatchPickerRow_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~eAAe;eAAfA,~~gCAAe~~;;IAEfC~~,~~8BAA8B;eAA9BA,~~qDAA8B~~;;IAE9BC~~,~~yBAAyB;eAAzBA,~~yDAAyB~~;;IAAEC~~,~~iCAAiC;eAAjCA,~~iEAAiC~~;;IAD5DC,2BAA2B;eAA3BA~~,+CAA2B;;;iCAHJ;~~uCAEe~~;~~oCACH~~;~~gDACiC~~"}
1	+ {"version":3,"sources":["../src/components/SwatchPickerRow/index.ts"],"sourcesContent":["export { SwatchPickerRow } from './SwatchPickerRow';\nexport type { SwatchPickerRowProps, SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow.types';\nexport { renderSwatchPickerRow_unstable } from './renderSwatchPickerRow';\nexport { useSwatchPickerRow_unstable } from './useSwatchPickerRow';\nexport { swatchPickerRowClassNames, useSwatchPickerRowStyles_unstable } from './useSwatchPickerRowStyles.styles';\n"],"names":["SwatchPickerRow","renderSwatchPickerRow_unstable","useSwatchPickerRow_unstable","swatchPickerRowClassNames","useSwatchPickerRowStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,gCAAe;;;eAEfC,qDAA8B;;;eAE9BE,yDAAyB;;;eAAEC,iEAAiC;;;eAD5DF,+CAA2B;;;iCAHJ,oBAAoB;uCAEL,0BAA0B;oCAC7B,uBAAuB;gDACU,oCAAoC"}

package/lib-commonjs/components/SwatchPickerRow/renderSwatchPickerRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPickerRow/renderSwatchPickerRow.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowState, SwatchPickerRowSlots } from './SwatchPickerRow.types';\n\n/\n Render the final JSX of SwatchPickerRow\n */\nexport const renderSwatchPickerRow_unstable = (state: SwatchPickerRowState) => {\n assertSlots<SwatchPickerRowSlots>(state);\n return <state.root />;\n};\n"],"names":["~~renderSwatchPickerRow_unstable~~","~~state~~","~~assertSlots~~","~~_jsx","~~root"],"~~rangeMappings~~":"~~;;;;;;;;;;;;;;;"~~,~~"mappings":";;;;+BASaA;;;eAAAA;;;4BARb~~;~~gCAE4B~~;~~AAMrB~~,~~MAAMA~~,iCAAiC,CAACC;~~IAC7CC~~,~~IAAAA,~~2BAAAA,~~EAAkCD~~;IAClC,OAAA,WAAA,~~GAAOE~~,~~IAAAA,~~eAAA,~~EAACF~~,~~MAAMG~~,IAAI,EAAA,CAAA;AACpB"}
1	+ {"version":3,"sources":["../src/components/SwatchPickerRow/renderSwatchPickerRow.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowState, SwatchPickerRowSlots } from './SwatchPickerRow.types';\n\n/\n Render the final JSX of SwatchPickerRow\n */\nexport const renderSwatchPickerRow_unstable = (state: SwatchPickerRowState) => {\n assertSlots<SwatchPickerRowSlots>(state);\n return <state.root />;\n};\n"],"names":["assertSlots","renderSwatchPickerRow_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAMjD,MAAMC,iCAAiC,CAACC;QAC7CF,2BAAAA,EAAkCE;IAClC,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

package/lib-commonjs/components/SwatchPickerRow/useSwatchPickerRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPickerRow/useSwatchPickerRow.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowProps, SwatchPickerRowState } from './SwatchPickerRow.types';\nimport { useSwatchPickerContextValue_unstable } from '../../contexts/swatchPicker';\n\n/*\n Create the state required to render SwatchPickerRow.\n \n The returned state can be modified with hooks such as useSwatchPickerRowStyles_unstable,\n * before being passed to renderSwatchPickerRow_unstable.\n \n @param props - props from this instance of SwatchPickerRow\n * @param ref - reference to root HTMLDivElement of SwatchPickerRow\n */\nexport const useSwatchPickerRow_unstable = (\n props: SwatchPickerRowProps,\n ref: React.Ref<HTMLDivElement>,\n): SwatchPickerRowState => {\n const { style, ...rest } = props;\n const spacing = useSwatchPickerContextValue_unstable(ctx => ctx.spacing);\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'row',\n ...rest,\n }),\n { elementType: 'div' },\n ),\n spacing,\n };\n};\n"],"names":["useSwatchPickerRow_unstable","props","ref","style","rest","spacing","~~useSwatchPickerContextValue_unstable","~~ctx","components","root","~~slot","~~always","~~getIntrinsicElementProps","~~role","elementType"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAcaA;;;eAAAA;;;;~~iEAdU;~~gCACwB~~;~~8BAEM~~;~~AAW9C~~,~~MAAMA~~,~~8BAA8B,~~CACzCC,OACAC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGH;IAC3B,MAAMI,~~UAAUC~~,~~IAAAA,~~kDAAAA,~~EAAqCC~~,CAAAA,MAAOA,~~IAAIF~~,OAAO;IAEvE,OAAO;~~QACLG~~,YAAY;YACVC,MAAM;QACR;QACAA,~~MAAMC~~,oBAAAA,~~CAAKC~~,MAAM,~~CACfC~~,~~IAAAA,~~wCAAAA,EAAyB,OAAO;~~YAC9BV~~;~~YACAW~~,MAAM;YACN,~~GAAGT~~,IAAI;QACT,IACA;~~YAAEU~~,aAAa;QAAM;~~QAEvBT~~;IACF;AACF"}
1	+ {"version":3,"sources":["../src/components/SwatchPickerRow/useSwatchPickerRow.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowProps, SwatchPickerRowState } from './SwatchPickerRow.types';\nimport { useSwatchPickerContextValue_unstable } from '../../contexts/swatchPicker';\n\n/*\n Create the state required to render SwatchPickerRow.\n \n The returned state can be modified with hooks such as useSwatchPickerRowStyles_unstable,\n * before being passed to renderSwatchPickerRow_unstable.\n \n @param props - props from this instance of SwatchPickerRow\n * @param ref - reference to root HTMLDivElement of SwatchPickerRow\n */\nexport const useSwatchPickerRow_unstable = (\n props: SwatchPickerRowProps,\n ref: React.Ref<HTMLDivElement>,\n): SwatchPickerRowState => {\n const { style, ...rest } = props;\n const spacing = useSwatchPickerContextValue_unstable(ctx => ctx.spacing);\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'row',\n ...rest,\n }),\n { elementType: 'div' },\n ),\n spacing,\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSwatchPickerContextValue_unstable","useSwatchPickerRow_unstable","props","ref","style","rest","spacing","ctx","components","root","always","role","elementType"],"mappings":";;;;+BAcaI;;;;;;;iEAdU,QAAQ;gCACgB,4BAA4B;8BAEtB,8BAA8B;AAW5E,oCAAoC,CACzCC,OACAC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGH;IAC3B,MAAMI,cAAUN,kDAAAA,EAAqCO,CAAAA,MAAOA,IAAID,OAAO;IAEvE,OAAO;QACLE,YAAY;YACVC,MAAM;QACR;QACAA,MAAMV,oBAAAA,CAAKW,MAAM,KACfZ,wCAAAA,EAAyB,OAAO;YAC9BK;YACAQ,MAAM;YACN,GAAGN,IAAI;QACT,IACA;YAAEO,aAAa;QAAM;QAEvBN;IACF;AACF,EAAE"}

package/lib-commonjs/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useSwatchPickerRowStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses, makeStyles } from '@griffel/react';\nexport const swatchPickerRowClassNames = {\n root: 'fui-SwatchPickerRow'\n};\n/*\n Styles for the root slot\n / const useResetStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'row'\n});\nconst useStyles = makeStyles({\n spacingSmall: {\n columnGap: '2px'\n },\n spacingMedium: {\n columnGap: '4px'\n }\n});\n/\n Apply styling to the SwatchPickerRow slots based on the state\n */ export const useSwatchPickerRowStyles_unstable = (state)=>{\n 'use no memo';\n const resetStyles = useResetStyles();\n const styles = useStyles();\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className);\n return state;\n};\n"],"names":["~~swatchPickerRowClassNames~~","~~useSwatchPickerRowStyles_unstable~~","~~root~~","~~useResetStyles~~","~~__resetStyles~~","~~useStyles~~","~~__styles~~","spacingSmall","i8kkvl","spacingMedium","d","state","resetStyles","styles","spacingStyle","spacing","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IACaA~~,yBAAyB;~~eAAzBA;;IAmBIC,iCAAiC;eAAjCA~~;;;uBApByC;~~AACnD~~,~~MAAMD,4BAA4B~~;~~IACrCE~~,~~MAAM~~;AACV;~~AACA~~;;CAEA,GAAI,MAAMC,~~iBAAc~~,WAAA,~~GAAGC~~,~~IAAAA,~~oBAAA,EAAA,YAAA,MAAA;IAAA;CAG1B;~~AACD~~,~~MAAMC~~,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAC~~,~~cAAA~~;QAAAC,~~QAAA~~;IAAA;IAAAC,~~eAAA~~;QAAAD,~~QAAA~~;IAAA;AAAA,GAAA;IAAAE,~~GAAA~~;QAAA;QAAA;KAAA;AAAA;~~AAUP~~,~~MAAMT~~,~~oCAAqCU~~,~~CAAAA~~;~~IAClD~~;~~IACA~~,MAAMC,~~cAAcT~~;~~IACpB~~,~~MAAMU~~,~~SAASR~~;~~IACf~~,MAAMS,~~eAAeH~~,~~MAAMI~~,OAAO,KAAK,~~UAAUF~~,~~OAAON~~,YAAY,~~GAAGM~~,~~OAAOJ~~,aAAa;~~IAC3FE~~,~~MAAMT~~,IAAI,~~CAACc~~,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAACjB~~,~~0BAA0BE~~,IAAI,~~EAAEU~~,~~aAAaE~~,~~cAAcH~~,~~MAAMT~~,IAAI,~~CAACc~~,SAAS;~~IACnH~~,OAAOL;~~AACX~~"}
1	+ {"version":3,"sources":["useSwatchPickerRowStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses, makeStyles } from '@griffel/react';\nexport const swatchPickerRowClassNames = {\n root: 'fui-SwatchPickerRow'\n};\n/*\n Styles for the root slot\n / const useResetStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'row'\n});\nconst useStyles = makeStyles({\n spacingSmall: {\n columnGap: '2px'\n },\n spacingMedium: {\n columnGap: '4px'\n }\n});\n/\n Apply styling to the SwatchPickerRow slots based on the state\n */ export const useSwatchPickerRowStyles_unstable = (state)=>{\n 'use no memo';\n const resetStyles = useResetStyles();\n const styles = useStyles();\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","__styles","swatchPickerRowClassNames","root","useResetStyles","useStyles","spacingSmall","i8kkvl","spacingMedium","d","useSwatchPickerRowStyles_unstable","state","resetStyles","styles","spacingStyle","spacing","className"],"mappings":";;;;;;;;;;;IACaG,yBAAyB;;;qCAmBY;eAAjCQ;;;uBApByC,gBAAgB;AACnE,kCAAkC;IACrCP,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,cAAc,GAAA,WAAA,OAAGL,oBAAA,EAAA,YAAA,MAAA;IAAA;CAG1B,CAAC;AACF,MAAMM,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAK,YAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,aAAA,EAAA;QAAAD,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAOjB,CAAC;AAGS,2CAA2CE,KAAK,IAAG;IAC1D,aAAa;IACb,MAAMC,WAAW,GAAGR,cAAc,CAAC,CAAC;IACpC,MAAMS,MAAM,GAAGR,SAAS,CAAC,CAAC;IAC1B,MAAMS,YAAY,GAAGH,KAAK,CAACI,OAAO,KAAK,OAAO,GAAGF,MAAM,CAACP,YAAY,GAAGO,MAAM,CAACL,aAAa;IAC3FG,KAAK,CAACR,IAAI,CAACa,SAAS,OAAGhB,mBAAY,EAACE,yBAAyB,CAACC,IAAI,EAAES,WAAW,EAAEE,YAAY,EAAEH,KAAK,CAACR,IAAI,CAACa,SAAS,CAAC;IACpH,OAAOL,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, makeStyles } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow.types';\n\nexport const swatchPickerRowClassNames: SlotClassNames<SwatchPickerRowSlots> = {\n root: 'fui-SwatchPickerRow',\n};\n\n/*\n Styles for the root slot\n /\nconst useResetStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'row',\n});\n\nconst useStyles = makeStyles({\n spacingSmall: {\n columnGap: '2px',\n },\n spacingMedium: {\n columnGap: '4px',\n },\n});\n\n/\n Apply styling to the SwatchPickerRow slots based on the state\n */\nexport const useSwatchPickerRowStyles_unstable = (state: SwatchPickerRowState): SwatchPickerRowState => {\n 'use no memo';\n\n const resetStyles = useResetStyles();\n const styles = useStyles();\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n\n state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className);\n\n return state;\n};\n"],"names":["~~swatchPickerRowClassNames~~","~~useSwatchPickerRowStyles_unstable~~","~~root~~","~~useResetStyles~~","~~makeResetStyles~~","display","flexDirection","useStyles","~~makeStyles","~~spacingSmall","columnGap","spacingMedium","state","resetStyles","styles","spacingStyle","spacing","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAIaA~~,yBAAAA~~;eAAAA;;IAwBAC~~,iCAAAA~~;eAAAA;;;~~uBA5B6C;~~AAInD~~,~~MAAMD,4BAAkE~~;~~IAC7EE~~,MAAM;AACR;~~AAEA~~;;CAEC,GACD,MAAMC,~~iBAAiBC~~,~~IAAAA,~~sBAAAA,EAAgB;~~IACrCC~~,SAAS;IACTC,eAAe;AACjB;AAEA,MAAMC,~~YAAYC~~,~~IAAAA,~~iBAAAA,EAAW;~~IAC3BC~~,cAAc;QACZC,WAAW;IACb;IACAC,eAAe;QACbD,WAAW;IACb;AACF;AAKO,~~MAAMT~~,~~oCAAoC,CAACW~~;IAChD;IAEA,MAAMC,~~cAAcV~~;IACpB,~~MAAMW~~,SAASP;IACf,MAAMQ,eAAeH,MAAMI,OAAO,KAAK,UAAUF,~~OAAOL~~,YAAY,~~GAAGK~~,~~OAAOH~~,aAAa;~~IAE3FC~~,~~MAAMV~~,IAAI,~~CAACe~~,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAAA,~~EAAalB~~,~~0BAA0BE~~,IAAI,~~EAAEW~~,aAAaE,cAAcH,~~MAAMV~~,IAAI,~~CAACe~~,SAAS;IAEnH,OAAOL;AACT"}
1	+ {"version":3,"sources":["../src/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, makeStyles } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow.types';\n\nexport const swatchPickerRowClassNames: SlotClassNames<SwatchPickerRowSlots> = {\n root: 'fui-SwatchPickerRow',\n};\n\n/*\n Styles for the root slot\n /\nconst useResetStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'row',\n});\n\nconst useStyles = makeStyles({\n spacingSmall: {\n columnGap: '2px',\n },\n spacingMedium: {\n columnGap: '4px',\n },\n});\n\n/\n Apply styling to the SwatchPickerRow slots based on the state\n */\nexport const useSwatchPickerRowStyles_unstable = (state: SwatchPickerRowState): SwatchPickerRowState => {\n 'use no memo';\n\n const resetStyles = useResetStyles();\n const styles = useStyles();\n const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n\n state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className);\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","makeStyles","swatchPickerRowClassNames","root","useResetStyles","display","flexDirection","useStyles","spacingSmall","columnGap","spacingMedium","useSwatchPickerRowStyles_unstable","state","resetStyles","styles","spacingStyle","spacing","className"],"mappings":";;;;;;;;;;;IAIaG,yBAAAA;;;IAwBAS,iCAAAA;;;;uBA5B6C,iBAAiB;AAIpE,kCAAwE;IAC7ER,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,qBAAiBL,sBAAAA,EAAgB;IACrCM,SAAS;IACTC,eAAe;AACjB;AAEA,MAAMC,gBAAYN,iBAAAA,EAAW;IAC3BO,cAAc;QACZC,WAAW;IACb;IACAC,eAAe;QACbD,WAAW;IACb;AACF;AAKO,0CAA0C,CAACG;IAChD;IAEA,MAAMC,cAAcT;IACpB,MAAMU,SAASP;IACf,MAAMQ,eAAeH,MAAMI,OAAO,KAAK,UAAUF,OAAON,YAAY,GAAGM,OAAOJ,aAAa;IAE3FE,MAAMT,IAAI,CAACc,SAAS,OAAGjB,mBAAAA,EAAaE,0BAA0BC,IAAI,EAAEU,aAAaE,cAAcH,MAAMT,IAAI,CAACc,SAAS;IAEnH,OAAOL;AACT,EAAE"}

package/lib-commonjs/contexts/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export type { SwatchPickerContextValue, SwatchPickerContextValues } from './swatchPicker';\nexport {\n SwatchPickerProvider,\n swatchPickerContextDefaultValue,\n useSwatchPickerContextValue_unstable,\n useSwatchPickerContextValues,\n} from './swatchPicker';\n"],"names":["SwatchPickerProvider","swatchPickerContextDefaultValue","useSwatchPickerContextValue_unstable","useSwatchPickerContextValues"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAEEA~~,~~oBAAoB;eAApBA,~~kCAAoB~~;;IACpBC,+BAA+B;eAA/BA~~,6CAA+B~~;;IAC~~/BC,~~oCAAoC;eAApCA,~~kDAAoC~~;;IACpCC~~,~~4BAA4B;eAA5BA,~~0CAA4B;;;8BACvB"}
1	+ {"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export type { SwatchPickerContextValue, SwatchPickerContextValues } from './swatchPicker';\nexport {\n SwatchPickerProvider,\n swatchPickerContextDefaultValue,\n useSwatchPickerContextValue_unstable,\n useSwatchPickerContextValues,\n} from './swatchPicker';\n"],"names":["SwatchPickerProvider","swatchPickerContextDefaultValue","useSwatchPickerContextValue_unstable","useSwatchPickerContextValues"],"mappings":";;;;;;;;;;;;eAEEA,kCAAoB;;;eACpBC,6CAA+B;;;eAC/BC,kDAAoC;;;eACpCC,0CAA4B;;;8BACvB,iBAAiB"}

package/lib-commonjs/contexts/swatchPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/contexts/swatchPicker.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { SwatchPickerProps, SwatchPickerState } from '../components/SwatchPicker/SwatchPicker.types';\n\n/*\n The context through which individual color controls communicate with the picker.\n /\nexport type SwatchPickerContextValue = Pick<SwatchPickerProps, 'size' \| 'shape' \| 'spacing' \| 'selectedValue'> & {\n /\n Whether layout is grid.\n /\n isGrid: boolean;\n\n /\n @internal\n * Callback used by ColorSwatch to request a change on it's selected state\n * Should be used to select ColorSwatch\n /\n requestSelectionChange: (\n event: React.MouseEvent<HTMLButtonElement>,\n data: { selectedValue: string; selectedSwatch: string },\n ) => void;\n};\n\nexport const useSwatchPickerContextValues = (state: SwatchPickerState): SwatchPickerContextValues => {\n const { isGrid, size, shape, spacing, requestSelectionChange, selectedValue } = state;\n\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const swatchPicker: SwatchPickerContextValue = {\n isGrid,\n size,\n shape,\n spacing,\n selectedValue,\n requestSelectionChange,\n };\n\n return { swatchPicker };\n};\n\nexport const swatchPickerContextDefaultValue: SwatchPickerContextValue = {\n requestSelectionChange: () => {\n /noop*/\n },\n isGrid: false,\n size: 'medium',\n shape: 'square',\n spacing: 'medium',\n selectedValue: undefined,\n};\n\nexport type SwatchPickerContextValues = {\n swatchPicker: SwatchPickerContextValue;\n};\n\nconst SwatchPickerContext = createContext<SwatchPickerContextValue \| undefined>(\n undefined,\n) as Context<SwatchPickerContextValue>;\n\nexport const SwatchPickerProvider = SwatchPickerContext.Provider;\n\nexport const useSwatchPickerContextValue_unstable = <T>(selector: ContextSelector<SwatchPickerContextValue, T>): T =>\n useContextSelector(SwatchPickerContext, (ctx = swatchPickerContextDefaultValue) => selector(ctx));\n"],"names":["~~SwatchPickerProvider~~","~~swatchPickerContextDefaultValue~~","~~useSwatchPickerContextValue_unstable~~","useSwatchPickerContextValues","state","isGrid","size","shape","spacing","requestSelectionChange","selectedValue","swatchPicker","undefined","SwatchPickerContext","~~createContext~~","Provider","~~selector~~","~~useContextSelector~~","ctx"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IA4DaA,oBAAAA;eAAAA;;IAnBAC~~,+BAAAA~~;eAAAA;;IAqBAC~~,~~oCAAAA~~;~~eAAAA;;IArCAC~~,~~4BAAAA~~;~~eAAAA;;;;iEAzBU;sCAC2B;AAwB3C~~,MAAMA,+BAA+B,CAACC;IAC3C,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,EAAEC,sBAAsB,EAAEC,aAAa,EAAE,GAAGN;IAEhF,mGAAmG;IACnG,MAAMO,eAAyC;QAC7CN;QACAC;QACAC;QACAC;QACAE;QACAD;IACF;IAEA,OAAO;QAAEE;IAAa;AACxB;~~AAEO~~,~~MAAMV,kCAA4D~~;~~IACvEQ~~,wBAAwB;IACtB,MAAM,GACR;IACAJ,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,SAAS;IACTE,~~eAAeE~~;AACjB;~~AAMA~~,MAAMC,~~sBAAsBC~~,~~IAAAA,~~mCAAAA,~~EAC1BF~~;AAGK,~~MAAMZ~~,~~uBAAuBa~~,oBAAoBE,QAAQ;~~AAEzD~~,~~MAAMb~~,uCAAuC,~~CAAIc~~,~~WACtDC~~,~~IAAAA,~~wCAAAA,~~EAAmBJ~~,qBAAqB,CAACK,~~MAAMjB~~,+BAA+B,~~GAAKe~~,~~SAASE~~"}
1	+ {"version":3,"sources":["../src/contexts/swatchPicker.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { SwatchPickerProps, SwatchPickerState } from '../components/SwatchPicker/SwatchPicker.types';\n\n/*\n The context through which individual color controls communicate with the picker.\n /\nexport type SwatchPickerContextValue = Pick<SwatchPickerProps, 'size' \| 'shape' \| 'spacing' \| 'selectedValue'> & {\n /\n Whether layout is grid.\n /\n isGrid: boolean;\n\n /\n @internal\n * Callback used by ColorSwatch to request a change on it's selected state\n * Should be used to select ColorSwatch\n /\n requestSelectionChange: (\n event: React.MouseEvent<HTMLButtonElement>,\n data: { selectedValue: string; selectedSwatch: string },\n ) => void;\n};\n\nexport const useSwatchPickerContextValues = (state: SwatchPickerState): SwatchPickerContextValues => {\n const { isGrid, size, shape, spacing, requestSelectionChange, selectedValue } = state;\n\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const swatchPicker: SwatchPickerContextValue = {\n isGrid,\n size,\n shape,\n spacing,\n selectedValue,\n requestSelectionChange,\n };\n\n return { swatchPicker };\n};\n\nexport const swatchPickerContextDefaultValue: SwatchPickerContextValue = {\n requestSelectionChange: () => {\n /noop*/\n },\n isGrid: false,\n size: 'medium',\n shape: 'square',\n spacing: 'medium',\n selectedValue: undefined,\n};\n\nexport type SwatchPickerContextValues = {\n swatchPicker: SwatchPickerContextValue;\n};\n\nconst SwatchPickerContext = createContext<SwatchPickerContextValue \| undefined>(\n undefined,\n) as Context<SwatchPickerContextValue>;\n\nexport const SwatchPickerProvider = SwatchPickerContext.Provider;\n\nexport const useSwatchPickerContextValue_unstable = <T>(selector: ContextSelector<SwatchPickerContextValue, T>): T =>\n useContextSelector(SwatchPickerContext, (ctx = swatchPickerContextDefaultValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","useSwatchPickerContextValues","state","isGrid","size","shape","spacing","requestSelectionChange","selectedValue","swatchPicker","swatchPickerContextDefaultValue","undefined","SwatchPickerContext","SwatchPickerProvider","Provider","useSwatchPickerContextValue_unstable","selector","ctx"],"mappings":";;;;;;;;;;;wBA4Dae;;;IAnBAH,+BAAAA;;;wCAqBAK;;;gCArCAd;;;;;iEAzBU,QAAQ;sCACmB,mCAAmC;AAwB9E,MAAMA,+BAA+B,CAACC;IAC3C,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,EAAEC,sBAAsB,EAAEC,aAAa,EAAE,GAAGN;IAEhF,mGAAmG;IACnG,MAAMO,eAAyC;QAC7CN;QACAC;QACAC;QACAC;QACAE;QACAD;IACF;IAEA,OAAO;QAAEE;IAAa;AACxB,EAAE;AAEK,wCAAkE;IACvEF,wBAAwB;IACtB,MAAM,GACR;IACAJ,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,SAAS;IACTE,eAAeG;AACjB,EAAE;AAMF,MAAMC,0BAAsBb,mCAAAA,EAC1BY;AAGK,MAAME,uBAAuBD,oBAAoBE,QAAQ,CAAC;AAE1D,MAAMC,uCAAuC,CAAIC,eACtDhB,wCAAAA,EAAmBY,qBAAqB,CAACK,MAAMP,+BAA+B,GAAKM,SAASC,MAAM"}

package/lib-commonjs/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n SwatchPicker,\n renderSwatchPicker_unstable,\n useSwatchPickerStyles_unstable,\n useSwatchPicker_unstable,\n swatchPickerClassNames,\n} from './SwatchPicker';\nexport {\n SwatchPickerProvider,\n swatchPickerContextDefaultValue,\n useSwatchPickerContextValue_unstable,\n useSwatchPickerContextValues,\n} from './contexts';\nexport type { SwatchPickerContextValue, SwatchPickerContextValues } from './contexts';\nexport type {\n SwatchPickerProps,\n SwatchPickerSlots,\n SwatchPickerState,\n SwatchPickerOnSelectionChangeData,\n SwatchPickerOnSelectEventHandler,\n} from './SwatchPicker';\nexport {\n ColorSwatch,\n renderColorSwatch_unstable,\n useColorSwatchStyles_unstable,\n useColorSwatch_unstable,\n colorSwatchClassNames,\n swatchCSSVars,\n} from './ColorSwatch';\nexport type { ColorSwatchProps, ColorSwatchSlots, ColorSwatchState } from './ColorSwatch';\nexport {\n ImageSwatch,\n renderImageSwatch_unstable,\n useImageSwatchStyles_unstable,\n useImageSwatch_unstable,\n imageSwatchClassNames,\n} from './ImageSwatch';\nexport type { ImageSwatchProps, ImageSwatchSlots, ImageSwatchState } from './ImageSwatch';\nexport type { SwatchPickerRowProps, SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow';\nexport {\n SwatchPickerRow,\n renderSwatchPickerRow_unstable,\n useSwatchPickerRowStyles_unstable,\n useSwatchPickerRow_unstable,\n swatchPickerRowClassNames,\n} from './SwatchPickerRow';\nexport { renderSwatchPickerGrid } from './utils/renderUtils';\nexport type { SwatchProps, SwatchPickerGridProps } from './utils/renderUtils';\nexport {\n EmptySwatch,\n renderEmptySwatch_unstable,\n useEmptySwatchStyles_unstable,\n useEmptySwatch_unstable,\n emptySwatchClassNames,\n} from './EmptySwatch';\nexport type { EmptySwatchProps, EmptySwatchSlots, EmptySwatchState } from './EmptySwatch';\n"],"names":["~~ColorSwatch~~","~~EmptySwatch~~","~~ImageSwatch~~","~~SwatchPicker~~","~~SwatchPickerProvider~~","~~SwatchPickerRow~~","~~colorSwatchClassNames~~","~~emptySwatchClassNames~~","~~imageSwatchClassNames~~","~~renderColorSwatch_unstable~~","~~renderEmptySwatch_unstable~~","~~renderImageSwatch_unstable~~","~~renderSwatchPickerGrid~~","~~renderSwatchPickerRow_unstable~~","~~renderSwatchPicker_unstable~~","~~swatchCSSVars~~","~~swatchPickerClassNames~~","~~swatchPickerContextDefaultValue~~","~~swatchPickerRowClassNames~~","~~useColorSwatchStyles_unstable~~","~~useColorSwatch_unstable~~","~~useEmptySwatchStyles_unstable~~","~~useEmptySwatch_unstable~~","~~useImageSwatchStyles_unstable~~","~~useImageSwatch_unstable~~","~~useSwatchPickerContextValue_unstable~~","~~useSwatchPickerContextValues~~","~~useSwatchPickerRowStyles_unstable~~","~~useSwatchPickerRow_unstable~~","~~useSwatchPickerStyles_unstable~~","~~useSwatchPicker_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAsBEA~~,WAAW;~~eAAXA~~,wBAAW~~;;IA2BXC~~,~~WAAW;eAAXA,wBAAW;;IAlBXC,WAAW;eAAXA,wBAAW;;IA9BXC,YAAY;eAAZA,~~0BAAY;;~~IAOZC~~,oBAAoB~~;eAApBA~~,~~8BAAoB;;IAgCpBC,eAAe;eAAfA,~~gCAAe~~;;IAdfC~~,~~qBAAqB;eAArBA,~~kCAAqB;;~~IA2BrBC,qBAAqB~~;~~eAArBA~~,kCAAqB;;~~IAlBrBC~~,~~qBAAqB;eAArBA,kCAAqB;;IAZrBC,~~0BAA0B~~;eAA1BA~~,uCAA0B;;~~IA2B1BC,0BAA0B~~;~~eAA1BA~~,~~uCAA0B;;IAlB1BC,0BAA0B;eAA1BA,uCAA0B;;IAcnBC,sBAAsB;eAAtBA,~~mCAAsB~~;;IAL7BC,8BAA8B;eAA9BA~~,+CAA8B~~;;IAvC9BC~~,~~2BAA2B;eAA3BA,~~yCAA2B~~;;IAyB3BC~~,~~aAAa;eAAbA,~~0BAAa;;~~IAtBbC,sBAAsB~~;~~eAAtBA,oCAAsB~~;;~~IAItBC~~,+BAA+B~~;eAA~~/BA,~~yCAA+B;;IAmC/BC,yBAAyB;eAAzBA,~~0CAAyB;;~~IApBzBC,6BAA6B~~;~~eAA7BA~~,~~0CAA6B;;IAC7BC,uBAAuB;eAAvBA,~~oCAAuB~~;;IA0BvBC~~,~~6BAA6B;eAA7BA,~~0CAA6B;;IAC7BC~~,uBAAuB~~;~~eAAvBA~~,~~oCAAuB;;IAnBvBC,6BAA6B;eAA7BA,~~0CAA6B;;~~IAC7BC,uBAAuB~~;~~eAAvBA~~,~~oCAAuB;;IAxBvBC,oCAAoC;eAApCA,~~8CAAoC;;~~IACpCC,4BAA4B~~;~~eAA5BA,sCAA4B~~;;IA+~~B5BC,iCAAiC~~;~~eAAjCA~~,~~kDAAiC;;IACjCC,2BAA2B;eAA3BA,~~4CAA2B~~;;IAxC3BC~~,~~8BAA8B;eAA9BA,~~4CAA8B~~;;IAC9BC~~,~~wBAAwB;eAAxBA,~~sCAAwB;;;8BAEnB;~~0BAMA~~;~~6BAgBA~~;~~6BAQA~~;~~iCASA~~;~~6BACgC~~;~~6BAQhC~~"}
1	+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n SwatchPicker,\n renderSwatchPicker_unstable,\n useSwatchPickerStyles_unstable,\n useSwatchPicker_unstable,\n swatchPickerClassNames,\n} from './SwatchPicker';\nexport {\n SwatchPickerProvider,\n swatchPickerContextDefaultValue,\n useSwatchPickerContextValue_unstable,\n useSwatchPickerContextValues,\n} from './contexts';\nexport type { SwatchPickerContextValue, SwatchPickerContextValues } from './contexts';\nexport type {\n SwatchPickerProps,\n SwatchPickerSlots,\n SwatchPickerState,\n SwatchPickerOnSelectionChangeData,\n SwatchPickerOnSelectEventHandler,\n} from './SwatchPicker';\nexport {\n ColorSwatch,\n renderColorSwatch_unstable,\n useColorSwatchStyles_unstable,\n useColorSwatch_unstable,\n colorSwatchClassNames,\n swatchCSSVars,\n} from './ColorSwatch';\nexport type { ColorSwatchProps, ColorSwatchSlots, ColorSwatchState } from './ColorSwatch';\nexport {\n ImageSwatch,\n renderImageSwatch_unstable,\n useImageSwatchStyles_unstable,\n useImageSwatch_unstable,\n imageSwatchClassNames,\n} from './ImageSwatch';\nexport type { ImageSwatchProps, ImageSwatchSlots, ImageSwatchState } from './ImageSwatch';\nexport type { SwatchPickerRowProps, SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow';\nexport {\n SwatchPickerRow,\n renderSwatchPickerRow_unstable,\n useSwatchPickerRowStyles_unstable,\n useSwatchPickerRow_unstable,\n swatchPickerRowClassNames,\n} from './SwatchPickerRow';\nexport { renderSwatchPickerGrid } from './utils/renderUtils';\nexport type { SwatchProps, SwatchPickerGridProps } from './utils/renderUtils';\nexport {\n EmptySwatch,\n renderEmptySwatch_unstable,\n useEmptySwatchStyles_unstable,\n useEmptySwatch_unstable,\n emptySwatchClassNames,\n} from './EmptySwatch';\nexport type { EmptySwatchProps, EmptySwatchSlots, EmptySwatchState } from './EmptySwatch';\n"],"names":["SwatchPicker","renderSwatchPicker_unstable","useSwatchPickerStyles_unstable","useSwatchPicker_unstable","swatchPickerClassNames","SwatchPickerProvider","swatchPickerContextDefaultValue","useSwatchPickerContextValue_unstable","useSwatchPickerContextValues","ColorSwatch","renderColorSwatch_unstable","useColorSwatchStyles_unstable","useColorSwatch_unstable","colorSwatchClassNames","swatchCSSVars","ImageSwatch","renderImageSwatch_unstable","useImageSwatchStyles_unstable","useImageSwatch_unstable","imageSwatchClassNames","SwatchPickerRow","renderSwatchPickerRow_unstable","useSwatchPickerRowStyles_unstable","useSwatchPickerRow_unstable","swatchPickerRowClassNames","renderSwatchPickerGrid","EmptySwatch","renderEmptySwatch_unstable","useEmptySwatchStyles_unstable","useEmptySwatch_unstable","emptySwatchClassNames"],"mappings":";;;;;;;;;;;IAsBES,WAAW;;;IA2BXiB;uCAAW;;;eAlBXX,wBAAW;;;eA9BXf,0BAAY;;IAOZK,oBAAoB;;;;eAgCpBe,gCAAe;;;eAdfP,kCAAqB;;IA2BrBiB;iDAAqB;;;eAlBrBX,kCAAqB;;IAZrBT,0BAA0B;;;;eA2B1BiB,uCAA0B;;8BAlBA;eAA1BX;;;eAcOS,mCAAsB;;;eAL7BJ,+CAA8B;;;eAvC9BpB,yCAA2B;;;eAyB3Ba,0BAAa;;0BAtBS;eAAtBV;;IAIAE,+BAA+B;;;;eAmC/BkB,0CAAyB;;IApBzBb;yDAA6B;;;eAC7BC,oCAAuB;;;eA0BvBgB,0CAA6B;;IAC7BC;mDAAuB;;;eAnBvBZ,0CAA6B;;2BACN;eAAvBC;;;eAxBAX,8CAAoC;;gCACR;eAA5BC;;IA+BAc;iEAAiC;;;eACjCC,4CAA2B;;;eAxC3BrB,4CAA8B;;;eAC9BC,sCAAwB;;;8BAEnB,iBAAiB;0BAMjB,aAAa;6BAgBb,gBAAgB;6BAQhB,gBAAgB;iCAShB,oBAAoB;6BACY,sBAAsB;6BAQtD,gBAAgB"}

package/lib-commonjs/utils/renderUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/utils/renderUtils.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ColorSwatch, SwatchPickerRow, ImageSwatch } from '../';\nimport type { ColorSwatchProps, ImageSwatchProps } from '../';\n\nexport type SwatchProps = ImageSwatchProps \| ColorSwatchProps;\n\nexport type SwatchPickerGridProps = {\n items: SwatchProps[];\n columnCount: number;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderRow?: (props: { children: JSX.Element[]; rowId: string \| number }) => JSX.Element;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderSwatch?: (item: SwatchProps) => JSX.Element;\n};\n\nexport const renderSwatchPickerGrid = (props: SwatchPickerGridProps) => {\n const { items, columnCount, renderRow, renderSwatch } = props;\n const _renderRow = renderRow \|\| (({ children, rowId }) => <SwatchPickerRow key={rowId}>{children}</SwatchPickerRow>);\n const _renderSwatch =\n renderSwatch \|\|\n ((item: SwatchProps) =>\n (item as ImageSwatchProps).src ? (\n <ImageSwatch key={item.value} src={(item as ImageSwatchProps).src ?? ''} {...item} />\n ) : (\n <ColorSwatch key={item.value} color={item.color \|\| ''} {...item} />\n ));\n\n const rowCount = Math.ceil(items.length / columnCount);\n const rows = Array.from({ length: rowCount }, (_, i) => {\n const start = i * columnCount;\n const end = start + columnCount;\n return items.slice(start, end);\n });\n\n return rows.map((row, index) => _renderRow({ children: row.map(_renderSwatch), rowId: index }));\n};\n"],"names":["renderSwatchPickerGrid","props","items","columnCount","renderRow","renderSwatch","_renderRow","children","rowId","~~React","createElement","SwatchPickerRow","~~key","_renderSwatch","item","~~_item_src","~~src","~~ImageSwatch","~~value","~~ColorSwatch","~~color","rowCount","Math","ceil","length","rows","Array","from","_","i","start","end","slice","map","row","index"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAeaA;;;eAAAA;;;;~~iEAfU;~~kBACmC~~;~~AAcnD~~,~~MAAMA,yBAAyB,~~CAACC;IACrC,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAEC,SAAS,EAAEC,YAAY,EAAE,GAAGJ;IACxD,MAAMK,aAAaF,aAAc,CAAA,CAAC,EAAEG,QAAQ,EAAEC,KAAK,EAAE,GAAA,WAAA,~~GAAKC~~,~~OAAAC~~,aAAA,~~CAACC~~,iBAAAA,EAAAA;~~YAAgBC~~,~~KAAKJ~~;WAAQD,SAAAA;~~IACxF~~,~~MAAMM~~,~~gBACJR~~,gBACC,CAAA,~~CAACS~~;~~YAEqCC~~;~~eADrCD~~,~~KAA2BE~~,GAAG,GAAA,WAAA,~~GAC5BP~~,~~OAAAC~~,aAAA,~~CAACO~~,aAAAA,EAAAA;~~YAAYL~~,KAAKE,~~KAAKI~~,KAAK;~~YAAEF~~,KAAK,~~AAAAD~~,~~CAAAA~~,~~YAAAD~~,~~KAA2BE~~,~~GAAG~~,~~AAAHA~~,~~MAAG~~,~~QAA9BD,~~cAAA,KAAA,~~IAAAA~~,YAAkC;YAAK,GAAGD,IAAI;~~2BAEjFL~~,~~OAAAC~~,aAAA,~~CAACS~~,aAAAA,EAAAA;~~YAAYP~~,KAAKE,~~KAAKI~~,KAAK;~~YAAEE~~,~~OAAON~~,~~KAAKM~~,KAAK,IAAI;YAAK,~~GAAGN~~,IAAI;;~~IACjE,CAAA~~;IAEJ,~~MAAMO~~,WAAWC,KAAKC,IAAI,~~CAACrB~~,~~MAAMsB~~,MAAM,~~GAAGrB~~;IAC1C,~~MAAMsB~~,OAAOC,MAAMC,IAAI,CAAC;QAAEH,QAAQH;IAAS,GAAG,CAACO,GAAGC;QAChD,MAAMC,QAAQD,~~IAAI1B~~;QAClB,~~MAAM4B~~,MAAMD,~~QAAQ3B~~;QACpB,OAAOD,~~MAAM8B~~,KAAK,CAACF,OAAOC;IAC5B;IAEA,OAAON,KAAKQ,GAAG,CAAC,CAACC,KAAKC,~~QAAU7B~~,WAAW;YAAEC,~~UAAU2B~~,IAAID,GAAG,~~CAACpB~~;~~YAAgBL~~,~~OAAO2B~~;QAAM;AAC9F"}
1	+ {"version":3,"sources":["../src/utils/renderUtils.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ColorSwatch, SwatchPickerRow, ImageSwatch } from '../';\nimport type { ColorSwatchProps, ImageSwatchProps } from '../';\n\nexport type SwatchProps = ImageSwatchProps \| ColorSwatchProps;\n\nexport type SwatchPickerGridProps = {\n items: SwatchProps[];\n columnCount: number;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderRow?: (props: { children: JSX.Element[]; rowId: string \| number }) => JSX.Element;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderSwatch?: (item: SwatchProps) => JSX.Element;\n};\n\nexport const renderSwatchPickerGrid = (props: SwatchPickerGridProps) => {\n const { items, columnCount, renderRow, renderSwatch } = props;\n const _renderRow = renderRow \|\| (({ children, rowId }) => <SwatchPickerRow key={rowId}>{children}</SwatchPickerRow>);\n const _renderSwatch =\n renderSwatch \|\|\n ((item: SwatchProps) =>\n (item as ImageSwatchProps).src ? (\n <ImageSwatch key={item.value} src={(item as ImageSwatchProps).src ?? ''} {...item} />\n ) : (\n <ColorSwatch key={item.value} color={item.color \|\| ''} {...item} />\n ));\n\n const rowCount = Math.ceil(items.length / columnCount);\n const rows = Array.from({ length: rowCount }, (_, i) => {\n const start = i * columnCount;\n const end = start + columnCount;\n return items.slice(start, end);\n });\n\n return rows.map((row, index) => _renderRow({ children: row.map(_renderSwatch), rowId: index }));\n};\n"],"names":["React","ColorSwatch","SwatchPickerRow","ImageSwatch","renderSwatchPickerGrid","props","items","columnCount","renderRow","renderSwatch","_renderRow","children","rowId","key","_renderSwatch","item","src","value","color","rowCount","Math","ceil","length","rows","Array","from","_","i","start","end","slice","map","row","index"],"mappings":";;;;+BAeaI;;;;;;;iEAfU,QAAQ;kBAC2B,MAAM;AAczD,+BAA+B,CAACC;IACrC,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAEC,SAAS,EAAEC,YAAY,EAAE,GAAGJ;IACxD,MAAMK,aAAaF,aAAc,CAAA,CAAC,EAAEG,QAAQ,EAAEC,KAAK,EAAE,GAAA,WAAA,GAAK,OAAA,aAAA,CAACV,iBAAAA,EAAAA;YAAgBW,KAAKD;WAAQD,SAAAA,CAA0B;IAClH,MAAMG,gBACJL,gBACC,CAAA,CAACM;YAEqC;eADpCA,KAA0BC,GAAG,GAAA,WAAA,GAC5B,OAAA,aAAA,CAACb,aAAAA,EAAAA;YAAYU,KAAKE,KAAKE,KAAK;YAAED,KAAK,CAAA,YAACD,KAA0BC,GAAAA,AAAG,MAAA,QAA9B,cAAA,KAAA,IAAA,YAAkC;YAAK,GAAGD,IAAI;2BAEjF,OAAA,aAAA,CAACd,aAAAA,EAAAA;YAAYY,KAAKE,KAAKE,KAAK;YAAEC,OAAOH,KAAKG,KAAK,IAAI;YAAK,GAAGH,IAAI;;MACjE;IAEJ,MAAMI,WAAWC,KAAKC,IAAI,CAACf,MAAMgB,MAAM,GAAGf;IAC1C,MAAMgB,OAAOC,MAAMC,IAAI,CAAC;QAAEH,QAAQH;IAAS,GAAG,CAACO,GAAGC;QAChD,MAAMC,QAAQD,IAAIpB;QAClB,MAAMsB,MAAMD,QAAQrB;QACpB,OAAOD,MAAMwB,KAAK,CAACF,OAAOC;IAC5B;IAEA,OAAON,KAAKQ,GAAG,CAAC,CAACC,KAAKC,QAAUvB,WAAW;YAAEC,UAAUqB,IAAID,GAAG,CAACjB;YAAgBF,OAAOqB;QAAM;AAC9F,EAAE"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-swatch-picker",
-  "version": "9.4.0",
+  "version": "9.4.2",
   "description": "New fluentui react package",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -20,14 +20,14 @@
     "@fluentui/scripts-cypress": "*"
   },
   "dependencies": {
-    "@fluentui/react-context-selector": "^9.2.2",
-    "@fluentui/react-field": "^9.4.0",
+    "@fluentui/react-context-selector": "^9.2.4",
+    "@fluentui/react-field": "^9.4.2",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-jsx-runtime": "^9.1.2",
-    "@fluentui/react-shared-contexts": "^9.24.0",
-    "@fluentui/react-tabster": "^9.26.0",
-    "@fluentui/react-theme": "^9.1.24",
-    "@fluentui/react-utilities": "^9.22.0",
+    "@fluentui/react-jsx-runtime": "^9.1.4",
+    "@fluentui/react-shared-contexts": "^9.24.1",
+    "@fluentui/react-tabster": "^9.26.2",
+    "@fluentui/react-theme": "^9.2.0",
+    "@fluentui/react-utilities": "^9.23.1",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },