@planningcenter/topbar 11.0.2 → 11.1.0-qa-759.0

package/dist/topbar.module.js

@@ -345,7 +345,7 @@ const X = ({
   fill: fill
 })));
 
-var styles$b = {"announcement":"announcement-pI5tM","announcement--platform":"announcement--platform-EcUn2","announcement-icon":"announcement-icon-Ov39-","announcement-content":"announcement-content-q2ad6","dismiss":"dismiss-wUAoU"};
+var styles$b = {"announcement":"announcement-pI5tM","announcement--platform":"announcement--platform-EcUn2","announcement--promo":"announcement--promo-FarUk","announcement-icon":"announcement-icon-Ov39-","announcement-content":"announcement-content-q2ad6","dismiss":"dismiss-wUAoU","dismiss--promo":"dismiss--promo-7zvO4"};
 
 function AnnouncementIcon() {
   return /*#__PURE__*/React__default.createElement("svg", {
@@ -413,11 +413,13 @@ let StyledAnnouncement$1 = class StyledAnnouncement extends React__default.Compo
   render() {
     const {
       style,
+      variant,
       ...platformProps
     } = this.props;
+    const isPromo = variant === "promo";
     return /*#__PURE__*/React__default.createElement("div", {
-      className: classnames(styles$b["announcement"], styles$b["announcement--platform"])
-    }, /*#__PURE__*/React__default.createElement(AnnouncementIcon, null), /*#__PURE__*/React__default.createElement("div", {
+      className: classnames(styles$b["announcement"], isPromo ? styles$b["announcement--promo"] : styles$b["announcement--platform"])
+    }, !isPromo && /*#__PURE__*/React__default.createElement(AnnouncementIcon, null), /*#__PURE__*/React__default.createElement("div", {
       className: styles$b["announcement-content"],
       style: style,
       ...platformProps
@@ -440,10 +442,14 @@ class PlatformAnnouncements extends React__default.Component {
       env: this.props.env,
       initialAnnouncements: this.props.data,
       configuredFetch: this.props.configuredFetch
-    }, (data, actions) => Boolean(data.announcements.length > 0) ? (/*#__PURE__*/React__default.createElement("div", null, data.announcements.map(announcement => this.props.renderItem({
-      actions,
-      announcement
-    })))) : null));
+    }, (data, actions) => {
+      const isNative = typeof document !== "undefined" && document.documentElement.getAttribute("data-app-context") === "native";
+      const visibleAnnouncements = data.announcements.filter(a => !(isNative && a.data.style === "promo"));
+      return visibleAnnouncements.length > 0 ? (/*#__PURE__*/React__default.createElement("div", null, visibleAnnouncements.map(announcement => this.props.renderItem({
+        actions,
+        announcement
+      })))) : null;
+    }));
   }
 }
 PlatformAnnouncements.defaultProps = {
@@ -454,18 +460,21 @@ PlatformAnnouncements.defaultProps = {
   }) => (/*#__PURE__*/React__default.createElement(DissmissibleAnnouncement, {
     key: announcement.id,
     html: announcement.data.html,
+    variant: announcement.data.style,
     onClick: () => actions.dismissAnnouncements(announcement.id)
   }))
 };
 function StyledDismissButton$1({
+  variant,
   ...props
 }) {
+  const isPromo = variant === "promo";
   return /*#__PURE__*/React__default.createElement("button", {
     type: "button",
-    className: styles$b.dismiss,
+    className: classnames(styles$b.dismiss, isPromo && styles$b["dismiss--promo"]),
     ...props
   }, /*#__PURE__*/React__default.createElement(X, {
-    fill: "white",
+    fill: isPromo ? "currentColor" : "white",
     style: {
       height: 20,
       width: 20
@@ -473,11 +482,14 @@ function StyledDismissButton$1({
   }));
 }
 function DissmissibleAnnouncement(props) {
-  return /*#__PURE__*/React__default.createElement(StyledAnnouncement$1, null, /*#__PURE__*/React__default.createElement("span", {
+  return /*#__PURE__*/React__default.createElement(StyledAnnouncement$1, {
+    variant: props.variant
+  }, /*#__PURE__*/React__default.createElement("span", {
     dangerouslySetInnerHTML: {
       __html: props.html
     }
   }), /*#__PURE__*/React__default.createElement(StyledDismissButton$1, {
+    variant: props.variant,
     onClick: props.onClick
   }));
 }