diff --git a/package.json b/package.json
index c011cefaca..1432cc26f8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "monday-ui-react-core",
- "version": "0.3.46",
+ "version": "0.3.47",
"description": "Official monday.com UI resources for application development in React.js",
"main": "dist/main.js",
"scripts": {
@@ -167,4 +167,4 @@
"not and_qq > 0",
"not and_uc > 0"
]
-}
+}
\ No newline at end of file
diff --git a/src/components/AlertBanner/AlertBanner.jsx b/src/components/AlertBanner/AlertBanner.jsx
index b79a96c041..56be664180 100644
--- a/src/components/AlertBanner/AlertBanner.jsx
+++ b/src/components/AlertBanner/AlertBanner.jsx
@@ -11,7 +11,7 @@ import "./AlertBanner.scss";
const NOOP = () => {};
const AlertBanner = forwardRef(
- ({ children: originalChildren, className, backgroundColor, onClose, ariaLabel }, ref) => {
+ ({ children: originalChildren, className, backgroundColor, onClose, ariaLabel, isCloseHidden }, ref) => {
const classNames = useMemo(() => {
return cx(className, "monday-alert-banner", `monday-alert-banner--background-color-${backgroundColor}`);
}, [className, backgroundColor]);
@@ -56,16 +56,18 @@ const AlertBanner = forwardRef(
})}
-
+ {isCloseHidden ? null : (
+
+ )}
);
@@ -84,6 +86,7 @@ AlertBanner.propTypes = {
AlertBanner.backgroundColors.POSITIVE,
AlertBanner.backgroundColors.DARK
]),
+ isCloseHidden: PropTypes.bool,
/** ARIA description for the progress bar */
ariaLabel: PropTypes.string,
onClose: PropTypes.func
@@ -91,6 +94,7 @@ AlertBanner.propTypes = {
AlertBanner.defaultProps = {
backgroundColor: AlertBanner.backgroundColors.PRIMARY,
+ isCloseHidden: false,
className: "",
ariaLabel: "",
onClose: NOOP
diff --git a/src/components/AlertBanner/__stories__/AlertBanner.stories.js b/src/components/AlertBanner/__stories__/AlertBanner.stories.js
index 52a709a67c..131ace18fa 100644
--- a/src/components/AlertBanner/__stories__/AlertBanner.stories.js
+++ b/src/components/AlertBanner/__stories__/AlertBanner.stories.js
@@ -16,6 +16,7 @@ export const Sandbox = () => (
)}
className={select("With custom class", ["alert-banner--custom-class", ""], "")}
ariaLabel={text("Bar Aria Label", "my awesome alert banner")}
+ isCloseHidden={boolean("Is close hidden", false)}
>
diff --git a/src/components/AlertBanner/__tests__/AlertBanner.jest.js b/src/components/AlertBanner/__tests__/AlertBanner.jest.js
index 00ac861a20..fe6c99ccca 100644
--- a/src/components/AlertBanner/__tests__/AlertBanner.jest.js
+++ b/src/components/AlertBanner/__tests__/AlertBanner.jest.js
@@ -84,4 +84,9 @@ describe("AlertBanner", () => {
.toJSON();
expect(tree).toMatchSnapshot();
});
+
+ it("should render correctly with hidden close button", () => {
+ const tree = renderer.create().toJSON();
+ expect(tree).toMatchSnapshot();
+ });
});
diff --git a/src/components/AlertBanner/__tests__/__snapshots__/AlertBanner.jest.js.snap b/src/components/AlertBanner/__tests__/__snapshots__/AlertBanner.jest.js.snap
index 233304b0e5..10fd6c79f4 100644
--- a/src/components/AlertBanner/__tests__/__snapshots__/AlertBanner.jest.js.snap
+++ b/src/components/AlertBanner/__tests__/__snapshots__/AlertBanner.jest.js.snap
@@ -1,5 +1,20 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
+exports[`AlertBanner should render correctly with hidden close button 1`] = `
+
+`;
+
exports[`AlertBanner should render correctly without props 1`] = `