mirror of
https://github.com/Unleash/unleash.git
synced 2025-07-02 01:17:58 +02:00
feat: add click away handler to sidebar content (#5751)
Does what it says on the can
This commit is contained in:
parent
ff96563742
commit
5582339560
@ -1,6 +1,7 @@
|
|||||||
import {
|
import {
|
||||||
Box,
|
Box,
|
||||||
Button,
|
Button,
|
||||||
|
ClickAwayListener,
|
||||||
IconButton,
|
IconButton,
|
||||||
styled,
|
styled,
|
||||||
TextField,
|
TextField,
|
||||||
@ -257,6 +258,7 @@ export const FeedbackComponent = ({
|
|||||||
condition={showFeedback}
|
condition={showFeedback}
|
||||||
show={
|
show={
|
||||||
<ParentContainer>
|
<ParentContainer>
|
||||||
|
<ClickAwayListener onClickAway={() => closeFeedback()}>
|
||||||
<StyledContainer>
|
<StyledContainer>
|
||||||
<Tooltip title='Close' arrow>
|
<Tooltip title='Close' arrow>
|
||||||
<StyledCloseButton
|
<StyledCloseButton
|
||||||
@ -284,17 +286,23 @@ export const FeedbackComponent = ({
|
|||||||
<FormTitle>{feedbackData.title}</FormTitle>
|
<FormTitle>{feedbackData.title}</FormTitle>
|
||||||
<StyledScoreContainer>
|
<StyledScoreContainer>
|
||||||
<StyledScoreInput>
|
<StyledScoreInput>
|
||||||
{[1, 2, 3, 4, 5, 6, 7].map((score) => (
|
{[1, 2, 3, 4, 5, 6, 7].map(
|
||||||
<StyledScoreValue key={score}>
|
(score) => (
|
||||||
|
<StyledScoreValue
|
||||||
|
key={score}
|
||||||
|
>
|
||||||
<input
|
<input
|
||||||
type='radio'
|
type='radio'
|
||||||
name='difficultyScore'
|
name='difficultyScore'
|
||||||
value={score}
|
value={score}
|
||||||
onChange={onScoreChange}
|
onChange={
|
||||||
|
onScoreChange
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
<span>{score}</span>
|
<span>{score}</span>
|
||||||
</StyledScoreValue>
|
</StyledScoreValue>
|
||||||
))}
|
),
|
||||||
|
)}
|
||||||
</StyledScoreInput>
|
</StyledScoreInput>
|
||||||
<ScoreHelpContainer>
|
<ScoreHelpContainer>
|
||||||
<StyledScoreHelp>
|
<StyledScoreHelp>
|
||||||
@ -320,14 +328,17 @@ export const FeedbackComponent = ({
|
|||||||
InputLabelProps={{
|
InputLabelProps={{
|
||||||
style: {
|
style: {
|
||||||
fontSize:
|
fontSize:
|
||||||
theme.fontSizes.smallBody,
|
theme.fontSizes
|
||||||
|
.smallBody,
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Box>
|
</Box>
|
||||||
<Box>
|
<Box>
|
||||||
<FormSubTitle>
|
<FormSubTitle>
|
||||||
{feedbackData.areasForImprovementsLabel}
|
{
|
||||||
|
feedbackData.areasForImprovementsLabel
|
||||||
|
}
|
||||||
</FormSubTitle>
|
</FormSubTitle>
|
||||||
<TextField
|
<TextField
|
||||||
placeholder='Your answer here'
|
placeholder='Your answer here'
|
||||||
@ -338,7 +349,8 @@ export const FeedbackComponent = ({
|
|||||||
InputLabelProps={{
|
InputLabelProps={{
|
||||||
style: {
|
style: {
|
||||||
fontSize:
|
fontSize:
|
||||||
theme.fontSizes.smallBody,
|
theme.fontSizes
|
||||||
|
.smallBody,
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
variant='outlined'
|
variant='outlined'
|
||||||
@ -357,6 +369,7 @@ export const FeedbackComponent = ({
|
|||||||
</StyledForm>
|
</StyledForm>
|
||||||
</StyledContent>
|
</StyledContent>
|
||||||
</StyledContainer>
|
</StyledContainer>
|
||||||
|
</ClickAwayListener>
|
||||||
</ParentContainer>
|
</ParentContainer>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
Loading…
Reference in New Issue
Block a user