@cube-dev/ui-kit 0.0.0-canary-4e8aabc → 0.0.0-canary-b6a8194

package/es/utils/react/useCombinedRefs.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/es/utils/react/useId.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/es/utils/react/useLayoutEffect.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/es/utils/react/wrapNodeIfPlain.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/es/utils/transitions.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/es/utils/tree.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/es/utils/warnings.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-4e8aabc
+ * @cube-dev/ui-kit v0.0.0-canary-b6a8194
  * Released under the MIT license.
  */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.0.0-canary-4e8aabc",
+  "version": "0.0.0-canary-b6a8194",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"
@@ -64,6 +64,7 @@
     "email-validator": "^2.0.4",
     "prismjs": "^1.25.0",
     "react-is": "^17.0.0",
+    "react-keyed-flatten-children": "1.3.0",
     "react-transition-group": "^4.4.2",
     "tiny-invariant": "^1.2.0",
     "valid-url": "^1.0.9"

package/types/_internal/hooks/index.d.ts

@@ -1 +1,5 @@
 export * from './use-deprecation-warning';
+export * from './use-event';
+export * from './use-sync-ref';
+export * from './use-chained-callback';
+export * from './use-timer';

package/types/_internal/hooks/use-chained-callback.d.ts

@@ -0,0 +1 @@
+export declare function useChainedCallback(...callbacks: (((...args: any) => any) | null | undefined | boolean)[]): (...args: any[]) => void;

package/types/_internal/hooks/use-event.d.ts

@@ -0,0 +1,7 @@
+/**
+ * useEvent shim from the latest React RFC.
+ *
+ * @see https://github.com/reactjs/rfcs/pull/220
+ * @see https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md#internal-implementation
+ */
+export declare function useEvent<Func extends (...args: Args) => Result, Args extends Parameters<any> = Parameters<Func>, Result extends ReturnType<any> = ReturnType<Func>>(callback: Func): (...args: Args) => Result;

package/types/_internal/hooks/use-sync-ref.d.ts

@@ -0,0 +1,2 @@
+import { MutableRefObject } from 'react';
+export declare function useSyncRef<T>(value: T): MutableRefObject<T>;

package/types/_internal/hooks/use-timer/index.d.ts

@@ -0,0 +1,2 @@
+export * from './timer';
+export * from './use-timer';

package/types/_internal/hooks/use-timer/timer.d.ts

@@ -0,0 +1,15 @@
+export declare class Timer {
+    private readonly callback;
+    private readonly delay;
+    private remaining;
+    private timerId;
+    private startTime;
+    private _status;
+    get status(): "paused" | "running" | "stopped";
+    private set status(value);
+    constructor(callback: () => unknown, delay: number);
+    reset(): void;
+    pause(): void;
+    resume(): void;
+    private clear;
+}

package/types/_internal/hooks/use-timer/use-timer.d.ts

@@ -0,0 +1,10 @@
+import { Timer } from './timer';
+export declare type UseTimerProps = {
+    callback?: () => void;
+    delay?: number | null;
+    isDisabled?: boolean;
+    timer?: Timer | null;
+};
+export declare function useTimer(props?: UseTimerProps): {
+    readonly timer: Timer | null;
+};

package/types/components/actions/Button/Button.d.ts

@@ -4,7 +4,7 @@ export interface CubeButtonProps extends CubeActionProps {
     icon?: ReactNode;
     isLoading?: boolean;
     isSelected?: boolean;
-    type?: 'primary' | 'default' | 'danger' | 'link' | 'clear' | 'outline' | 'neutral' | string;
+    type?: 'primary' | 'default' | 'danger' | 'link' | 'clear' | 'outline' | 'neutral' | (string & {});
     size?: 'small' | 'default' | 'large' | (string & {});
 }
 export declare function provideStyles({ size, type, theme, isLoading, icon, children, label, }: {

package/types/components/forms/Form/Field.d.ts

@@ -28,10 +28,6 @@ export interface CubeFieldProps extends OptionalFieldBaseProps {
     name?: string[] | string;
     /** Whether the field is hidden. */
     isHidden?: boolean;
-    /** Whether the field is disabled. */
-    isDisabled?: boolean;
-    /** Whether the field is loading. */
-    isLoading?: boolean;
     styles?: Styles;
     labelPosition?: LabelPosition;
     labelStyles?: Styles;

package/types/components/overlays/AlertDialog/AlertDialogApiProvider.d.ts

@@ -16,7 +16,7 @@ export declare function AlertDialogApiProvider(props: any): JSX.Element;
  * ***Important*** it's commonly a bad practice when you open multiple dialogs in a row;
  * that means this api will reject all dialogs when there is already open one
  *
- * @example Example with calling as a side effect
+ * @example calling in a side effect
  * const alertDialogAPI = useAlertDialogAPI();
  *
  * useEffect(() => {

package/types/components/overlays/NewNotifications/Bar/FloatingNotification.d.ts

@@ -0,0 +1,12 @@
+import { Key } from 'react';
+import { CubeNotifyApiPropsWithID } from '../types';
+import { NotificationItemNode, NotificationsListState } from '../hooks';
+export declare type FloatingNotificationProps = {
+    id: Key;
+    isDisabledTimer: boolean;
+    onRemoveNotification: (id: Key) => void;
+    onDismissNotification: (id: Key) => void;
+    item: NotificationItemNode<CubeNotifyApiPropsWithID>;
+    state: NotificationsListState<CubeNotifyApiPropsWithID>;
+};
+export declare const FloatingNotification: import("react").NamedExoticComponent<FloatingNotificationProps>;

package/types/components/overlays/NewNotifications/Bar/NotificationsBar.d.ts

@@ -0,0 +1,13 @@
+import { Key } from 'react';
+import { CubeNotifyApiPropsWithID } from '../types';
+import { CollectionChildren } from '../hooks';
+export declare type NotificationsBarProps = {
+    items: Iterable<CubeNotifyApiPropsWithID>;
+    children: CollectionChildren<CubeNotifyApiPropsWithID>;
+    onRemoveNotification: (id: Key) => void;
+    onDismissNotification: (id: Key) => void;
+};
+export declare function NotificationsBar(props: NotificationsBarProps): JSX.Element;
+export declare namespace NotificationsBar {
+    var Item: (props: CubeNotifyApiPropsWithID) => null;
+}

package/types/components/overlays/NewNotifications/Bar/TransitionComponent.d.ts

@@ -0,0 +1,4 @@
+import { PropsWithChildren } from 'react';
+import type { TransitionProps } from 'react-transition-group/Transition';
+export declare type TransitionComponentProps = PropsWithChildren<Partial<TransitionProps>>;
+export declare function TransitionComponent(props: TransitionComponentProps): JSX.Element;

package/types/components/overlays/NewNotifications/Bar/index.d.ts

@@ -0,0 +1 @@
+export * from './NotificationsBar';

package/types/components/overlays/NewNotifications/Dialog/NotificationsDialogTrigger.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { CubeDialogProps, CubeDialogTriggerProps } from '../../Dialog';
+import { CubeNotifyApiPropsWithID } from '../types';
+export declare type NotificationsDialogTriggerProps = Omit<CubeDialogTriggerProps, 'type'> & {
+    onCloseNotificationInBar?: (props: CubeNotifyApiPropsWithID) => void;
+};
+export declare function NotificationsDialogTrigger(props: NotificationsDialogTriggerProps): JSX.Element;
+export declare type NotificationsDialogProps = {
+    title?: ReactNode;
+} & CubeDialogProps;
+export declare function NotificationsDialog(props: NotificationsDialogProps): JSX.Element;

package/types/components/overlays/NewNotifications/Dialog/index.d.ts

@@ -0,0 +1 @@
+export * from './NotificationsDialogTrigger';

package/types/components/overlays/NewNotifications/Notification.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { CubeNotifyApiProps } from './types';
+export declare function Notification(props: CubeNotifyApiProps): null;
+export declare namespace Notification {
+    var Success: (props: CubeNotifyApiProps) => JSX.Element;
+    var Danger: (props: CubeNotifyApiProps) => JSX.Element;
+    var Attention: (props: CubeNotifyApiProps) => JSX.Element;
+}

package/types/components/overlays/NewNotifications/NotificationView/NotificationAction.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+import { CubeButtonProps } from '../../../actions';
+export declare type NotificationActionProps = PropsWithChildren<{
+    type?: 'primary' | 'secondary';
+    /**
+     * @default false
+     */
+    disableCloseOnAction?: boolean;
+}> & Omit<CubeButtonProps, 'type' | 'size' | 'mods'>;
+export declare function NotificationAction(props: NotificationActionProps): JSX.Element;

package/types/components/overlays/NewNotifications/NotificationView/NotificationCloseButton.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare type NotificationCloseButtonProps = {
+    onPress: () => void;
+    isHovered: boolean;
+    isFocused: boolean;
+};
+export declare const NotificationCloseButton: import("react").NamedExoticComponent<NotificationCloseButtonProps>;

package/types/components/overlays/NewNotifications/NotificationView/NotificationDescription.d.ts

@@ -0,0 +1,8 @@
+import { HTMLAttributes } from 'react';
+import { NotificationProps } from './types';
+export declare type NotificationDescriptionProps = {
+    description: NotificationProps['description'];
+} & HTMLAttributes<HTMLElement>;
+export declare const NotificationDescription: import("react").NamedExoticComponent<{
+    description: NotificationProps['description'];
+} & HTMLAttributes<HTMLElement>>;

package/types/components/overlays/NewNotifications/NotificationView/NotificationFooter.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { CubeNotificationProps } from '../types';
+interface NotificationFooterProps {
+    hasDescription: boolean;
+    actions: CubeNotificationProps['actions'];
+    onClose: () => void;
+    onDismiss: () => void;
+}
+export declare const NotificationFooter: React.NamedExoticComponent<NotificationFooterProps>;
+export {};

package/types/components/overlays/NewNotifications/NotificationView/NotificationHeader.d.ts

@@ -0,0 +1,8 @@
+import { HTMLAttributes } from 'react';
+import { NotificationProps } from './types';
+export declare type NotificationHeaderProps = {
+    header: NotificationProps['header'];
+} & HTMLAttributes<HTMLElement>;
+export declare const NotificationHeader: import("react").NamedExoticComponent<{
+    header: NotificationProps['header'];
+} & HTMLAttributes<HTMLElement>>;

package/types/components/overlays/NewNotifications/NotificationView/NotificationIcon.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { NotificationIconProps } from './types';
+export declare const NotificationIcon: import("react").NamedExoticComponent<NotificationIconProps>;

package/types/components/overlays/NewNotifications/NotificationView/NotificationProvider.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from 'react';
+interface NotificationContextType {
+    onClose?: () => void;
+}
+export declare function NotificationProvider(props: PropsWithChildren<NotificationContextType>): JSX.Element;
+export declare function useNotificationContext(): NotificationContextType;
+export {};

package/types/components/overlays/NewNotifications/NotificationView/NotificationView.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const NotificationView: import("react").ForwardRefExoticComponent<{
+    qa?: string | undefined;
+    attributes?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    styles?: import("../../../../tasty").Styles | undefined;
+    timer?: import("../../../../_internal").Timer | null | undefined;
+    onClose?: (() => void) | undefined;
+} & import("../types").BaseNotificationProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/components/overlays/NewNotifications/NotificationView/index.d.ts

@@ -0,0 +1,2 @@
+export * from './NotificationView';
+export * from './NotificationAction';

package/types/components/overlays/NewNotifications/NotificationView/types.d.ts

@@ -0,0 +1,16 @@
+import type { ReactNode, HTMLAttributes } from 'react';
+import type { CubeNotificationType } from '../types';
+import { Styles } from '../../../../tasty';
+import { Timer } from '../../../../_internal';
+import { BaseNotificationProps } from '../types';
+export declare type NotificationProps = {
+    qa?: string;
+    attributes?: HTMLAttributes<HTMLDivElement>;
+    styles?: Styles;
+    timer?: Timer | null;
+    onClose?: () => void;
+} & BaseNotificationProps;
+export declare type NotificationIconProps = {
+    type: CubeNotificationType;
+    icon?: ReactNode;
+};

package/types/components/overlays/NewNotifications/NotificationsContext/NotificationsProvider.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren, RefObject } from 'react';
+import { CubeNotificationsApi, CubeNotifyApiPropsWithID } from '../types';
+export declare const NotificationsContext: import("react").Context<{
+    api: CubeNotificationsApi;
+    addOnDismissListener: (listener: (notification: CubeNotifyApiPropsWithID) => void) => () => void;
+} | null>;
+export declare function NotificationsProvider(props: PropsWithChildren<{
+    rootRef: RefObject<HTMLElement | null> | null;
+}>): JSX.Element;

package/types/components/overlays/NewNotifications/NotificationsContext/index.d.ts

@@ -0,0 +1 @@
+export { NotificationsProvider, NotificationsContext, } from './NotificationsProvider';

package/types/components/overlays/NewNotifications/NotificationsContext/use-notifications-api.d.ts

@@ -0,0 +1 @@
+export declare function useNotificationsApi(): import("..").CubeNotificationsApi;

package/types/components/overlays/NewNotifications/NotificationsContext/use-notifications.d.ts

@@ -0,0 +1,8 @@
+import { Key, RefObject } from 'react';
+import { CubeNotificationsApi, CubeNotifyApiPropsWithID } from '../types';
+export declare function useNotifications(rootRef: RefObject<HTMLElement | null> | null): {
+    readonly api: CubeNotificationsApi;
+    readonly toasts: CubeNotifyApiPropsWithID[];
+    readonly onDismissNotification: (id: Key) => void;
+    readonly addOnDismissListener: (listener: (notification: CubeNotifyApiPropsWithID) => void) => () => void | undefined;
+};

package/types/components/overlays/NewNotifications/NotificationsList.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { CollectionElement } from '@react-types/shared';
+import type { CubeNotificationProps } from './types';
+import { CollectionChildren } from './hooks';
+export declare type NotificationsListProps<T> = {
+    items?: T[] | readonly T[];
+    children: CollectionChildren<T>;
+} & (NotificationsListFactory<T> | NotificationsListStatic);
+export declare type NotificationsListFactory<T> = {
+    items: T[] | readonly T[];
+    children: (item: T) => CollectionElement<CubeNotificationProps>;
+};
+export declare type NotificationsListStatic = {
+    items?: 'You must either use factory or static children';
+    children: CollectionElement<CubeNotificationProps> | CollectionElement<CubeNotificationProps>[];
+};
+export declare function NotificationsList<T extends object>(props: NotificationsListProps<T>): JSX.Element;
+export declare namespace NotificationsList {
+    var Item: (props: CubeNotificationProps) => null;
+}

package/types/components/overlays/NewNotifications/hooks/index.d.ts

@@ -0,0 +1,5 @@
+export * from './use-notifications-list';
+export * from './use-notification-list-item';
+export * from './use-notifications-api';
+export * from './use-notifications-observer';
+export * from './types';

package/types/components/overlays/NewNotifications/hooks/types.d.ts

@@ -0,0 +1,10 @@
+import type { ListState } from '@react-stately/list';
+import type { Collection, CollectionElement, Node } from '@react-types/shared';
+import type { CubeNotificationProps } from '../types';
+export declare type CollectionChildren<T, R = T> = CollectionElement<R> | CollectionElement<R>[] | ((item: T) => CollectionElement<R>);
+export declare type NotificationItemNode<T> = Omit<Node<CubeNotificationProps>, 'props'> & {
+    props: T;
+};
+export declare type NotificationsListState<T> = Omit<ListState<T>, 'collection'> & {
+    collection: Collection<NotificationItemNode<T>>;
+};

package/types/components/overlays/NewNotifications/hooks/use-notification-list-item.d.ts

@@ -0,0 +1,9 @@
+import type { Key, MutableRefObject } from 'react';
+import { SelectableItemAria } from '@react-aria/selection';
+import type { ListState } from '@react-stately/list';
+export declare type UseNotificationListItemPropsType<T extends object> = {
+    key: Key;
+    ref: MutableRefObject<HTMLElement | null>;
+    state: ListState<T>;
+};
+export declare function useNotificationListItem<T extends object>(props: UseNotificationListItemPropsType<T>): SelectableItemAria;

package/types/components/overlays/NewNotifications/hooks/use-notifications-api.d.ts

@@ -0,0 +1 @@
+export declare function useNotificationsApi(): import("..").CubeNotificationsApi;

package/types/components/overlays/NewNotifications/hooks/use-notifications-list.d.ts

@@ -0,0 +1,12 @@
+import type { HTMLAttributes, MutableRefObject } from 'react';
+import { CollectionChildren, NotificationsListState } from './types';
+export declare type UseNotificationsListPropsType<T, R> = {
+    items?: Iterable<T>;
+    children: CollectionChildren<T, R>;
+    ref: MutableRefObject<HTMLElement | null>;
+};
+export declare type UseNotificationsListReturnType<R> = {
+    listProps: HTMLAttributes<HTMLElement>;
+    state: NotificationsListState<R>;
+};
+export declare function useNotificationsList<T extends object, R>(props: UseNotificationsListPropsType<T, R>): UseNotificationsListReturnType<R>;

package/types/components/overlays/NewNotifications/hooks/use-notifications-observer.d.ts

@@ -0,0 +1,2 @@
+import { CubeNotifyApiPropsWithID } from '../types';
+export declare function useNotificationsObserver(callback: (notification: CubeNotifyApiPropsWithID) => void): void;

package/types/components/overlays/NewNotifications/index.d.ts

@@ -0,0 +1,8 @@
+export { NotificationsProvider } from './NotificationsContext';
+export * from './NotificationsList';
+export * from './hooks';
+export { NotificationAction } from './NotificationView';
+export * from './Dialog';
+export type { NotificationActionProps } from './NotificationView';
+export type { CubeNotificationType, CubeNotifyApiProps, CubeNotificationsApi, CubeNotificationMeta, CubeNotificationsApiNotifyCallback, CubeNotificationsApiNotifyAction, CubeNotifyApiPropsWithID, } from './types';
+export * from './Notification';

package/types/components/overlays/NewNotifications/types.d.ts

@@ -0,0 +1,87 @@
+import { Key, ReactChild, ReactElement, ReactFragment, ReactNode } from 'react';
+import { NotificationAction, NotificationActionProps } from './NotificationView';
+export declare type CubeNotificationType = 'success' | 'danger' | 'attention';
+export declare type NotificationActionComponent = ReactElement<NotificationActionProps, typeof NotificationAction>;
+declare type NotificationActionType = NotificationActionComponent | [NotificationActionComponent] | [NotificationActionComponent, NotificationActionComponent];
+declare type NotificationActionCallbackArg = {
+    onClose: () => void;
+    onDismiss: () => void;
+};
+export declare type BaseNotificationProps = {
+    /**
+     * @default 'attention'
+     */
+    type?: CubeNotificationType;
+    /**
+     * The delay before the notification hides (in milliseconds) If set to `null`, it will never dismiss.
+     *
+     * @default 5000
+     */
+    duration?: number | null;
+    /**
+     * ID of the notification. Mostly used when you need to prevent duplicate. By default, we generate a unique id for each notification
+     */
+    id?: Key;
+    /**
+     * If true, notification will have the close button.
+     * @default true
+     */
+    isDismissible?: boolean;
+    /**
+     * Callback fires when a notificaiton is dismissed either by clicking the close button or the timeout.
+     */
+    onDismiss?: () => void;
+    /**
+     * Callback fires when a notificaiton is closed by interacting with the notification (via actions)
+     */
+    onClose?: () => void;
+    /**
+     * When set to false, notification will not appear in `<NotificaitonsDialog />` when dismissed
+     * @default true
+     */
+    putNotificationInDropdownOnDismiss?: boolean;
+    /**
+     * Title of the notification
+     */
+    header?: ReactChild | ReactFragment;
+    description: ReactChild | ReactFragment;
+    /**
+     * Custom Icon for the notification
+     */
+    icon?: ReactNode;
+    /**
+     * Custom Actions in the notification
+     */
+    actions?: ((arg: NotificationActionCallbackArg) => NotificationActionType) | NotificationActionType;
+};
+export declare type CubeNotificationProps = BaseNotificationProps & EitherDismissibleOrNotNotification;
+export declare type EitherDismissibleOrNotNotification = DismissibleNotification | NonDismissibleNotification;
+declare type DismissibleNotification = {
+    isDismissible?: true;
+    onDismiss?: () => void;
+    duration?: number;
+};
+declare type NonDismissibleNotification = {
+    isDismissible: false;
+    onDismiss?: never | undefined;
+    duration?: null;
+};
+export declare type CubeNotifyApiProps = {
+    meta?: CubeNotificationMeta;
+} & CubeNotificationProps;
+export declare type CubeNotifyApiPropsWithID = {
+    id: NonNullable<CubeNotificationProps['id']>;
+} & CubeNotifyApiProps;
+export declare type CubeNotificationsApiNotifyCallback = (props: CubeNotifyApiProps) => {
+    id: Key;
+    update: (props: Partial<CubeNotifyApiProps>) => void;
+    remove: () => void;
+};
+export declare type CubeNotificationsApiNotifyAction = CubeNotificationsApiNotifyCallback & Record<CubeNotificationType, CubeNotificationsApiNotifyCallback>;
+export declare type CubeNotificationsApi = {
+    notify: CubeNotificationsApiNotifyAction;
+    update: (id: Key, props: Partial<CubeNotifyApiProps>) => void;
+    remove: (id: Key) => void;
+};
+export declare type CubeNotificationMeta = Record<string, unknown>;
+export {};

package/types/components/overlays/Toasts/Toast.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { CubeToastsApiProps } from './types';
+export declare function Toast(props: CubeToastsApiProps): null;
+export declare namespace Toast {
+    var Success: (props: CubeToastsApiProps) => JSX.Element;
+    var Danger: (props: CubeToastsApiProps) => JSX.Element;
+    var Attention: (props: CubeToastsApiProps) => JSX.Element;
+}

package/types/components/overlays/Toasts/index.d.ts

@@ -0,0 +1,3 @@
+export * from './use-toasts-api';
+export * from './Toast';
+export type { CubeToastsApi, CubeToastsApiProps, CubeToastsApiToastCallback, CubeToastsApiToastAction, } from './types';

package/types/components/overlays/Toasts/types.d.ts

@@ -0,0 +1,23 @@
+import type { Key, ReactChild, ReactFragment, ReactNode } from 'react';
+import type { CubeNotificationType, CubeNotifyApiProps } from '../NewNotifications';
+export declare type CubeToastsApiProps = {
+    description: ReactChild | ReactFragment;
+    header?: ReactChild | ReactFragment;
+    id?: Key;
+    onDismiss?: () => void;
+    duration?: number;
+    icon?: ReactNode;
+    type?: CubeNotificationType;
+};
+export declare type CubeToastsApi = {
+    toast: CubeToastsApiToastAction;
+    update: (id: Key, props: Partial<CubeToastsApiProps>) => void;
+    remove: (id: Key) => void;
+};
+export declare type CubeToastsApiToastCallback = (props: CubeToastsApiProps | ReactChild | ReactFragment) => {
+    id: Key;
+    update: (props: Partial<CubeNotifyApiProps>) => void;
+    remove: () => void;
+};
+export declare type CubeToastsApiToastShortcuts = Record<CubeNotificationType, CubeToastsApiToastCallback>;
+export declare type CubeToastsApiToastAction = CubeToastsApiToastCallback & CubeToastsApiToastShortcuts;

package/types/components/overlays/Toasts/use-toasts-api.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare function useToastsApi(): {
+    readonly toast: any;
+    readonly update: (id: import("react").Key, props: Partial<import("../NewNotifications").CubeNotifyApiProps>) => void;
+    readonly remove: (id: import("react").Key) => void;
+};

package/types/icons/Attention.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Attention(): JSX.Element;

package/types/icons/Cross.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Cross(): JSX.Element;

package/types/icons/Danger.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Danger(): JSX.Element;

package/types/icons/Success.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Success(): JSX.Element;

package/types/icons/index.d.ts

@@ -0,0 +1,4 @@
+export * from './Danger';
+export * from './Attention';
+export * from './Success';
+export * from './Cross';

package/types/index.d.ts

@@ -142,3 +142,5 @@ export * from './tasty';
 export { default as copy } from 'clipboard-copy';
 export * from '@react-aria/ssr';
 export * from './components/forms/Form';
+export * from './components/overlays/NewNotifications';
+export * from './components/overlays/Toasts';

package/types/services/notification.d.ts

@@ -22,4 +22,7 @@ export interface NotificationService {
 export interface CubeNotificationOptions {
     duration?: number;
 }
+/**
+ * @deprecated consider using `useNotificationsApi` instead
+ */
 export declare const notification: NotificationService;