From 44250c96e81e5777daa3eabb5338c180f64dbbcd Mon Sep 17 00:00:00 2001 From: Eugene Kotsarev Date: Mon, 9 Dec 2024 12:12:23 +0300 Subject: [PATCH] fixes --- .../src/components/alert/alert.module.scss | 20 +++---------------- utils/vara-ui/src/components/alert/alert.tsx | 16 +++++++-------- utils/vara-ui/src/components/alert/icons.tsx | 7 +++++-- utils/vara-ui/src/components/alert/index.ts | 4 ++-- 4 files changed, 17 insertions(+), 30 deletions(-) diff --git a/utils/vara-ui/src/components/alert/alert.module.scss b/utils/vara-ui/src/components/alert/alert.module.scss index df0850b78..97aa7fb9c 100644 --- a/utils/vara-ui/src/components/alert/alert.module.scss +++ b/utils/vara-ui/src/components/alert/alert.module.scss @@ -19,7 +19,6 @@ flex-direction: column; background-color: #fff; box-shadow: 0 10px 20px 0 rgba(92, 92, 92, 0.15); - user-select: none; } .header { @@ -147,6 +146,7 @@ font-size: 17px; font-weight: 700; line-height: 1.4; + color: #000000; } .body, @@ -158,15 +158,6 @@ top: 16px; right: 16px; } - - &.success, - &.error, - &.info, - &.loading { - .title { - color: #000; - } - } } // Theming @@ -219,13 +210,8 @@ // Variants .notification { - &.success, - &.error, - &.info, - &.loading { - .title { - color: #fff; - } + .title { + color: #fff; } } } diff --git a/utils/vara-ui/src/components/alert/alert.tsx b/utils/vara-ui/src/components/alert/alert.tsx index 6c8221546..6ad903e0d 100644 --- a/utils/vara-ui/src/components/alert/alert.tsx +++ b/utils/vara-ui/src/components/alert/alert.tsx @@ -4,18 +4,16 @@ import styles from './alert.module.scss'; import CrossSVG from '../../assets/images/cross.svg?react'; import { alertIcons } from './icons.tsx'; -type IAlertVariants = 'alert' | 'notification'; -type IAlertTypes = 'info' | 'error' | 'loading' | 'success'; -type IAlertIcons = Record>; +type AlertVariants = 'alert' | 'notification'; +type AlertTypes = 'info' | 'error' | 'loading' | 'success'; type Options = { - type: IAlertTypes; - variant?: IAlertVariants; + type: AlertTypes; + variant?: AlertVariants; style?: CSSProperties; title?: string; timeout?: number; isClosed?: boolean; - icons?: IAlertIcons; }; type AlertType = { @@ -32,12 +30,12 @@ type Props = { function Alert({ alert, close }: Props) { const { content, options, footer } = alert; - const { variant = 'alert', type = 'info', title, style, isClosed, icons = alertIcons } = options; + const { variant = 'alert', type = 'info', title, style, isClosed } = options; return (
- {type &&
{icons[variant][type]}
} + {type &&
{alertIcons[variant][type]}
}

{title || type}

@@ -56,4 +54,4 @@ function Alert({ alert, close }: Props) { } export { Alert }; -export type { Props as AlertProps, IAlertVariants, IAlertTypes, IAlertIcons }; +export type { Props as AlertProps, AlertVariants, AlertTypes }; diff --git a/utils/vara-ui/src/components/alert/icons.tsx b/utils/vara-ui/src/components/alert/icons.tsx index 0b6715a93..4f69913b2 100644 --- a/utils/vara-ui/src/components/alert/icons.tsx +++ b/utils/vara-ui/src/components/alert/icons.tsx @@ -1,11 +1,14 @@ -import type { IAlertIcons } from './alert.tsx'; +import { ReactNode } from 'react'; import SuccessIcon from '../../assets/images/success.svg?react'; import ErrorIcon from '../../assets/images/error.svg?react'; import InfoIcon from '../../assets/images/info.svg?react'; import LoadingIcon from '../../assets/images/loading.svg?react'; import WarningIcon from '../../assets/images/warning.svg?react'; +import type { AlertTypes, AlertVariants } from './alert.tsx'; -const alertIcons: IAlertIcons = { +type AlertIcons = Record>; + +const alertIcons: AlertIcons = { alert: { success: , error: , diff --git a/utils/vara-ui/src/components/alert/index.ts b/utils/vara-ui/src/components/alert/index.ts index 74dc71d2a..1a9f546e6 100644 --- a/utils/vara-ui/src/components/alert/index.ts +++ b/utils/vara-ui/src/components/alert/index.ts @@ -1,6 +1,6 @@ -import { Alert, AlertProps, IAlertTypes, IAlertIcons, IAlertVariants } from './alert'; +import { Alert, AlertProps, AlertTypes, AlertVariants } from './alert'; import alertStyles from './alert.module.scss'; import { alertIcons } from './icons.tsx'; export { Alert, alertStyles, alertIcons }; -export type { AlertProps, IAlertTypes, IAlertIcons, IAlertVariants }; +export type { AlertProps, AlertTypes, AlertVariants };