@zendeskgarden/react-notifications 9.0.0-next.5 → 9.0.0-next.7

package/dist/index.cjs.js

@@ -60,7 +60,7 @@ const TYPE = ['success', 'warning', 'error', 'info'];
 const COMPONENT_ID$b = 'notifications.close';
 const StyledClose = styled__default.default.button.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledClose",
   componentId: "sc-1mr9nx1-0"
@@ -75,7 +75,7 @@ StyledClose.defaultProps = {
 const COMPONENT_ID$a = 'notifications.paragraph';
 const StyledParagraph = styled__default.default.p.attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledParagraph",
   componentId: "sc-12tmd6p-0"
@@ -87,11 +87,11 @@ StyledParagraph.defaultProps = {
 const COMPONENT_ID$9 = 'notifications.title';
 const StyledTitle = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledTitle",
   componentId: "sc-xx4jsv-0"
-})(["margin:0;color:", ";font-weight:", ";", ";"], props => props.theme.colors.foreground, props => props.isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$9, props));
+})(["margin:0;color:", ";font-weight:", ";", ";"], props => reactTheming.getColorV8('foreground', 600 , props.theme), props => props.isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$9, props));
 StyledTitle.defaultProps = {
   theme: reactTheming.DEFAULT_THEME
 };
@@ -118,7 +118,7 @@ const colorStyles$6 = props => {
     borderColor = reactTheming.getColorV8(props.hue, 300, props.theme);
     foregroundColor = reactTheming.getColorV8(props.hue, props.type === 'info' ? 600 : 700, props.theme);
   } else {
-    backgroundColor = props.theme.colors.background;
+    backgroundColor = reactTheming.getColorV8('background', 600 , props.theme);
     borderColor = reactTheming.getColorV8('neutralHue', 300, props.theme);
     foregroundColor = reactTheming.getColorV8('neutralHue', 800, props.theme);
   }
@@ -144,7 +144,7 @@ const COMPONENT_ID$8 = 'notifications.alert';
 const colorStyles$5 = props => styled.css(["", "{color:", ";}"], StyledTitle, props.hue && reactTheming.getColorV8(props.hue, 800, props.theme));
 const StyledAlert = styled__default.default(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledAlert",
   componentId: "sc-fyn8jp-0"
@@ -165,8 +165,7 @@ const colorStyles$4 = props => {
   const {
     successHue,
     dangerHue,
-    warningHue,
-    foreground
+    warningHue
   } = colors;
   let color;
   switch (type) {
@@ -180,7 +179,7 @@ const colorStyles$4 = props => {
       color = reactTheming.getColorV8(warningHue, 700, theme);
       break;
     case 'info':
-      color = foreground;
+      color = reactTheming.getColorV8('foreground', 600 , theme);
       break;
     default:
       color = 'inherit';
@@ -190,7 +189,7 @@ const colorStyles$4 = props => {
 };
 const StyledNotification = styled__default.default(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledNotification",
   componentId: "sc-uf6jh-0"
@@ -205,7 +204,7 @@ StyledNotification.defaultProps = {
 const COMPONENT_ID$6 = 'notifications.well';
 const StyledWell = styled__default.default(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledWell",
   componentId: "sc-a5831c-0"
@@ -292,7 +291,7 @@ const sizeStyles$3 = props => {
 };
 const StyledGlobalAlert = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlert",
   componentId: "sc-k6rimt-0"
@@ -352,7 +351,7 @@ const sizeStyles$2 = props => {
 };
 const StyledGlobalAlertClose = styled__default.default(reactButtons.IconButton).attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '9.0.0-next.5',
+  'data-garden-version': '9.0.0-next.7',
   size: 'small'
 }).withConfig({
   displayName: "StyledGlobalAlertClose",
@@ -407,7 +406,7 @@ function sizeStyles$1(props) {
 }
 const StyledGlobalAlertButton = styled__default.default(reactButtons.Button).attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '9.0.0-next.5',
+  'data-garden-version': '9.0.0-next.7',
   focusInset: false,
   isDanger: false,
   isLink: false,
@@ -426,7 +425,7 @@ StyledGlobalAlertButton.defaultProps = {
 const COMPONENT_ID$2 = 'notifications.global-alert.content';
 const StyledGlobalAlertContent = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlertContent",
   componentId: "sc-rept0u-0"
@@ -450,7 +449,7 @@ const StyledGlobalAlertIcon = styled__default.default(_ref => {
   return React__namespace.default.cloneElement(React.Children.only(children), props);
 }).attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlertIcon",
   componentId: "sc-84ne9k-0"
@@ -478,7 +477,7 @@ const colorStyles = props => {
 };
 const StyledGlobalAlertTitle = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlertTitle",
   componentId: "sc-10clqbo-0"

package/dist/index.esm.js

@@ -35,7 +35,7 @@ const TYPE = ['success', 'warning', 'error', 'info'];
 const COMPONENT_ID$b = 'notifications.close';
 const StyledClose = styled.button.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledClose",
   componentId: "sc-1mr9nx1-0"
@@ -50,7 +50,7 @@ StyledClose.defaultProps = {
 const COMPONENT_ID$a = 'notifications.paragraph';
 const StyledParagraph = styled.p.attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledParagraph",
   componentId: "sc-12tmd6p-0"
@@ -62,11 +62,11 @@ StyledParagraph.defaultProps = {
 const COMPONENT_ID$9 = 'notifications.title';
 const StyledTitle = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledTitle",
   componentId: "sc-xx4jsv-0"
-})(["margin:0;color:", ";font-weight:", ";", ";"], props => props.theme.colors.foreground, props => props.isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, props => retrieveComponentStyles(COMPONENT_ID$9, props));
+})(["margin:0;color:", ";font-weight:", ";", ";"], props => getColorV8('foreground', 600 , props.theme), props => props.isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, props => retrieveComponentStyles(COMPONENT_ID$9, props));
 StyledTitle.defaultProps = {
   theme: DEFAULT_THEME
 };
@@ -93,7 +93,7 @@ const colorStyles$6 = props => {
     borderColor = getColorV8(props.hue, 300, props.theme);
     foregroundColor = getColorV8(props.hue, props.type === 'info' ? 600 : 700, props.theme);
   } else {
-    backgroundColor = props.theme.colors.background;
+    backgroundColor = getColorV8('background', 600 , props.theme);
     borderColor = getColorV8('neutralHue', 300, props.theme);
     foregroundColor = getColorV8('neutralHue', 800, props.theme);
   }
@@ -119,7 +119,7 @@ const COMPONENT_ID$8 = 'notifications.alert';
 const colorStyles$5 = props => css(["", "{color:", ";}"], StyledTitle, props.hue && getColorV8(props.hue, 800, props.theme));
 const StyledAlert = styled(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledAlert",
   componentId: "sc-fyn8jp-0"
@@ -140,8 +140,7 @@ const colorStyles$4 = props => {
   const {
     successHue,
     dangerHue,
-    warningHue,
-    foreground
+    warningHue
   } = colors;
   let color;
   switch (type) {
@@ -155,7 +154,7 @@ const colorStyles$4 = props => {
       color = getColorV8(warningHue, 700, theme);
       break;
     case 'info':
-      color = foreground;
+      color = getColorV8('foreground', 600 , theme);
       break;
     default:
       color = 'inherit';
@@ -165,7 +164,7 @@ const colorStyles$4 = props => {
 };
 const StyledNotification = styled(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledNotification",
   componentId: "sc-uf6jh-0"
@@ -180,7 +179,7 @@ StyledNotification.defaultProps = {
 const COMPONENT_ID$6 = 'notifications.well';
 const StyledWell = styled(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledWell",
   componentId: "sc-a5831c-0"
@@ -267,7 +266,7 @@ const sizeStyles$3 = props => {
 };
 const StyledGlobalAlert = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlert",
   componentId: "sc-k6rimt-0"
@@ -327,7 +326,7 @@ const sizeStyles$2 = props => {
 };
 const StyledGlobalAlertClose = styled(IconButton).attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '9.0.0-next.5',
+  'data-garden-version': '9.0.0-next.7',
   size: 'small'
 }).withConfig({
   displayName: "StyledGlobalAlertClose",
@@ -382,7 +381,7 @@ function sizeStyles$1(props) {
 }
 const StyledGlobalAlertButton = styled(Button).attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '9.0.0-next.5',
+  'data-garden-version': '9.0.0-next.7',
   focusInset: false,
   isDanger: false,
   isLink: false,
@@ -401,7 +400,7 @@ StyledGlobalAlertButton.defaultProps = {
 const COMPONENT_ID$2 = 'notifications.global-alert.content';
 const StyledGlobalAlertContent = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlertContent",
   componentId: "sc-rept0u-0"
@@ -425,7 +424,7 @@ const StyledGlobalAlertIcon = styled(_ref => {
   return React__default.cloneElement(Children.only(children), props);
 }).attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlertIcon",
   componentId: "sc-84ne9k-0"
@@ -453,7 +452,7 @@ const colorStyles = props => {
 };
 const StyledGlobalAlertTitle = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.5'
+  'data-garden-version': '9.0.0-next.7'
 }).withConfig({
   displayName: "StyledGlobalAlertTitle",
   componentId: "sc-10clqbo-0"

package/dist/typings/styled/global-alert/StyledGlobalAlertButton.d.ts

@@ -30,5 +30,5 @@ export declare const StyledGlobalAlertButton: import("styled-components").Styled
     isPill: false;
     isStretched: false;
     size: "small";
-} & IStyledGlobalAlertButtonProps, "isDanger" | "size" | "isStretched" | "isNeutral" | "isLink" | "isPill" | "focusInset" | "data-garden-id" | "data-garden-version">;
+} & IStyledGlobalAlertButtonProps, "size" | "isDanger" | "isStretched" | "isNeutral" | "isLink" | "isPill" | "focusInset" | "data-garden-id" | "data-garden-version">;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-notifications",
-  "version": "9.0.0-next.5",
+  "version": "9.0.0-next.7",
   "description": "Notification and Well components within the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -21,21 +21,21 @@
   "sideEffects": false,
   "types": "dist/typings/index.d.ts",
   "dependencies": {
-    "@zendeskgarden/react-buttons": "^9.0.0-next.5",
+    "@zendeskgarden/react-buttons": "^9.0.0-next.7",
     "polished": "^4.1.1",
     "prop-types": "^15.5.7",
     "react-transition-group": "^4.4.2",
     "react-uid": "^2.3.1"
   },
   "peerDependencies": {
-    "@zendeskgarden/react-theming": "^8.67.0",
+    "@zendeskgarden/react-theming": "^9.0.0",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "styled-components": "^5.3.1"
   },
   "devDependencies": {
     "@types/react-transition-group": "4.4.10",
-    "@zendeskgarden/react-theming": "^9.0.0-next.5",
+    "@zendeskgarden/react-theming": "^9.0.0-next.7",
     "@zendeskgarden/svg-icons": "7.0.0"
   },
   "keywords": [
@@ -48,5 +48,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "806fa33feb06142c3f69b6a87b53628469117e4d"
+  "gitHead": "50a2b45b2e237a490a6d460818d33498b92479ec"
 }