@zendeskgarden/react-notifications 9.0.0-next.9 → 9.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/elements/Close.js +40 -0
- package/dist/esm/elements/Notification.js +8 -9
- package/dist/esm/elements/{Well.js → Paragraph.js} +5 -15
- package/dist/esm/elements/Title.js +35 -0
- package/dist/esm/elements/alert/Alert.js +56 -0
- package/dist/esm/elements/{content → alert}/Close.js +8 -5
- package/dist/esm/elements/{content → alert}/Paragraph.js +1 -1
- package/dist/esm/elements/{content → alert}/Title.js +11 -4
- package/dist/esm/elements/global-alert/GlobalAlert.js +15 -4
- package/dist/esm/elements/global-alert/GlobalAlertButton.js +3 -2
- package/dist/esm/elements/global-alert/GlobalAlertClose.js +5 -3
- package/dist/esm/elements/global-alert/GlobalAlertTitle.js +8 -3
- package/dist/esm/elements/toaster/styled.js +0 -7
- package/dist/esm/elements/well/Well.js +47 -0
- package/dist/esm/index.js +5 -5
- package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/alert-error-stroke.svg.js +1 -1
- package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/alert-warning-stroke.svg.js +1 -1
- package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/check-circle-stroke.svg.js +1 -1
- package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/info-stroke.svg.js +1 -1
- package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/x-stroke.svg.js +1 -1
- package/dist/esm/styled/StyledAlert.js +29 -6
- package/dist/esm/styled/StyledBase.js +62 -27
- package/dist/esm/styled/StyledIcon.js +47 -7
- package/dist/esm/styled/StyledNotification.js +19 -28
- package/dist/esm/styled/StyledWell.js +28 -7
- package/dist/esm/styled/content/StyledClose.js +53 -11
- package/dist/esm/styled/content/StyledParagraph.js +2 -5
- package/dist/esm/styled/content/StyledTitle.js +6 -6
- package/dist/esm/styled/global-alert/StyledGlobalAlert.js +113 -41
- package/dist/esm/styled/global-alert/StyledGlobalAlertButton.js +76 -36
- package/dist/esm/styled/global-alert/StyledGlobalAlertClose.js +60 -34
- package/dist/esm/styled/global-alert/StyledGlobalAlertContent.js +3 -6
- package/dist/esm/styled/global-alert/StyledGlobalAlertIcon.js +40 -7
- package/dist/esm/styled/global-alert/StyledGlobalAlertTitle.js +20 -12
- package/dist/esm/utils/icons.js +6 -6
- package/dist/index.cjs.js +785 -422
- package/dist/typings/elements/Notification.d.ts +4 -4
- package/dist/typings/elements/{content/Title.d.ts → Title.d.ts} +1 -1
- package/dist/typings/elements/{Alert.d.ts → alert/Alert.d.ts} +5 -5
- package/dist/typings/elements/alert/Close.d.ts +11 -0
- package/dist/typings/elements/alert/Paragraph.d.ts +11 -0
- package/dist/typings/elements/alert/Title.d.ts +12 -0
- package/dist/typings/elements/global-alert/GlobalAlert.d.ts +8 -1
- package/dist/typings/elements/toaster/Toast.d.ts +0 -1
- package/dist/typings/elements/well/Paragraph.d.ts +11 -0
- package/dist/typings/elements/well/Title.d.ts +12 -0
- package/dist/typings/elements/{Well.d.ts → well/Well.d.ts} +4 -4
- package/dist/typings/index.d.ts +5 -5
- package/dist/typings/styled/StyledAlert.d.ts +8 -3
- package/dist/typings/styled/StyledBase.d.ts +8 -6
- package/dist/typings/styled/StyledIcon.d.ts +10 -2
- package/dist/typings/styled/StyledNotification.d.ts +11 -3
- package/dist/typings/styled/StyledWell.d.ts +7 -2
- package/dist/typings/styled/content/StyledClose.d.ts +4 -3
- package/dist/typings/styled/content/StyledTitle.d.ts +1 -1
- package/dist/typings/styled/global-alert/StyledGlobalAlert.d.ts +1 -1
- package/dist/typings/styled/global-alert/StyledGlobalAlertButton.d.ts +4 -18
- package/dist/typings/styled/global-alert/StyledGlobalAlertClose.d.ts +2 -4
- package/dist/typings/styled/global-alert/StyledGlobalAlertIcon.d.ts +1 -2
- package/dist/typings/styled/global-alert/StyledGlobalAlertTitle.d.ts +2 -2
- package/dist/typings/utils/icons.d.ts +1 -1
- package/dist/typings/{elements/global-alert/utility.d.ts → utils/useGlobalAlertContext.d.ts} +1 -2
- package/dist/typings/utils/useNotificationsContext.d.ts +2 -4
- package/package.json +9 -9
- package/dist/esm/elements/Alert.js +0 -56
- package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/12/x-stroke.svg.js +0 -26
- /package/dist/esm/{elements/global-alert/utility.js → utils/useGlobalAlertContext.js} +0 -0
- /package/dist/typings/elements/{content/Close.d.ts → Close.d.ts} +0 -0
- /package/dist/typings/elements/{content/Paragraph.d.ts → Paragraph.d.ts} +0 -0
|
@@ -6,14 +6,14 @@
|
|
|
6
6
|
*/
|
|
7
7
|
import React from 'react';
|
|
8
8
|
import { INotificationProps } from '../types';
|
|
9
|
-
import { Title } from './
|
|
10
|
-
import { Paragraph } from './
|
|
11
|
-
import { Close } from './
|
|
9
|
+
import { Title } from './Title';
|
|
10
|
+
import { Paragraph } from './Paragraph';
|
|
11
|
+
import { Close } from './Close';
|
|
12
12
|
export declare const NotificationComponent: React.ForwardRefExoticComponent<INotificationProps & React.RefAttributes<HTMLDivElement>>;
|
|
13
13
|
/**
|
|
14
14
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
15
15
|
*/
|
|
16
|
-
export declare const Notification:
|
|
16
|
+
export declare const Notification: typeof NotificationComponent & {
|
|
17
17
|
Close: typeof Close;
|
|
18
18
|
Paragraph: typeof Paragraph;
|
|
19
19
|
Title: typeof Title;
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import React from 'react';
|
|
8
|
-
import { ITitleProps } from '
|
|
8
|
+
import { ITitleProps } from '../types';
|
|
9
9
|
/**
|
|
10
10
|
* @deprecated use `Alert.Title`, `Notification.Title`, or `Well.Title` instead
|
|
11
11
|
*
|
|
@@ -5,15 +5,15 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import React from 'react';
|
|
8
|
-
import { IAlertProps } from '
|
|
9
|
-
import { Title } from './
|
|
10
|
-
import { Paragraph } from './
|
|
11
|
-
import { Close } from './
|
|
8
|
+
import { IAlertProps } from '../../types';
|
|
9
|
+
import { Title } from './Title';
|
|
10
|
+
import { Paragraph } from './Paragraph';
|
|
11
|
+
import { Close } from './Close';
|
|
12
12
|
export declare const AlertComponent: React.ForwardRefExoticComponent<IAlertProps & React.RefAttributes<HTMLDivElement>>;
|
|
13
13
|
/**
|
|
14
14
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
15
15
|
*/
|
|
16
|
-
export declare const Alert:
|
|
16
|
+
export declare const Alert: typeof AlertComponent & {
|
|
17
17
|
Close: typeof Close;
|
|
18
18
|
Paragraph: typeof Paragraph;
|
|
19
19
|
Title: typeof Title;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
/**
|
|
9
|
+
* @extends ButtonHTMLAttributes<HTMLButtonElement>
|
|
10
|
+
*/
|
|
11
|
+
export declare const Close: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
/**
|
|
9
|
+
* @extends HTMLAttributes<HTMLParagraphElement>
|
|
10
|
+
*/
|
|
11
|
+
export declare const Paragraph: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import { ITitleProps } from '../../types';
|
|
9
|
+
/**
|
|
10
|
+
* @extends HTMLAttributes<HTMLDivElement>
|
|
11
|
+
*/
|
|
12
|
+
export declare const Title: React.ForwardRefExoticComponent<ITitleProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -10,12 +10,19 @@ import { GlobalAlertButton } from './GlobalAlertButton';
|
|
|
10
10
|
import { GlobalAlertClose } from './GlobalAlertClose';
|
|
11
11
|
import { GlobalAlertContent } from './GlobalAlertContent';
|
|
12
12
|
import { GlobalAlertTitle } from './GlobalAlertTitle';
|
|
13
|
+
/**
|
|
14
|
+
* 1. Global Alert always renders with light theme colors
|
|
15
|
+
* 2. role='status' on `div` is valid WAI-ARIA usage in this context.
|
|
16
|
+
* https://www.w3.org/TR/wai-aria-1.1/#status
|
|
17
|
+
*/
|
|
18
|
+
declare const GlobalAlertComponent: React.ForwardRefExoticComponent<IGlobalAlertProps & React.RefAttributes<HTMLDivElement>>;
|
|
13
19
|
/**
|
|
14
20
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
15
21
|
*/
|
|
16
|
-
export declare const GlobalAlert:
|
|
22
|
+
export declare const GlobalAlert: typeof GlobalAlertComponent & {
|
|
17
23
|
Button: typeof GlobalAlertButton;
|
|
18
24
|
Close: typeof GlobalAlertClose;
|
|
19
25
|
Content: typeof GlobalAlertContent;
|
|
20
26
|
Title: typeof GlobalAlertTitle;
|
|
21
27
|
};
|
|
28
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
/**
|
|
9
|
+
* @extends HTMLAttributes<HTMLParagraphElement>
|
|
10
|
+
*/
|
|
11
|
+
export declare const Paragraph: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import { ITitleProps } from '../../types';
|
|
9
|
+
/**
|
|
10
|
+
* @extends HTMLAttributes<HTMLDivElement>
|
|
11
|
+
*/
|
|
12
|
+
export declare const Title: React.ForwardRefExoticComponent<ITitleProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -5,14 +5,14 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import React from 'react';
|
|
8
|
-
import { IWellProps } from '
|
|
9
|
-
import { Title } from '
|
|
10
|
-
import { Paragraph } from '
|
|
8
|
+
import { IWellProps } from '../../types';
|
|
9
|
+
import { Title } from '../Title';
|
|
10
|
+
import { Paragraph } from '../Paragraph';
|
|
11
11
|
export declare const WellComponent: React.ForwardRefExoticComponent<IWellProps & React.RefAttributes<HTMLDivElement>>;
|
|
12
12
|
/**
|
|
13
13
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
14
14
|
*/
|
|
15
|
-
export declare const Well:
|
|
15
|
+
export declare const Well: typeof WellComponent & {
|
|
16
16
|
Paragraph: typeof Paragraph;
|
|
17
17
|
Title: typeof Title;
|
|
18
18
|
};
|
package/dist/typings/index.d.ts
CHANGED
|
@@ -4,12 +4,12 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
export { Alert } from './elements/Alert';
|
|
7
|
+
export { Alert } from './elements/alert/Alert';
|
|
8
8
|
export { Notification } from './elements/Notification';
|
|
9
|
-
export { Well } from './elements/Well';
|
|
10
|
-
export { Close } from './elements/
|
|
11
|
-
export { Paragraph } from './elements/
|
|
12
|
-
export { Title } from './elements/
|
|
9
|
+
export { Well } from './elements/well/Well';
|
|
10
|
+
export { Close } from './elements/Close';
|
|
11
|
+
export { Paragraph } from './elements/Paragraph';
|
|
12
|
+
export { Title } from './elements/Title';
|
|
13
13
|
export { ToastProvider } from './elements/toaster/ToastProvider';
|
|
14
14
|
export { useToast, type IToastOptions, type IToast } from './elements/toaster/useToast';
|
|
15
15
|
export { GlobalAlert } from './elements/global-alert/GlobalAlert';
|
|
@@ -5,13 +5,18 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
import { IStyledBaseProps } from './StyledBase';
|
|
9
|
+
import { Type } from '../types';
|
|
10
|
+
export interface IStyledAlertProps extends IStyledBaseProps {
|
|
11
|
+
$type?: Type;
|
|
10
12
|
}
|
|
11
13
|
/**
|
|
12
14
|
* Supports all `<div>` props
|
|
13
15
|
*/
|
|
14
|
-
export declare const StyledAlert: import("styled-components").StyledComponent<"div", DefaultTheme,
|
|
16
|
+
export declare const StyledAlert: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
17
|
+
'data-garden-id': string;
|
|
18
|
+
'data-garden-version': string;
|
|
19
|
+
} & IStyledBaseProps & {
|
|
15
20
|
'data-garden-id': string;
|
|
16
21
|
'data-garden-version': string;
|
|
17
22
|
} & IStyledAlertProps, "data-garden-id" | "data-garden-version">;
|
|
@@ -4,11 +4,13 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import { DefaultTheme } from 'styled-components';
|
|
7
|
+
import { ThemeProps, DefaultTheme } from 'styled-components';
|
|
8
8
|
import { Type } from '../types';
|
|
9
|
-
export interface IStyledBaseProps {
|
|
10
|
-
isFloating?: boolean;
|
|
11
|
-
|
|
12
|
-
type?: Type;
|
|
9
|
+
export interface IStyledBaseProps extends ThemeProps<DefaultTheme> {
|
|
10
|
+
$isFloating?: boolean;
|
|
11
|
+
$type?: Type;
|
|
13
12
|
}
|
|
14
|
-
export declare const StyledBase: import("styled-components").StyledComponent<"div", DefaultTheme,
|
|
13
|
+
export declare const StyledBase: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
14
|
+
'data-garden-id': string;
|
|
15
|
+
'data-garden-version': string;
|
|
16
|
+
} & IStyledBaseProps, "data-garden-id" | "data-garden-version">;
|
|
@@ -4,5 +4,13 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
import { DefaultTheme, ThemeProps } from 'styled-components';
|
|
8
|
+
import { Type } from '../types';
|
|
9
|
+
interface IStyledIconProps extends ThemeProps<DefaultTheme> {
|
|
10
|
+
$type?: Type;
|
|
11
|
+
}
|
|
12
|
+
export declare const StyledIcon: import("styled-components").StyledComponent<({ children, theme, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>, DefaultTheme, {
|
|
13
|
+
'data-garden-id': string;
|
|
14
|
+
'data-garden-version': string;
|
|
15
|
+
} & IStyledIconProps, "data-garden-id" | "data-garden-version">;
|
|
16
|
+
export {};
|
|
@@ -5,11 +5,19 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { Type } from '../types';
|
|
9
|
+
import { IStyledBaseProps } from './StyledBase';
|
|
10
|
+
interface IStyledNotificationProps extends IStyledBaseProps {
|
|
11
|
+
$type?: Type;
|
|
12
|
+
}
|
|
9
13
|
/**
|
|
10
14
|
* Supports all `<div>` props
|
|
11
15
|
*/
|
|
12
|
-
export declare const StyledNotification: import("styled-components").StyledComponent<"div", DefaultTheme,
|
|
16
|
+
export declare const StyledNotification: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
13
17
|
'data-garden-id': string;
|
|
14
18
|
'data-garden-version': string;
|
|
15
|
-
} &
|
|
19
|
+
} & IStyledBaseProps & {
|
|
20
|
+
'data-garden-id': string;
|
|
21
|
+
'data-garden-version': string;
|
|
22
|
+
} & IStyledNotificationProps, "data-garden-id" | "data-garden-version">;
|
|
23
|
+
export {};
|
|
@@ -4,13 +4,18 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
+
import { DefaultTheme } from 'styled-components';
|
|
7
8
|
export interface IStyledWellProps {
|
|
8
|
-
isRecessed?: boolean;
|
|
9
|
+
$isRecessed?: boolean;
|
|
10
|
+
$isFloating?: boolean;
|
|
9
11
|
}
|
|
10
12
|
/**
|
|
11
13
|
* Supports all `<div>` props
|
|
12
14
|
*/
|
|
13
|
-
export declare const StyledWell: import("styled-components").StyledComponent<"div",
|
|
15
|
+
export declare const StyledWell: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
16
|
+
'data-garden-id': string;
|
|
17
|
+
'data-garden-version': string;
|
|
18
|
+
} & import("./StyledBase").IStyledBaseProps & {
|
|
14
19
|
'data-garden-id': string;
|
|
15
20
|
'data-garden-version': string;
|
|
16
21
|
} & IStyledWellProps, "data-garden-id" | "data-garden-version">;
|
|
@@ -4,9 +4,10 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { DefaultTheme } from 'styled-components';
|
|
8
|
+
import { Type } from '../../types';
|
|
8
9
|
interface IStyledCloseProps {
|
|
9
|
-
|
|
10
|
+
$type?: Type;
|
|
10
11
|
}
|
|
11
12
|
/**
|
|
12
13
|
* Used to close a Notification. Supports all `<button>` props
|
|
@@ -14,7 +15,7 @@ interface IStyledCloseProps {
|
|
|
14
15
|
* 1. Reset for <button> element.
|
|
15
16
|
* 2. Remove dotted outline from Firefox on focus.
|
|
16
17
|
*/
|
|
17
|
-
export declare const StyledClose: import("styled-components").StyledComponent<"
|
|
18
|
+
export declare const StyledClose: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@zendeskgarden/react-buttons").IIconButtonProps & import("react").RefAttributes<HTMLButtonElement>>, DefaultTheme, {
|
|
18
19
|
'data-garden-id': string;
|
|
19
20
|
'data-garden-version': string;
|
|
20
21
|
} & IStyledCloseProps, "data-garden-id" | "data-garden-version">;
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
8
|
import { IGlobalAlertProps } from '../../types';
|
|
9
9
|
interface IStyledGlobalAlertProps {
|
|
10
|
-
alertType: IGlobalAlertProps['type'];
|
|
10
|
+
$alertType: IGlobalAlertProps['type'];
|
|
11
11
|
}
|
|
12
12
|
export declare const StyledGlobalAlert: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
13
13
|
'data-garden-id': string;
|
|
@@ -4,31 +4,17 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
/// <reference types="react" />
|
|
8
7
|
import { DefaultTheme } from 'styled-components';
|
|
9
8
|
import { IGlobalAlertProps } from '../../types';
|
|
10
9
|
interface IStyledGlobalAlertButtonProps {
|
|
11
|
-
alertType: IGlobalAlertProps['type'];
|
|
10
|
+
$alertType: IGlobalAlertProps['type'];
|
|
12
11
|
isBasic?: boolean;
|
|
13
12
|
}
|
|
14
13
|
export declare const StyledGlobalAlertButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@zendeskgarden/react-buttons").IButtonProps & import("react").RefAttributes<HTMLButtonElement>> & {
|
|
15
|
-
EndIcon:
|
|
16
|
-
|
|
17
|
-
displayName: string;
|
|
18
|
-
};
|
|
19
|
-
StartIcon: {
|
|
20
|
-
({ isRotated, ...props }: import("@zendeskgarden/react-buttons").IButtonEndIconProps): import("react").JSX.Element;
|
|
21
|
-
displayName: string;
|
|
22
|
-
};
|
|
14
|
+
EndIcon: typeof import("packages/buttons/dist/typings/elements/components/EndIcon").EndIcon;
|
|
15
|
+
StartIcon: typeof import("packages/buttons/dist/typings/elements/components/StartIcon").StartIcon;
|
|
23
16
|
}, DefaultTheme, {
|
|
24
17
|
'data-garden-id': string;
|
|
25
18
|
'data-garden-version': string;
|
|
26
|
-
|
|
27
|
-
isDanger: false;
|
|
28
|
-
isLink: false;
|
|
29
|
-
isNeutral: false;
|
|
30
|
-
isPill: false;
|
|
31
|
-
isStretched: false;
|
|
32
|
-
size: "small";
|
|
33
|
-
} & IStyledGlobalAlertButtonProps, "size" | "isDanger" | "isStretched" | "isNeutral" | "isLink" | "isPill" | "focusInset" | "data-garden-id" | "data-garden-version">;
|
|
19
|
+
} & IStyledGlobalAlertButtonProps, "data-garden-id" | "data-garden-version">;
|
|
34
20
|
export {};
|
|
@@ -4,16 +4,14 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
/// <reference types="react" />
|
|
8
7
|
import { DefaultTheme, ThemeProps } from 'styled-components';
|
|
9
8
|
import { IGlobalAlertProps } from '../../types';
|
|
10
9
|
interface IStyledGlobalAlertCloseProps {
|
|
11
|
-
alertType: IGlobalAlertProps['type'];
|
|
10
|
+
$alertType: IGlobalAlertProps['type'];
|
|
12
11
|
}
|
|
13
12
|
export declare const colorStyles: (props: ThemeProps<DefaultTheme> & IStyledGlobalAlertCloseProps) => import("styled-components").FlattenSimpleInterpolation;
|
|
14
13
|
export declare const StyledGlobalAlertClose: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@zendeskgarden/react-buttons").IIconButtonProps & import("react").RefAttributes<HTMLButtonElement>>, DefaultTheme, {
|
|
15
14
|
'data-garden-id': string;
|
|
16
15
|
'data-garden-version': string;
|
|
17
|
-
|
|
18
|
-
} & IStyledGlobalAlertCloseProps, "size" | "data-garden-id" | "data-garden-version">;
|
|
16
|
+
} & IStyledGlobalAlertCloseProps, "data-garden-id" | "data-garden-version">;
|
|
19
17
|
export {};
|
|
@@ -4,9 +4,8 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
/// <reference types="react" />
|
|
8
7
|
import { DefaultTheme } from 'styled-components';
|
|
9
|
-
export declare const StyledGlobalAlertIcon: import("styled-components").StyledComponent<({ children, theme, ...props }: any) =>
|
|
8
|
+
export declare const StyledGlobalAlertIcon: import("styled-components").StyledComponent<({ children, theme, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>, DefaultTheme, {
|
|
10
9
|
'data-garden-id': string;
|
|
11
10
|
'data-garden-version': string;
|
|
12
11
|
}, "data-garden-id" | "data-garden-version">;
|
|
@@ -7,8 +7,8 @@
|
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
8
|
import { IGlobalAlertProps, IGlobalAlertTitleProps } from '../../types';
|
|
9
9
|
interface IStyledGlobalAlertTitleProps {
|
|
10
|
-
alertType: IGlobalAlertProps['type'];
|
|
11
|
-
isRegular?: IGlobalAlertTitleProps['isRegular'];
|
|
10
|
+
$alertType: IGlobalAlertProps['type'];
|
|
11
|
+
$isRegular?: IGlobalAlertTitleProps['isRegular'];
|
|
12
12
|
}
|
|
13
13
|
export declare const StyledGlobalAlertTitle: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
14
14
|
'data-garden-id': string;
|
package/dist/typings/{elements/global-alert/utility.d.ts → utils/useGlobalAlertContext.d.ts}
RENAMED
|
@@ -4,8 +4,7 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
|
-
import { IGlobalAlertProps } from '../../types';
|
|
7
|
+
import { IGlobalAlertProps } from '../types';
|
|
9
8
|
export type GlobalAlertContextProps = Pick<IGlobalAlertProps, 'type'>;
|
|
10
9
|
export declare const GlobalAlertContext: import("react").Context<GlobalAlertContextProps>;
|
|
11
10
|
export declare const useGlobalAlertContext: () => GlobalAlertContextProps;
|
|
@@ -4,7 +4,5 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
|
-
export
|
|
9
|
-
export declare const NotificationsContext: import("react").Context<Hue | undefined>;
|
|
10
|
-
export declare const useNotificationsContext: () => Hue | undefined;
|
|
7
|
+
export declare const NotificationsContext: import("react").Context<"success" | "warning" | "error" | "info" | undefined>;
|
|
8
|
+
export declare const useNotificationsContext: () => "success" | "warning" | "error" | "info" | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-notifications",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.1.0",
|
|
4
4
|
"description": "Notification and Well components within the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -21,22 +21,22 @@
|
|
|
21
21
|
"sideEffects": false,
|
|
22
22
|
"types": "dist/typings/index.d.ts",
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@zendeskgarden/react-buttons": "^9.
|
|
25
|
-
"polished": "^4.
|
|
24
|
+
"@zendeskgarden/react-buttons": "^9.1.0",
|
|
25
|
+
"polished": "^4.3.1",
|
|
26
26
|
"prop-types": "^15.5.7",
|
|
27
27
|
"react-transition-group": "^4.4.2",
|
|
28
28
|
"react-uid": "^2.3.1"
|
|
29
29
|
},
|
|
30
30
|
"peerDependencies": {
|
|
31
31
|
"@zendeskgarden/react-theming": ">=9.0.0-next",
|
|
32
|
-
"react": "
|
|
33
|
-
"react-dom": "
|
|
32
|
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
33
|
+
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
34
34
|
"styled-components": "^5.3.1"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@types/react-transition-group": "4.4.
|
|
38
|
-
"@zendeskgarden/react-theming": "^9.
|
|
39
|
-
"@zendeskgarden/svg-icons": "7.
|
|
37
|
+
"@types/react-transition-group": "4.4.11",
|
|
38
|
+
"@zendeskgarden/react-theming": "^9.1.0",
|
|
39
|
+
"@zendeskgarden/svg-icons": "7.3.0"
|
|
40
40
|
},
|
|
41
41
|
"keywords": [
|
|
42
42
|
"components",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"access": "public"
|
|
49
49
|
},
|
|
50
50
|
"zendeskgarden:src": "src/index.ts",
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "a2842d18615ad057d75988fde4df5a0c79d2714e"
|
|
52
52
|
}
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright Zendesk, Inc.
|
|
3
|
-
*
|
|
4
|
-
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
-
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
-
*/
|
|
7
|
-
import React__default from 'react';
|
|
8
|
-
import PropTypes from 'prop-types';
|
|
9
|
-
import { TYPE } from '../types/index.js';
|
|
10
|
-
import '../styled/content/StyledClose.js';
|
|
11
|
-
import '../styled/content/StyledParagraph.js';
|
|
12
|
-
import '../styled/content/StyledTitle.js';
|
|
13
|
-
import { StyledAlert } from '../styled/StyledAlert.js';
|
|
14
|
-
import '../styled/StyledNotification.js';
|
|
15
|
-
import '../styled/StyledWell.js';
|
|
16
|
-
import { StyledIcon } from '../styled/StyledIcon.js';
|
|
17
|
-
import '../styled/StyledBase.js';
|
|
18
|
-
import '../styled/global-alert/StyledGlobalAlert.js';
|
|
19
|
-
import '../styled/global-alert/StyledGlobalAlertButton.js';
|
|
20
|
-
import '../styled/global-alert/StyledGlobalAlertClose.js';
|
|
21
|
-
import '../styled/global-alert/StyledGlobalAlertContent.js';
|
|
22
|
-
import '../styled/global-alert/StyledGlobalAlertIcon.js';
|
|
23
|
-
import '../styled/global-alert/StyledGlobalAlertTitle.js';
|
|
24
|
-
import { validationHues, validationIcons } from '../utils/icons.js';
|
|
25
|
-
import { NotificationsContext } from '../utils/useNotificationsContext.js';
|
|
26
|
-
import { Title } from './content/Title.js';
|
|
27
|
-
import { Paragraph } from './content/Paragraph.js';
|
|
28
|
-
import { Close } from './content/Close.js';
|
|
29
|
-
|
|
30
|
-
const AlertComponent = React__default.forwardRef((_ref, ref) => {
|
|
31
|
-
let {
|
|
32
|
-
role,
|
|
33
|
-
...props
|
|
34
|
-
} = _ref;
|
|
35
|
-
const hue = validationHues[props.type];
|
|
36
|
-
const Icon = validationIcons[props.type];
|
|
37
|
-
return React__default.createElement(NotificationsContext.Provider, {
|
|
38
|
-
value: hue
|
|
39
|
-
}, React__default.createElement(StyledAlert, Object.assign({
|
|
40
|
-
ref: ref,
|
|
41
|
-
hue: hue,
|
|
42
|
-
role: role === undefined ? 'alert' : role
|
|
43
|
-
}, props), React__default.createElement(StyledIcon, {
|
|
44
|
-
$hue: hue
|
|
45
|
-
}, React__default.createElement(Icon, null)), props.children));
|
|
46
|
-
});
|
|
47
|
-
AlertComponent.displayName = 'Alert';
|
|
48
|
-
AlertComponent.propTypes = {
|
|
49
|
-
type: PropTypes.oneOf(TYPE).isRequired
|
|
50
|
-
};
|
|
51
|
-
const Alert = AlertComponent;
|
|
52
|
-
Alert.Close = Close;
|
|
53
|
-
Alert.Paragraph = Paragraph;
|
|
54
|
-
Alert.Title = Title;
|
|
55
|
-
|
|
56
|
-
export { Alert, AlertComponent };
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright Zendesk, Inc.
|
|
3
|
-
*
|
|
4
|
-
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
-
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
-
*/
|
|
7
|
-
import * as React from 'react';
|
|
8
|
-
|
|
9
|
-
var _path;
|
|
10
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
11
|
-
var SvgXStroke = function SvgXStroke(props) {
|
|
12
|
-
return /*#__PURE__*/React.createElement("svg", _extends({
|
|
13
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
14
|
-
width: 12,
|
|
15
|
-
height: 12,
|
|
16
|
-
focusable: "false",
|
|
17
|
-
viewBox: "0 0 12 12",
|
|
18
|
-
"aria-hidden": "true"
|
|
19
|
-
}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
|
|
20
|
-
stroke: "currentColor",
|
|
21
|
-
strokeLinecap: "round",
|
|
22
|
-
d: "M3 9l6-6m0 6L3 3"
|
|
23
|
-
})));
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
export { SvgXStroke as default };
|
|
File without changes
|
|
File without changes
|
|
File without changes
|