SQuiz/frontPanel
3
0
Fork 0
Code Issues 18 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

кастомный инпут не пускает больше указанного количества символов

Browse Source
This commit is contained in:
Nastya 2024-01-09 06:52:36 +03:00
parent 7f832e5fbd
commit be4b4567cc
12 changed files with 42 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/pages/Questions/BranchingMap/style/stylesheet.ts
View File

@ -16,7 +16,6 @@ export const stylesheet: Stylesheet[] = [
"text-wrap": "wrap",
"text-max-width": "130px",
"text-overflow-wrap": "anywhere",
},
},
{

4
src/ui_kit/CustomSlider.tsx
View File

@ -24,7 +24,7 @@ export const CustomSlider = ({
onChange,
onChangeCommitted,
sx,
className
className,
}: CustomSliderProps) => {
// const handleChange = ({ type }: Event, newValue: number | number[]) => {
// // Для корректной работы слайдера в FireFox
@ -36,7 +36,7 @@ export const CustomSlider = ({
return (
<Slider
className={className || ""}
className={className || ""}
value={value}
defaultValue={defaultValue}
min={min}

30
src/ui_kit/CustomTextField.tsx
View File

@ -26,7 +26,7 @@ interface CustomTextFieldProps {
InputProps?: Partial<InputProps>;
type?: string;
rows?: number;
className?:string;
className?: string;
}
export default function CustomTextField({
@ -44,8 +44,7 @@ export default function CustomTextField({
type = "",
rows = 0,
sxForm,
className
className,
}: CustomTextFieldProps) {
const theme = useTheme();
@ -57,16 +56,18 @@ export default function CustomTextField({
}, [value]);
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
const inputValue = event.target.value;
if (event.target.value.length <= maxLength) {
const inputValue = event.target.value;
if (type === "number") {
setInputValue(inputValue.replace(/\D/g, ""));
} else {
setInputValue(inputValue);
}
if (type === "number") {
setInputValue(inputValue.replace(/\D/g, ""));
} else {
setInputValue(inputValue);
}
if (onChange) {
onChange(event);
if (onChange) {
onChange(event);
}
}
};
@ -83,7 +84,12 @@ export default function CustomTextField({
};
return (
<FormControl fullWidth variant="standard" sx={{ p: 0, ...sxForm }} className={className || ""}>
<FormControl
fullWidth
variant="standard"
sx={{ p: 0, ...sxForm }}
className={className || ""}
>
{error && (
<InputLabel
sx={{

6
src/ui_kit/LabeledDatePicker.tsx
View File

@ -17,7 +17,7 @@ interface Props {
sxDate?: SxProps<Theme>;
value?: Dayjs | null;
onChange?: (value: Dayjs | null) => void;
className?: string
className?: string;
}
export default function LabeledDatePicker({
@ -27,7 +27,7 @@ export default function LabeledDatePicker({
sx,
sxIcon,
sxDate,
className
className,
}: Props) {
const theme = useTheme();
const upLg = useMediaQuery(theme.breakpoints.up("md"));
@ -52,7 +52,7 @@ export default function LabeledDatePicker({
</Typography>
)}
<DatePicker
className={className || ""}
className={className || ""}
value={value}
onChange={onChange}
slots={{

5
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Emoji.tsx
View File

@ -29,8 +29,7 @@ export default function Emoji({ question }: Props) {
};
return (
<FormControl fullWidth
className="cancel">
<FormControl fullWidth className="cancel">
<FormLabel
id="quiz-question-radio-group"
data-cy="question-title"
@ -84,7 +83,7 @@ export default function Emoji({ question }: Props) {
</Box>
</Box>
<FormControlLabel
className="cancel"
className="cancel"
key={index}
value={variant.answer}
sx={{

7
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/File.tsx
View File

@ -47,8 +47,11 @@ export default function File({ question }: Props) {
<Typography variant="h6" data-cy="question-title">
{question.title}
</Typography>
<Button variant="contained" onClick={() => fileInputRef.current?.click()}
className="cancel">
<Button
variant="contained"
onClick={() => fileInputRef.current?.click()}
className="cancel"
>
Загрузить файл
<input
ref={fileInputRef}

2
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Images.tsx
View File

@ -63,7 +63,7 @@ export default function Images({ question, widthPreview }: Props) {
.filter(({ answer }) => answer)
.map((variant, index) => (
<ButtonBase
className="cancel"
className="cancel"
key={index}
onClick={() => handleVariantClick(index)}
data-cy="variant-button"

6
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Number.tsx
View File

@ -47,7 +47,7 @@ export default function Number({ question }: Props) {
}}
>
<CustomSlider
className="cancel"
className="cancel"
value={sliderValues}
onChange={(e, value) => {
setSliderValues(value);
@ -93,7 +93,7 @@ export default function Number({ question }: Props) {
}}
>
<CustomTextField
className="cancel"
className="cancel"
placeholder="0"
value={sliderValues[0]}
sx={{
@ -109,7 +109,7 @@ export default function Number({ question }: Props) {
/>
<Typography color={theme.palette.text.primary}>до</Typography>
<CustomTextField
className="cancel"
className="cancel"
placeholder="0"
value={sliderValues[1]}
sx={{

2
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Rating.tsx
View File

@ -69,7 +69,7 @@ export default function Rating({ question }: Props) {
}}
>
<Box
className="cancel"
className="cancel"
data-cy="rating"
data-rating={selectedRating}
sx={{

6
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Text.tsx
View File

@ -20,8 +20,10 @@ export default function Text({ question }: Props) {
<Typography variant="h6" data-cy="question-title">
{question.title}
</Typography>
<CustomTextField placeholder={question.content.placeholder}
className="cancel"/>
<CustomTextField
placeholder={question.content.placeholder}
className="cancel"
/>
</Box>
);
}

5
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Variant.tsx
View File

@ -37,8 +37,7 @@ export default function Variant({ question }: Props) {
};
return (
<FormControl
className="cancel" fullWidth>
<FormControl className="cancel" fullWidth>
<FormLabel
id="quiz-question-radio-group"
data-cy="question-title"
@ -65,7 +64,7 @@ export default function Variant({ question }: Props) {
.filter(({ answer }) => answer)
.map((variant, index) => (
<FormControlLabel
className="cancel"
className="cancel"
key={index}
value={variant.answer}
data-cy="variant-answer"

2
src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Varimg.tsx
View File

@ -79,7 +79,7 @@ export default function Varimg({ question, widthPreview }: Props) {
}}
>
<RadioGroup
className="cancel"
className="cancel"
aria-labelledby="quiz-question-radio-group"
value={currentVariant?.answer ?? ""}
onChange={handleChange}