@zendeskgarden/react-notifications - npm Package Compare versions

Comparing version 9.0.0-next.20 to 9.0.0-next.21

dist/esm/elements/Notification.js

@@ -26,5 +26,5 @@ /**
 import { validationIcons } from '../utils/icons.js';
-import { Title } from './content/Title.js';
-import { Paragraph } from './content/Paragraph.js';
-import { Close } from './content/Close.js';
+import { Title } from './Title.js';
+import { Paragraph } from './Paragraph.js';
+import { Close } from './Close.js';
 
@@ -31,0 +31,0 @@ const NotificationComponent = forwardRef((_ref, ref) => {

dist/esm/index.js

@@ -7,10 +7,10 @@ /**
 */
-export { Alert } from './elements/Alert.js';
+export { Alert } from './elements/alert/Alert.js';
 export { Notification } from './elements/Notification.js';
-export { Well } from './elements/Well.js';
-export { Close } from './elements/content/Close.js';
-export { Paragraph } from './elements/content/Paragraph.js';
-export { Title } from './elements/content/Title.js';
+export { Well } from './elements/well/Well.js';
+export { Close } from './elements/Close.js';
+export { Paragraph } from './elements/Paragraph.js';
+export { Title } from './elements/Title.js';
 export { ToastProvider } from './elements/toaster/ToastProvider.js';
 export { useToast } from './elements/toaster/useToast.js';
 export { GlobalAlert } from './elements/global-alert/GlobalAlert.js';

dist/esm/styled/content/StyledClose.js

@@ -61,3 +61,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -64,0 +64,0 @@ displayName: "StyledClose",

dist/esm/styled/content/StyledParagraph.js

@@ -13,3 +13,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -16,0 +16,0 @@ displayName: "StyledParagraph",

dist/esm/styled/content/StyledTitle.js

@@ -13,3 +13,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -16,0 +16,0 @@ displayName: "StyledTitle",

dist/esm/styled/global-alert/StyledGlobalAlert.js

@@ -151,3 +151,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -154,0 +154,0 @@ displayName: "StyledGlobalAlert",

dist/esm/styled/global-alert/StyledGlobalAlertButton.js

@@ -109,3 +109,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -112,0 +112,0 @@ displayName: "StyledGlobalAlertButton",

dist/esm/styled/global-alert/StyledGlobalAlertClose.js

@@ -94,3 +94,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -97,0 +97,0 @@ displayName: "StyledGlobalAlertClose",

dist/esm/styled/global-alert/StyledGlobalAlertContent.js

@@ -13,3 +13,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -16,0 +16,0 @@ displayName: "StyledGlobalAlertContent",

dist/esm/styled/global-alert/StyledGlobalAlertIcon.js

@@ -56,3 +56,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -59,0 +59,0 @@ displayName: "StyledGlobalAlertIcon",

dist/esm/styled/global-alert/StyledGlobalAlertTitle.js

@@ -40,3 +40,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -43,0 +43,0 @@ displayName: "StyledGlobalAlertTitle",

dist/esm/styled/StyledAlert.js

@@ -42,3 +42,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -45,0 +45,0 @@ displayName: "StyledAlert",

dist/esm/styled/StyledBase.js

@@ -83,3 +83,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -86,0 +86,0 @@ displayName: "StyledBase",

dist/esm/styled/StyledIcon.js

@@ -52,3 +52,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -55,0 +55,0 @@ displayName: "StyledIcon",

dist/esm/styled/StyledNotification.js

@@ -44,3 +44,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -47,0 +47,0 @@ displayName: "StyledNotification",

dist/esm/styled/StyledWell.js

@@ -38,3 +38,3 @@ /**
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -41,0 +41,0 @@ displayName: "StyledWell",

dist/index.cjs.js

@@ -209,3 +209,3 @@ /**
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -222,3 +222,3 @@ displayName: "StyledClose",
   'data-garden-id': COMPONENT_ID$c,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -235,3 +235,3 @@ displayName: "StyledParagraph",
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -320,3 +320,3 @@ displayName: "StyledTitle",
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -359,3 +359,3 @@ displayName: "StyledBase",
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -398,3 +398,3 @@ displayName: "StyledAlert",
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -438,3 +438,3 @@ displayName: "StyledNotification",
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -489,3 +489,3 @@ displayName: "StyledWell",
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -640,3 +640,3 @@ displayName: "StyledIcon",
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -733,3 +733,3 @@ displayName: "StyledGlobalAlert",
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -840,3 +840,3 @@ displayName: "StyledGlobalAlertClose",
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -853,3 +853,3 @@ displayName: "StyledGlobalAlertButton",
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -908,3 +908,3 @@ displayName: "StyledGlobalAlertContent",
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -948,3 +948,3 @@ displayName: "StyledGlobalAlertIcon",
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.20'
+  'data-garden-version': '9.0.0-next.21'
 }).withConfig({
@@ -963,3 +963,3 @@ displayName: "StyledGlobalAlertTitle",
 
-const Title = React__namespace.default.forwardRef((_ref, ref) => {
+const Title$1 = React__namespace.default.forwardRef((_ref, ref) => {
   let {
@@ -974,8 +974,8 @@ isRegular,
 });
-Title.displayName = 'Title';
+Title$1.displayName = 'Alert.Title';
 
-const Paragraph = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledParagraph, Object.assign({
+const Paragraph$1 = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledParagraph, Object.assign({
   ref: ref
 }, props)));
-Paragraph.displayName = 'Paragraph';
+Paragraph$1.displayName = 'Alert.Paragraph';
 
@@ -999,4 +999,4 @@ var _path;
 
-const Close = React__namespace.default.forwardRef((props, ref) => {
-  const ariaLabel = reactTheming.useText(Close, props, 'aria-label', 'Close');
+const Close$1 = React__namespace.default.forwardRef((props, ref) => {
+  const ariaLabel = reactTheming.useText(Close$1, props, 'aria-label', 'Close');
   const type = useNotificationsContext();
@@ -1012,3 +1012,3 @@ return React__namespace.default.createElement(StyledClose, Object.assign({
 });
-Close.displayName = 'Close';
+Close$1.displayName = 'Alert.Close';
 
@@ -1037,6 +1037,37 @@ const AlertComponent = React__namespace.default.forwardRef((_ref, ref) => {
 const Alert = AlertComponent;
-Alert.Close = Close;
-Alert.Paragraph = Paragraph;
-Alert.Title = Title;
+Alert.Close = Close$1;
+Alert.Paragraph = Paragraph$1;
+Alert.Title = Title$1;
 
+const Title = React__namespace.default.forwardRef((_ref, ref) => {
+  let {
+    isRegular,
+    ...props
+  } = _ref;
+  return React__namespace.default.createElement(StyledTitle, Object.assign({
+    ref: ref,
+    $isRegular: isRegular
+  }, props));
+});
+Title.displayName = 'Notification.Title';
+
+const Paragraph = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledParagraph, Object.assign({
+  ref: ref
+}, props)));
+Paragraph.displayName = 'Notification.Paragraph';
+
+const Close = React__namespace.default.forwardRef((props, ref) => {
+  const ariaLabel = reactTheming.useText(Close, props, 'aria-label', 'Close');
+  const type = useNotificationsContext();
+  return React__namespace.default.createElement(StyledClose, Object.assign({
+    ref: ref,
+    $type: type,
+    "aria-label": ariaLabel
+  }, props, {
+    focusInset: true,
+    size: "small"
+  }), React__namespace.default.createElement(SvgXStroke, null));
+});
+Close.displayName = 'Notification.Close';
+
 const NotificationComponent = React.forwardRef((_ref, ref) => {
@@ -1043,0 +1074,0 @@ let {

dist/typings/elements/Notification.d.ts

@@ -9,5 +9,5 @@ /**
 import { INotificationProps } from '../types';
-import { Title } from './content/Title';
-import { Paragraph } from './content/Paragraph';
-import { Close } from './content/Close';
+import { Title } from './Title';
+import { Paragraph } from './Paragraph';
+import { Close } from './Close';
 export declare const NotificationComponent: React.ForwardRefExoticComponent<INotificationProps & React.RefAttributes<HTMLDivElement>>;
@@ -14,0 +14,0 @@ /**

dist/typings/index.d.ts

@@ -7,8 +7,8 @@ /**
  */
-export { Alert } from './elements/Alert';
+export { Alert } from './elements/alert/Alert';
 export { Notification } from './elements/Notification';
-export { Well } from './elements/Well';
-export { Close } from './elements/content/Close';
-export { Paragraph } from './elements/content/Paragraph';
-export { Title } from './elements/content/Title';
+export { Well } from './elements/well/Well';
+export { Close } from './elements/Close';
+export { Paragraph } from './elements/Paragraph';
+export { Title } from './elements/Title';
 export { ToastProvider } from './elements/toaster/ToastProvider';
@@ -15,0 +15,0 @@ export { useToast, type IToastOptions, type IToast } from './elements/toaster/useToast';

package.json

 {
   "name": "@zendeskgarden/react-notifications",
-  "version": "9.0.0-next.20",
+  "version": "9.0.0-next.21",
   "description": "Notification and Well components within the Garden Design System",
@@ -24,3 +24,3 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@zendeskgarden/react-buttons": "^9.0.0-next.20",
+    "@zendeskgarden/react-buttons": "^9.0.0-next.21",
     "polished": "^4.3.1",
@@ -39,3 +39,3 @@ "prop-types": "^15.5.7",
     "@types/react-transition-group": "4.4.10",
-    "@zendeskgarden/react-theming": "^9.0.0-next.20",
+    "@zendeskgarden/react-theming": "^9.0.0-next.21",
     "@zendeskgarden/svg-icons": "7.1.1"
@@ -53,3 +53,3 @@ },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "eab087ac0d6e74b3a4489d37d067baf7a225e7a8"
+  "gitHead": "a245ce2b794ea65142174a6a1f855a111b2677a2"
 }

No alert changes

Improved metrics

Total package byte prevSize

163353

increased by4.41%

Number of package files

93

increased by9.41%

Lines of code

4391

increased by4.32%

Dependency changes

• Updated@zendeskgarden/react-buttons@^9.0.0-next.21