-
Notifications
You must be signed in to change notification settings - Fork 2.7k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(react-swatch-picker): fixes after bug bash (#31097)
Co-authored-by: Martin Hochel <hochelmartin@gmail.com>
- Loading branch information
1 parent
6c94822
commit ab8aee0
Showing
27 changed files
with
107 additions
and
92 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
7 changes: 7 additions & 0 deletions
7
change/@fluentui-react-swatch-picker-preview-6246310c-e802-4b75-a4dd-6aa211c022b9.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
{ | ||
"type": "minor", | ||
"comment": "fix: BREAKING CHANGE - api changes and fixes", | ||
"packageName": "@fluentui/react-swatch-picker-preview", | ||
"email": "vkozlova@microsoft.com", | ||
"dependentChangeType": "patch" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
25 changes: 15 additions & 10 deletions
25
...t-swatch-picker-preview/src/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,32 +1,37 @@ | ||
import { makeResetStyles, mergeClasses } from '@griffel/react'; | ||
import { makeResetStyles, mergeClasses, makeStyles } from '@griffel/react'; | ||
import type { SlotClassNames } from '@fluentui/react-utilities'; | ||
import type { SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow.types'; | ||
|
||
export const swatchPickerCSSVars = { | ||
rowGap: `--fui-SwatchPicker--rowGap`, | ||
}; | ||
|
||
const { rowGap } = swatchPickerCSSVars; | ||
|
||
export const swatchPickerRowClassNames: SlotClassNames<SwatchPickerRowSlots> = { | ||
root: 'fui-SwatchPickerRow', | ||
}; | ||
|
||
/** | ||
* Styles for the root slot | ||
*/ | ||
const useStyles = makeResetStyles({ | ||
const useResetStyles = makeResetStyles({ | ||
display: 'flex', | ||
flexDirection: 'row', | ||
columnGap: `var(${rowGap})`, | ||
}); | ||
|
||
const useStyles = makeStyles({ | ||
spacingSmall: { | ||
columnGap: '2px', | ||
}, | ||
spacingMedium: { | ||
columnGap: '4px', | ||
}, | ||
}); | ||
|
||
/** | ||
* Apply styling to the SwatchPickerRow slots based on the state | ||
*/ | ||
export const useSwatchPickerRowStyles_unstable = (state: SwatchPickerRowState): SwatchPickerRowState => { | ||
const resetStyles = useResetStyles(); | ||
const styles = useStyles(); | ||
state.root.className = mergeClasses(swatchPickerRowClassNames.root, styles, state.root.className); | ||
const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium; | ||
|
||
state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className); | ||
|
||
return state; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.