@neo4j-ndl/react
Version:
React implementation of Neo4j Design System
124 lines (123 loc) • 5.19 kB
TypeScript
/**
*
* Copyright (c) "Neo4j"
* Neo4j Sweden AB [http://neo4j.com]
*
* This file is part of Neo4j.
*
* Neo4j is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import React, { type ReactNode } from 'react';
import { type ExternalToast as SonnerExternalToast, toast as sonnerToast, type ToasterProps as SonnerToasterProps } from 'sonner';
import { type HtmlAttributes } from '../_common/types';
type ToastVariants = 'neutral' | 'success' | 'danger' | 'loading-spinner' | 'progress-bar';
type ToastCommandVariants = 'neutral' | 'success' | 'danger' | 'loadingSpinner' | 'progressBar';
type ToastId = string | number;
interface BaseToastProps {
/** Reference to the toast custom container. */
ref?: React.ForwardedRef<HTMLDivElement>;
/** If `true` a close button will be displayed in the toast. */
isCloseable?: boolean;
/** If `true` the toast will close when the action button is triggered. */
shouldCloseOnAction?: boolean;
/** Function that will be called when the toast is closed. */
onClose?: (id: ToastId) => void;
/** If true the toast will close automatically after a certain time. */
shouldAutoClose?: boolean;
/** Function that will be called when the toast is automatically closed. */
onAutoClose?: (id: ToastId) => void;
/** If set an action button will be displayed. The value here will be displayed
* in the action button. If this is set the toast property `shouldAutoClose` will
* automatically be set to `false` unless overridden. */
actionLabel?: string;
/** Function that will be called when the action button is clicked. */
onAction?: (id: ToastId) => void;
/** If a dev wishes to set the underlying framework props (Sonner Toast).
* https://sonner.emilkowal.ski/toast#api-reference */
sonnerToastProps?: SonnerExternalToast;
/** HTML attributes */
htmlAttributes?: HtmlAttributes<'div'>;
}
interface ToastNeutralProps extends BaseToastProps {
icon?: ReactNode;
}
interface ToastSuccessProps extends BaseToastProps {
}
interface ToastDangerProps extends BaseToastProps {
}
interface ToastLoadingSpinnerProps extends BaseToastProps {
}
interface ToastProgressBarProps extends BaseToastProps {
icon?: ReactNode;
initialProgressBarValue?: number;
}
type ToastVariantsProps = ToastNeutralProps | ToastSuccessProps | ToastDangerProps | ToastLoadingSpinnerProps | ToastProgressBarProps;
interface ToasterProps extends Pick<SonnerToasterProps, 'position' | 'visibleToasts' | 'className'> {
sonnerToasterProps?: SonnerToasterProps;
}
declare const Toaster: (props: ToasterProps) => import("react/jsx-runtime").JSX.Element;
type ToastElement = ToastVariantsProps & {
icon: ReactNode;
id: ToastId;
variant: ToastVariants;
text: ReactNode;
initialProgressBarValue?: number;
};
declare const Toast: React.ForwardRefExoticComponent<(Omit<ToastNeutralProps & {
icon: ReactNode;
id: ToastId;
variant: ToastVariants;
text: ReactNode;
initialProgressBarValue?: number;
}, "ref"> | Omit<ToastSuccessProps & {
icon: ReactNode;
id: ToastId;
variant: ToastVariants;
text: ReactNode;
initialProgressBarValue?: number;
}, "ref"> | Omit<ToastDangerProps & {
icon: ReactNode;
id: ToastId;
variant: ToastVariants;
text: ReactNode;
initialProgressBarValue?: number;
}, "ref"> | Omit<ToastLoadingSpinnerProps & {
icon: ReactNode;
id: ToastId;
variant: ToastVariants;
text: ReactNode;
initialProgressBarValue?: number;
}, "ref"> | Omit<ToastProgressBarProps & {
icon: ReactNode;
id: ToastId;
variant: ToastVariants;
text: ReactNode;
initialProgressBarValue?: number;
}, "ref">) & React.RefAttributes<HTMLDivElement>>;
interface Toast {
neutral: (text: ReactNode, props?: ToastNeutralProps) => ToastId;
success: (text: ReactNode, props?: ToastSuccessProps) => ToastId;
danger: (text: ReactNode, props?: ToastDangerProps) => ToastId;
/**
* @deprecated Use progressBar instead.
*/
loadingSpinner: (text: ReactNode, props?: ToastLoadingSpinnerProps) => ToastId;
progressBar: (text: ReactNode, props?: ToastProgressBarProps) => ToastId;
updateProgressBarValue: (id: ToastId, value: number) => void;
close: (id: ToastId) => void;
sonnerToast: typeof sonnerToast;
}
declare const toast: Toast;
export { Toaster, toast };
export type { ToasterProps, ToastVariants, ToastCommandVariants, ToastNeutralProps, ToastSuccessProps, ToastDangerProps, ToastLoadingSpinnerProps, ToastProgressBarProps, ToastVariantsProps, ToastElement, };