From 10e3666cf1805d84823060f0fbbfb8de3c4436ef Mon Sep 17 00:00:00 2001 From: Sidney Alcantara Date: Mon, 13 Sep 2021 21:58:03 +1000 Subject: [PATCH] fix wizards styling --- package.json | 2 +- .../Modal/ScrollableDialogContent.tsx | 2 +- src/components/Table/HiddenFields.tsx | 4 +- src/components/Wizards/Cell.tsx | 4 +- src/components/Wizards/Column.tsx | 5 +- src/components/Wizards/FadeList.tsx | 58 ---- .../Wizards/ImportCsvWizard/Step1Columns.tsx | 18 +- .../ImportCsvWizard/Step2NewColumns.tsx | 15 +- .../Wizards/ImportCsvWizard/Step3Preview.tsx | 39 +-- .../Wizards/ImportCsvWizard/index.tsx | 18 +- .../Wizards/ImportWizard/Step1Columns.tsx | 14 +- .../Wizards/ImportWizard/Step2Rename.tsx | 6 +- .../Wizards/ImportWizard/Step3Types.tsx | 15 +- .../Wizards/ImportWizard/Step4Preview.tsx | 39 +-- src/components/Wizards/ImportWizard/index.tsx | 2 +- src/components/Wizards/ScrollableList.tsx | 59 ++++ src/components/Wizards/WizardDialog.tsx | 257 ++++++------------ src/constants/routes.ts | 1 + src/theme/components.tsx | 9 + yarn.lock | 8 +- 20 files changed, 225 insertions(+), 350 deletions(-) delete mode 100644 src/components/Wizards/FadeList.tsx create mode 100644 src/components/Wizards/ScrollableList.tsx diff --git a/package.json b/package.json index ac0394af..3ef77e6b 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "@mui/material": "^5.0.0-rc.1", "@mui/styles": "^5.0.0-rc.1", "@rowy/form-builder": "^0.1.1", - "@rowy/multiselect": "^0.1.4", + "@rowy/multiselect": "^0.1.5", "@tinymce/tinymce-react": "^3.4.0", "algoliasearch": "^4.8.6", "ansi-to-react": "^6.1.5", diff --git a/src/components/Modal/ScrollableDialogContent.tsx b/src/components/Modal/ScrollableDialogContent.tsx index eb91d006..5e0f70b1 100644 --- a/src/components/Modal/ScrollableDialogContent.tsx +++ b/src/components/Modal/ScrollableDialogContent.tsx @@ -8,7 +8,7 @@ import { DialogContentProps, } from "@mui/material"; -const MemoizedDialogContent = memo(function MemoizedDialogContent({ +const MemoizedDialogContent = memo(function MemoizedDialogContent_({ setRef, ...props }: DialogContentProps & { setRef: any }) { diff --git a/src/components/Table/HiddenFields.tsx b/src/components/Table/HiddenFields.tsx index 5b3ddab9..04881fa2 100644 --- a/src/components/Table/HiddenFields.tsx +++ b/src/components/Table/HiddenFields.tsx @@ -18,7 +18,9 @@ const useStyles = makeStyles((theme) => listbox: {}, option: { "$listbox &": { - padding: theme.spacing(0, 2), + padding: 0, + paddingLeft: "0 !important", + borderRadius: 0, marginBottom: -1, "&::after": { content: "none" }, diff --git a/src/components/Wizards/Cell.tsx b/src/components/Wizards/Cell.tsx index 2eb2f1fe..e91c314b 100644 --- a/src/components/Wizards/Cell.tsx +++ b/src/components/Wizards/Cell.tsx @@ -22,7 +22,7 @@ const useStyles = makeStyles((theme) => display: "flex", alignItems: "center", - padding: theme.spacing(0, 1.5), + padding: theme.spacing(0, 1.25), ...theme.typography.body2, fontSize: "0.75rem", @@ -37,7 +37,7 @@ const useStyles = makeStyles((theme) => value: { width: "100%", - maxHeight: 43, + height: 43, display: "flex", justifyContent: "flex-start", diff --git a/src/components/Wizards/Column.tsx b/src/components/Wizards/Column.tsx index 23ad164e..04aca34f 100644 --- a/src/components/Wizards/Column.tsx +++ b/src/components/Wizards/Column.tsx @@ -15,7 +15,7 @@ const useStyles = makeStyles((theme) => border: `1px solid ${theme.palette.divider}`, backgroundColor: theme.palette.background.default, - padding: theme.spacing(0, 1, 0, 1.5), + padding: theme.spacing(0, 1), color: theme.palette.text.secondary, "&:hover": { color: theme.palette.text.primary }, @@ -50,6 +50,7 @@ const useStyles = makeStyles((theme) => overflow: "hidden", }, columnName: { + fontWeight: theme.typography.fontWeightMedium, lineHeight: "44px", display: "block", @@ -94,7 +95,7 @@ export default function Column({ diff --git a/src/components/Wizards/FadeList.tsx b/src/components/Wizards/FadeList.tsx deleted file mode 100644 index 882262bb..00000000 --- a/src/components/Wizards/FadeList.tsx +++ /dev/null @@ -1,58 +0,0 @@ -import React from "react"; -import clsx from "clsx"; - -import { makeStyles, createStyles } from "@mui/styles"; - -const useStyles = makeStyles((theme) => - createStyles({ - listWrapper: { - position: "relative", - - "&::after": { - content: '""', - display: "block", - pointerEvents: "none", - - position: "absolute", - bottom: 0, - left: 0, - right: 0, - - height: theme.spacing(3), - backgroundImage: `linear-gradient(to top, ${theme.palette.background.paper}, transparent)`, - }, - }, - list: { - listStyleType: "none", - margin: 0, - padding: theme.spacing(1.5, 0, 3), - - height: 400, - overflowY: "overlay" as any, - - "& li": { margin: theme.spacing(0.5, 0) }, - }, - }) -); - -export interface IFadeListProps { - children?: React.ReactNode | React.ElementType[]; - classes?: Partial>; -} - -export const FadeList = React.forwardRef( - function FadeList_({ children, classes: classesProp }, ref) { - const classes = useStyles(); - - return ( -
-
    {children}
-
- ); - } -); - -export default FadeList; diff --git a/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx b/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx index cb995dbd..4029f773 100644 --- a/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx +++ b/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx @@ -18,7 +18,7 @@ import { import ArrowIcon from "@mui/icons-material/ArrowForward"; import { IStepProps } from "."; -import FadeList from "../FadeList"; +import FadeList from "../ScrollableList"; import Column from "../Column"; import { useProjectContext } from "contexts/ProjectContext"; @@ -48,15 +48,15 @@ const useStyles = makeStyles((theme) => backgroundColor: theme.palette.background.default, border: `1px solid ${theme.palette.divider}`, borderRadius: 0, + boxShadow: "none", + height: 44, ...theme.typography.subtitle2, color: theme.palette.text.secondary, - transition: theme.transitions.create("color", { - duration: theme.transitions.duration.short, - }), "&:hover": { backgroundColor: theme.palette.background.default, color: theme.palette.text.primary, + boxShadow: "none", }, "&::before": { content: "none" }, @@ -64,16 +64,12 @@ const useStyles = makeStyles((theme) => }, noneSelected: { color: theme.palette.text.disabled }, multiSelectInputLabel: { - padding: theme.spacing(0, 2), - height: 44 - 2, - display: "flex", alignItems: "center", }, newColumnChip: { - marginLeft: theme.spacing(1), + marginLeft: theme.spacing(1) + " !important", backgroundColor: theme.palette.action.focus, - ...theme.typography.overline, pointerEvents: "none", }, }) @@ -168,13 +164,13 @@ export default function Step1Columns({ {!isXs && ( - + Select Columns ({config.pairs.length} of {csvData.columns.length}) )} - + Table Columns diff --git a/src/components/Wizards/ImportCsvWizard/Step2NewColumns.tsx b/src/components/Wizards/ImportCsvWizard/Step2NewColumns.tsx index 2d656124..962f8471 100644 --- a/src/components/Wizards/ImportCsvWizard/Step2NewColumns.tsx +++ b/src/components/Wizards/ImportCsvWizard/Step2NewColumns.tsx @@ -7,7 +7,7 @@ import { Grid, Typography, Divider, ButtonBase } from "@mui/material"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; import { IStepProps } from "."; -import FadeList from "../FadeList"; +import FadeList from "../ScrollableList"; import Column from "../Column"; import Cell from "../Cell"; import FieldsDropdown from "components/Table/ColumnMenu/FieldsDropdown"; @@ -24,10 +24,9 @@ const useStyles = makeStyles((theme) => textAlign: "left", }, - typeHeading: { margin: theme.spacing(5, 0, 1) }, + typeHeading: { margin: theme.spacing(52 / 8, 0, 1) }, previewDivider: { marginBottom: theme.spacing(2) }, - previewList: { paddingTop: 0 }, previewSpacer: { width: theme.spacing(3) }, cellContainer: { overflow: "hidden" }, }) @@ -60,7 +59,7 @@ export default function Step2NewColumns({
- + New Table Columns @@ -87,7 +86,7 @@ export default function Step2NewColumns({ {!isXs && ( - + Raw Data )} - + Column Preview @@ -137,7 +136,7 @@ export default function Step2NewColumns({ - + {rowData.slice(0, 20).map((cell, i) => ( {!isXs && ( diff --git a/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx b/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx index 7ab2353b..cec4cc57 100644 --- a/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx +++ b/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx @@ -14,35 +14,14 @@ const useStyles = makeStyles((theme) => createStyles({ root: { position: "relative", + minHeight: 300, + height: "calc(100% - 80px)", + }, - "&::after": { - content: '""', - display: "block", - pointerEvents: "none", - - position: "absolute", - bottom: 0, - left: 0, - right: 0, - - height: theme.spacing(3), - backgroundImage: `linear-gradient(to top, ${theme.palette.background.paper}, transparent)`, - }, - - "&::before": { - content: '""', - display: "block", - pointerEvents: "none", - zIndex: 1, - - position: "absolute", - top: 0, - bottom: 0, - right: 0, - - width: theme.spacing(3), - backgroundImage: `linear-gradient(to left, ${theme.palette.background.paper}, transparent)`, - }, + container: { + height: "100%", + display: "flex", + flexDirection: "column", }, spacer: { @@ -54,7 +33,7 @@ const useStyles = makeStyles((theme) => header: { overflowX: "hidden" }, data: { overflow: "scroll", - height: 300, + flexGrow: 1, }, column: { @@ -84,7 +63,7 @@ export default function Step4Preview({ csvData, config }: IStepProps) { return (
-
+
{columns.map(({ key, name, type }) => ( diff --git a/src/components/Wizards/ImportCsvWizard/index.tsx b/src/components/Wizards/ImportCsvWizard/index.tsx index 13656993..8ea2c2d5 100644 --- a/src/components/Wizards/ImportCsvWizard/index.tsx +++ b/src/components/Wizards/ImportCsvWizard/index.tsx @@ -3,9 +3,14 @@ import { useSnackbar } from "notistack"; import _mergeWith from "lodash/mergeWith"; import _find from "lodash/find"; -import { useTheme, useMediaQuery, Typography, Link } from "@mui/material"; -import Alert from "@mui/material/Alert"; -import AlertTitle from "@mui/material/AlertTitle"; +import { + useTheme, + useMediaQuery, + Typography, + Link, + Alert, + AlertTitle, +} from "@mui/material"; import WizardDialog from "../WizardDialog"; import Step1Columns from "./Step1Columns"; @@ -116,15 +121,16 @@ export default function ImportCsvWizard({ Importing dates? - Make sure your dates are in UTC time and{" "} + Make sure they’re in UTC time and{" "} a supported format - . If they’re not, you will need to re-import your CSV data. + . If they’re not, you’ll need to re-import your CSV data. ), @@ -142,7 +148,7 @@ export default function ImportCsvWizard({ config.newColumns.length > 0 && { title: "Set Column Types", description: - "Set the type of each column to display your data correctly. Some column types have been suggested based off your data.", + "Set the type of each column to display your data correctly. Some column types have been suggested based on your data.", content: ( - + Select Columns ({selectedFields.length} of {allFields.length}) @@ -126,18 +126,14 @@ export default function Step1Columns({ config, setConfig }: IStepProps) { color="default" /> } - label={ - - Select all - - } + label="Select all" classes={{ root: classes.formControlLabel, label: classes.columnLabel, }} + style={{ height: 44 }} /> -
  • {allFields.map((field) => (
  • @@ -162,7 +158,7 @@ export default function Step1Columns({ config, setConfig }: IStepProps) { - + Sort Table Columns diff --git a/src/components/Wizards/ImportWizard/Step2Rename.tsx b/src/components/Wizards/ImportWizard/Step2Rename.tsx index 5c3ba31d..11f48607 100644 --- a/src/components/Wizards/ImportWizard/Step2Rename.tsx +++ b/src/components/Wizards/ImportWizard/Step2Rename.tsx @@ -14,7 +14,7 @@ import EditIcon from "@mui/icons-material/Edit"; import DoneIcon from "@mui/icons-material/Done"; import { IStepProps } from "."; -import FadeList from "../FadeList"; +import FadeList from "../ScrollableList"; import Column from "../Column"; const useStyles = makeStyles((theme) => @@ -65,13 +65,13 @@ export default function Step2Rename({ {!isXs && ( - + Field Names )} - + Set Column Names diff --git a/src/components/Wizards/ImportWizard/Step3Types.tsx b/src/components/Wizards/ImportWizard/Step3Types.tsx index c2ec88a8..433f7ef9 100644 --- a/src/components/Wizards/ImportWizard/Step3Types.tsx +++ b/src/components/Wizards/ImportWizard/Step3Types.tsx @@ -5,7 +5,7 @@ import { Grid, Typography, Divider, ButtonBase } from "@mui/material"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; import { IStepProps } from "."; -import FadeList from "../FadeList"; +import FadeList from "../ScrollableList"; import Column from "../Column"; import Cell from "../Cell"; import FieldsDropdown from "components/Table/ColumnMenu/FieldsDropdown"; @@ -23,10 +23,9 @@ const useStyles = makeStyles((theme) => textAlign: "left", }, - typeHeading: { margin: theme.spacing(5, 0, 1) }, + typeHeading: { margin: theme.spacing(52 / 8, 0, 1) }, previewDivider: { marginBottom: theme.spacing(2) }, - previewList: { paddingTop: 0 }, previewSpacer: { width: theme.spacing(3) }, cellContainer: { overflow: "hidden" }, }) @@ -45,7 +44,7 @@ export default function Step3Types({ config, updateConfig, isXs }: IStepProps) {
    - + Table Columns @@ -74,7 +73,7 @@ export default function Step3Types({ config, updateConfig, isXs }: IStepProps) { {!isXs && ( - + Raw Data )} - + Column Preview @@ -122,7 +121,7 @@ export default function Step3Types({ config, updateConfig, isXs }: IStepProps) { - + {tableState!.rows!.slice(0, 20).map((row) => ( {!isXs && ( diff --git a/src/components/Wizards/ImportWizard/Step4Preview.tsx b/src/components/Wizards/ImportWizard/Step4Preview.tsx index 39a14598..e23ff184 100644 --- a/src/components/Wizards/ImportWizard/Step4Preview.tsx +++ b/src/components/Wizards/ImportWizard/Step4Preview.tsx @@ -13,35 +13,14 @@ const useStyles = makeStyles((theme) => createStyles({ root: { position: "relative", + minHeight: 300, + height: "calc(100% - 80px)", + }, - "&::after": { - content: '""', - display: "block", - pointerEvents: "none", - - position: "absolute", - bottom: 0, - left: 0, - right: 0, - - height: theme.spacing(3), - backgroundImage: `linear-gradient(to top, ${theme.palette.background.paper}, transparent)`, - }, - - "&::before": { - content: '""', - display: "block", - pointerEvents: "none", - zIndex: 1, - - position: "absolute", - top: 0, - bottom: 0, - right: 0, - - width: theme.spacing(3), - backgroundImage: `linear-gradient(to left, ${theme.palette.background.paper}, transparent)`, - }, + container: { + height: "100%", + display: "flex", + flexDirection: "column", }, spacer: { @@ -53,7 +32,7 @@ const useStyles = makeStyles((theme) => header: { overflowX: "hidden" }, data: { overflow: "scroll", - height: 300, + flexGrow: 1, }, column: { @@ -73,7 +52,7 @@ export default function Step4Preview({ config }: IStepProps) { return (
    -
    +
    {Object.entries(config).map(([field, { name, type }]) => ( diff --git a/src/components/Wizards/ImportWizard/index.tsx b/src/components/Wizards/ImportWizard/index.tsx index 95c05a3c..501e23b7 100644 --- a/src/components/Wizards/ImportWizard/index.tsx +++ b/src/components/Wizards/ImportWizard/index.tsx @@ -103,7 +103,7 @@ export default function ImportWizard() { { title: "Set Column Types", description: - "Set the type of each column to display your data correctly. Some column types have been suggested based off your data.", + "Set the type of each column to display your data correctly. Some column types have been suggested based on your data.", content: ( ({ + listStyleType: "none", + margin: 0, + padding: theme.spacing(1.5, 0, 3), + + height: 400, + overflowY: "auto", + + "& li": { margin: theme.spacing(0.5, 0) }, + })) +); + +export interface IFadeListProps { + children?: ReactNode | ElementType[]; + disableTopDivider?: boolean; + disableBottomDivider?: boolean; + dividerSx?: DividerProps["sx"]; + topDividerSx?: DividerProps["sx"]; + bottomDividerSx?: DividerProps["sx"]; + listSx?: DividerProps["sx"]; +} + +export default function FadeList({ + children, + disableTopDivider = true, + disableBottomDivider = false, + dividerSx, + topDividerSx, + bottomDividerSx, + listSx, +}: IFadeListProps) { + const [scrollInfo, setRef] = useScrollInfo(); + + return ( + <> + {!disableTopDivider && + scrollInfo.y.percentage !== null && + scrollInfo.y.percentage > 0 && ( + + )} + + + {children} + + + {!disableBottomDivider && + scrollInfo.y.percentage !== null && + scrollInfo.y.percentage < 1 && ( + + )} + + ); +} diff --git a/src/components/Wizards/WizardDialog.tsx b/src/components/Wizards/WizardDialog.tsx index 5e4b4670..f6fe69eb 100644 --- a/src/components/Wizards/WizardDialog.tsx +++ b/src/components/Wizards/WizardDialog.tsx @@ -1,142 +1,47 @@ -import React, { useState } from "react"; -import clsx from "clsx"; +import { ReactNode, useState } from "react"; -import { makeStyles, createStyles } from "@mui/styles"; import { useTheme, useMediaQuery, Dialog, DialogProps, + Stack, DialogTitle, - Grid, Typography, IconButton, MobileStepper, - DialogContent, + DialogActions, Button, + Slide, } from "@mui/material"; -import { alpha } from "@mui/material/styles"; import CloseIcon from "@mui/icons-material/Close"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft"; import { SlideTransitionMui } from "components/Modal/SlideTransition"; - -const useStyles = makeStyles((theme) => - createStyles({ - root: { - "--dialog-spacing": theme.spacing(3), - "--dialog-contents-spacing": theme.spacing(3), - - [theme.breakpoints.down("md")]: { - "--dialog-spacing": theme.spacing(2), - }, - }, - - paper: { - userSelect: "none", - overflowX: "hidden", - - padding: "var(--dialog-spacing)", - paddingBottom: "var(--dialog-contents-spacing)", - }, - - closeButton: { - alignSelf: "flex-end", - margin: - "calc(var(--dialog-spacing) * -1) calc(var(--dialog-spacing) * -1) 0 0", - }, - - titleRow: { paddingBottom: "var(--dialog-spacing)" }, - titleContainer: { padding: 0 }, - title: { - ...theme.typography.h5, - [theme.breakpoints.down("md")]: theme.typography.h6, - }, - - stepper: { - padding: 0, - background: "none", - marginRight: theme.spacing(-10 / 8), - - marginBottom: theme.spacing(-0.5), - [theme.breakpoints.down("md")]: { marginBottom: theme.spacing(-0.75) }, - }, - stepperButton: { padding: theme.spacing(0.5) }, - - stepperDot: { - margin: theme.spacing(0, 0.5), - backgroundColor: theme.palette.primary.main, - }, - stepperDotActive: { - margin: theme.spacing(0, 0.5), - "& ~ $stepperDot": { backgroundColor: theme.palette.action.disabled }, - }, - - content: { - padding: "0 var(--dialog-spacing)", - margin: "0 calc(var(--dialog-spacing) * -1)", - - ...theme.typography.body1, - - // https://codepen.io/evank/pen/wWbRNO - background: ` - linear-gradient( - var(--bg-paper) 50%, - ${alpha(theme.palette.background.paper, 0)} - ), - linear-gradient( - ${alpha(theme.palette.background.paper, 0)}, - var(--bg-paper) 50% - ) 0 100%, - linear-gradient( - to top, ${theme.palette.divider} 1px, - ${alpha(theme.palette.divider, 0)} - ), - linear-gradient(to top, - ${theme.palette.divider} 1px, - ${alpha(theme.palette.divider, 0)} - ) 0 calc(100% - 0.5px)`, - backgroundRepeat: "no-repeat", - backgroundColor: "var(--bg-paper)", - backgroundSize: "100% 2px, 100% 3px, 100% 1px, 100% 1px", - backgroundAttachment: "local, local, scroll, scroll", - - "&:last-child": { - marginBottom: "calc(var(--dialog-contents-spacing) * -1)", - paddingBottom: "var(--dialog-contents-spacing)", - }, - - "& > * + *": { marginTop: "var(--dialog-contents-spacing)" }, - }, - - actions: { - paddingTop: "var(--dialog-contents-spacing)", - "& button": { minWidth: 100 }, - }, - }) -); +import ScrollableDialogContent from "components/Modal/ScrollableDialogContent"; export interface IWizardDialogProps extends DialogProps { title: string; steps: { title: string; - description?: React.ReactNode; - content: React.ReactNode; + description?: ReactNode; + content: ReactNode; disableNext?: boolean; }[]; onFinish: () => void; + fullHeight?: boolean; } export default function WizardDialog({ title, steps, onFinish, + fullHeight = true, ...props }: IWizardDialogProps) { - const classes = useStyles(); const theme = useTheme(); - const isXs = useMediaQuery(theme.breakpoints.down("sm")); + const isMobile = useMediaQuery(theme.breakpoints.down("sm")); const [step, setStep] = useState(0); const currentStep = steps[step]; @@ -148,67 +53,66 @@ export default function WizardDialog({ return ( - - - + + {title} + {currentStep.title && `: ${currentStep.title}`} + - - - - - {title} - {currentStep.title && `: ${currentStep.title}`} - - - - - + @@ -219,51 +123,54 @@ export default function WizardDialog({ aria-label="Back" onClick={handleBack} disabled={step <= 0} - className={classes.stepperButton} > } /> - - - + + + + + + + {currentStep.description && ( {currentStep.description} )} {currentStep.content} - + - - - - - - - - + + + + ); } diff --git a/src/constants/routes.ts b/src/constants/routes.ts index 6c323b4d..e7202f3b 100644 --- a/src/constants/routes.ts +++ b/src/constants/routes.ts @@ -5,6 +5,7 @@ export enum routes { jwtAuth = "/jwtAuth", signOut = "/signOut", authSetup = "/authSetup", + setup = "/setup", table = "/table", tableGroup = "/tableGroup", diff --git a/src/theme/components.tsx b/src/theme/components.tsx index 3621e06f..b6d86e8f 100644 --- a/src/theme/components.tsx +++ b/src/theme/components.tsx @@ -796,6 +796,15 @@ export const components = (theme: Theme): ThemeOptions => { }, }, }, + + MuiAlertTitle: { + styleOverrides: { + root: { + ...theme.typography.subtitle2, + lineHeight: "1.5rem", + }, + }, + }, }, }; }; diff --git a/yarn.lock b/yarn.lock index 52c24415..07f8f27d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2672,10 +2672,10 @@ use-debounce "^3.4.3" yup "^0.32.9" -"@rowy/multiselect@^0.1.4": - version "0.1.4" - resolved "https://registry.yarnpkg.com/@rowy/multiselect/-/multiselect-0.1.4.tgz#b95045ed56949a1560a8439f269529cd50908dfb" - integrity sha512-jhDq2oRiV3cGMJ4nRzIkWKGxrbtQBKecGssOlOJjLqqR/O4FNKO1UwR4PA7WsX69zuo18sC7ndqr7M0gN6sEHw== +"@rowy/multiselect@^0.1.5": + version "0.1.5" + resolved "https://registry.yarnpkg.com/@rowy/multiselect/-/multiselect-0.1.5.tgz#2d8d6ccc70e4c5264644804a319626db0f7b2158" + integrity sha512-tOPrq87mlAHcw41OnqbmoiPTYJfIHZlKoRHyBrUwrwuAC51wfwYakeg8owScVbLcO+rIFrs4b2Ak5/Bme9vQ9Q== "@sindresorhus/is@^0.14.0": version "0.14.0"