/** * Copyright IBM Corp. 2020, 2022 * * This source code is licensed under the Apache-2.0 license found in the * LICENSE file in the root directory of this source tree. */ import { Link } from '@carbon/react'; import React, { RefObject } from 'react'; type Themes = 'light' | 'dark'; type DateTimeStyles = 'long' | 'short' | 'narrow'; interface Link { url: string; text: string; } interface Data { id?: string | number; type?: 'error' | 'warning' | 'success' | 'informational'; timestamp?: Date; title?: string; description?: string; link?: Link; unread?: boolean; onNotificationClick?: () => void; } export interface NotificationsPanelProps { /** * Provide an optional class to be applied to the containing node. */ className?: string; /** * Array of data for Notifications component to render */ data: Data[]; /** * The language for each notification's time stamp. * Used with `dateTimeStyle`. */ dateTimeLocale?: string; /** * The date/time format for each notification's time stamp. * Used with `dateTimeLocale`. * * E.g. `long` as "6 minutes ago", `short` as "6m ago". */ dateTimeStyle?: DateTimeStyles; /** * Sets the `days ago` label text * * @deprecated use `dateTimeLocale` instead. */ daysAgoText?: (value: number) => string; /** * Label for Dismiss all button */ dismissAllLabel?: string; /** * Label for Dismiss single notification icon button */ dismissSingleNotificationIconDescription?: string; /** * Optional: Determines if the `Do not disturb` toggle is on or off when the component is rendered */ doNotDisturbDefaultToggled?: boolean; /** * Optional: Label for Do not disturb toggle */ doNotDisturbLabel?: string; /** * Sets the empty state label text when there are no notifications */ emptyStateLabel?: string; /** * Sets the `hour ago` label text * * @deprecated use `dateTimeLocale` instead. */ hourAgoText?: (value: number) => string; /** * Sets the `hours ago` label text * * @deprecated use `dateTimeLocale` instead. */ hoursAgoText?: (value: number) => string; /** * Determines the theme of the empty state's illustration. */ illustrationTheme: Themes; /** * Sets the `minute ago` label text * * @deprecated use `dateTimeLocale` instead. */ minuteAgoText?: (value: number) => string; /** * Sets the `minutes ago` label text * * @deprecated use `dateTimeLocale` instead. */ minutesAgoText?: (value: number) => string; /** * Sets the `month ago` label text * * @deprecated use `dateTimeLocale` instead. */ monthAgoText?: (value: number) => string; /** * Sets the `months ago` label text * * @deprecated use `dateTimeLocale` instead. */ monthsAgoText?: (value: number) => string; /** * Sets the `now` label text * * @deprecated use `dateTimeLocale` instead. */ nowText?: string; /** * Optional function called after clicking outside of the panel. */ onClickOutside?: () => void; /** * Optional function called after clicking the "Dismiss all" button. */ onDismissAllNotifications?: () => void; /** * Optional function called after clicking a notification's "X" button. */ onDismissSingleNotification?: (prop: any) => void; /** * Optional function called after toggling "Do not disturb". */ onDoNotDisturbChange?: (prop: any) => void; /** * Optional function called after clicking settings / gear icon button. */ onSettingsClick?: () => void; /** * Optional function called after clicking the "View all" button. */ onViewAllClick?: () => void; /** * Determines whether the notifications panel should render or not */ open: boolean; /** * Sets the previous label text */ previousLabel?: string; /** * Sets the `read less` label text */ readLessLabel?: string; /** * Sets the `read more` label text */ readMoreLabel?: string; /** * Sets the `seconds ago` label text * * @deprecated use `dateTimeLocale` instead. */ secondsAgoText?: (value: number) => string; /** * Sets the settings icon description text */ settingsIconDescription?: string; /** * Sets the title for the Notifications panel */ title?: string; /** * Sets the today label text */ todayLabel?: string; /** * Reference to trigger button */ triggerButtonRef?: RefObject; /** * Sets the View all button text */ viewAllLabel?: (value: number) => string; /** * Sets the `year ago` label text * * @deprecated use `dateTimeLocale` instead. */ yearAgoText?: (value: number) => string; /** * Sets the `years ago` label text * * @deprecated use `dateTimeLocale` instead. */ yearsAgoText?: (value: number) => string; /** * Sets the `Yesterday at` label text * * @deprecated use `dateTimeLocale` instead. */ yesterdayAtText?: (value: number) => string; /** * Sets the yesterday label text */ yesterdayLabel?: string; } /** * The `NotificationsPanel` sets expectations on the behavior for notifications, * allowing the user to view and interact with them all in one place. * * **To adopt the new localization:** * * **Step 1:** Provide a locale to the `dateTimeLocale` prop, such as "de" or "fr-CA". * * **Step 2:** Remove the now _deprecated_ props: `daysAgoText`, * `hourAgoText`, `hoursAgoText`, `minuteAgoText`, `minutesAgoText`, * `monthAgoText`, `monthsAgoText`, `nowText`, `secondsAgoText`, * `yearAgoText`, `yearsAgoText`, `yesterdayAtText`. * * If you do not provide a locale, the deprecated props will be applied instead. */ export declare const NotificationsPanel: React.ForwardRefExoticComponent>; export {}; //# sourceMappingURL=NotificationsPanel.d.ts.map