@engie-group/fluid-design-system-react/src/components/toast/types.ts

Fluid Design System React

import React from 'react';

export interface IToastProps {
  /**
   * Toast id
   */
  id: string;
  /**
   * Toast creation date
   */
  createdAt?: number;
  /**
   * Gauge accessible hidden label.
   * @example "The toast will be automatically closed in 10s"
   */
  gaugeLabel?: string;
  /**
   * Icon :<br>
   * <a href="https://material.io/resources/icons/" target="_blank">Material icons</a>
   */
  iconName?: string;
  /**
   * Toast title
   */
  title?: string;
  /**
   * Toast content
   */
  children: React.ReactNode;

  isInverse?: boolean;
  /**
   * Whether toast has a close icon or not
   */
  hasCloseIcon?: boolean;
  /**
   * Fired on toast close
   * @param id id of the toast
   */
  onClose?: (id: string) => void;
  /**
   * Whether toast should dismiss after some time elapsed
   */
  shouldDismiss?: boolean;
  /**
   * Time (in milliseconds) after which the toast will dismiss
   */
  dismissAfter?: number;

  /**
   * Role of the toast
   */
  ariaProps?: {
    role: 'status' | 'alert';
    'aria-live': 'assertive' | 'off' | 'polite';
  };
  /**
   * Function to close the toast by id
   * @param id
   */
  closeToast?: (id: string) => void;
  /**
   * Optional additional className
   */
  className?: string;
}

export type TToastOptions = Partial<IToastProps>;

export type TToastHandler = (message: string, options?: TToastOptions) => string;

export enum EActionType {
  // eslint-disable-next-line no-unused-vars
  ADD_TOAST,
  // eslint-disable-next-line no-unused-vars
  UPDATE_TOAST,
  // eslint-disable-next-line no-unused-vars
  UPSERT_TOAST,
  // eslint-disable-next-line no-unused-vars
  REMOVE_TOAST,
  // eslint-disable-next-line no-unused-vars
  REMOVE_ALL_TOAST
}

export type TAction =
  | {
      type: EActionType.ADD_TOAST;
      toast: IToastProps;
    }
  | {
      type: EActionType.UPSERT_TOAST;
      toast: IToastProps;
    }
  | {
      type: EActionType.UPDATE_TOAST;
      toast: Partial<IToastProps>;
    }
  | {
      type: EActionType.REMOVE_TOAST;
      toastId?: string;
    }
  | {
      type: EActionType.REMOVE_ALL_TOAST;
    };

export interface IToastContainerProps {
  /**
   * Whether the ToastContainer takes up the whole width of the window or not
   */
  type?: 'default' | 'full-width';
}