@khanacademy/wonder-blocks-banner 1.0.1 → 1.1.0

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @khanacademy/wonder-blocks-banner
 
+## 1.1.0
+
+### Minor Changes
+
+-   87572f0a: Add ariaLabel prop
+
+### Patch Changes
+
+-   150021e2: Fix border
+-   d3da219c: Add dependency to WB link
+
 ## 1.0.1
 
 ### Patch Changes

package/dist/es/index.js

@@ -4,8 +4,8 @@ import Button from '@khanacademy/wonder-blocks-button';
 import Color from '@khanacademy/wonder-blocks-color';
 import { View } from '@khanacademy/wonder-blocks-core';
 import Icon, { icons } from '@khanacademy/wonder-blocks-icon';
-import Link from '@khanacademy/wonder-blocks-link';
 import IconButton from '@khanacademy/wonder-blocks-icon-button';
+import Link from '@khanacademy/wonder-blocks-link';
 import Spacing from '@khanacademy/wonder-blocks-spacing';
 import { LabelSmall } from '@khanacademy/wonder-blocks-typography';
 
@@ -62,6 +62,7 @@ const valuesForKind = kind => {
 const Banner = props => {
   const {
     actions,
+    "aria-label": ariaLabel,
     dismissAriaLabel,
     onDismiss,
     kind,
@@ -69,9 +70,6 @@ const Banner = props => {
     text,
     testId
   } = props;
-  const layoutStyle = {
-    borderRadius: layout && layout === "full-width" ? 0 : 4
-  };
 
   const renderActions = () => {
     return actions == null ? void 0 : actions.filter(Boolean).map(action => {
@@ -107,14 +105,15 @@ const Banner = props => {
   };
 
   return React.createElement(View, {
-    style: [styles.containerOuter, layoutStyle, {
+    style: [styles.containerOuter, layout === "floating" && styles.floatingBorder, {
       borderInlineStartColor: valuesForKind(kind).color
     }],
     role: valuesForKind(kind).role,
+    "aria-label": ariaLabel,
     "aria-live": valuesForKind(kind).ariaLive,
     testId: testId
   }, React.createElement(View, {
-    style: [styles.backgroundColor, layoutStyle, {
+    style: [styles.backgroundColor, {
       backgroundColor: valuesForKind(kind).color
     }]
   }), React.createElement(View, {
@@ -211,6 +210,10 @@ const styles = StyleSheet.create({
     alignItems: "center",
     marginLeft: Spacing.xSmall_8,
     marginRight: Spacing.xSmall_8
+  },
+  floatingBorder: {
+    borderRadius: 4,
+    overflow: "hidden"
   }
 });