@balena/ui-shared-components 13.0.1-build-renovate-major-7-react-router-dom-4d0f1522f5b29b2463a45372d50ffd57935d613b-1 → 14.0.0-build-remove-announcement-component-c55a3354b337b349f4cd13392d0a10da32df8ce4-1

package/dist/index.d.ts

@@ -42,8 +42,6 @@ export type { LimitedRowImagesProps } from './components/LimitedRowImages';
 export { LimitedRowImages } from './components/LimitedRowImages';
 export type { MUILinkWithTrackingProps } from './components/MUILinkWithTracking';
 export { MUILinkWithTracking } from './components/MUILinkWithTracking';
-export type { AnnouncementProps, AnnouncementCloseReason, } from './components/Announcement';
-export { Announcement } from './components/Announcement';
 export type { OrderedListItemProps } from './components/OrderedListItem';
 export { OrderedListItem } from './components/OrderedListItem';
 export { generateHexColorFromString, HighlightedName, } from './components/HighlightedName';

package/dist/index.js

@@ -20,7 +20,6 @@ export { CollectionSummary } from './components/CollectionSummary';
 export { DropDownButton } from './components/DropDownButton';
 export { LimitedRowImages } from './components/LimitedRowImages';
 export { MUILinkWithTracking } from './components/MUILinkWithTracking';
-export { Announcement } from './components/Announcement';
 export { OrderedListItem } from './components/OrderedListItem';
 export { generateHexColorFromString, HighlightedName, } from './components/HighlightedName';
 export { RouterLinkWithTracking } from './components/RouterLinkWithTracking';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@balena/ui-shared-components",
-  "version": "13.0.1-build-renovate-major-7-react-router-dom-4d0f1522f5b29b2463a45372d50ffd57935d613b-1",
+  "version": "14.0.0-build-remove-announcement-component-c55a3354b337b349f4cd13392d0a10da32df8ce4-1",
   "main": "./dist/index.js",
   "sideEffects": false,
   "files": [
@@ -44,7 +44,7 @@
     "react-dropzone": "^14.2.3",
     "react-helmet": "^6.1.0",
     "react-markdown": "^10.0.0",
-    "react-router-dom": "^7.0.0",
+    "react-router-dom": "^6.28.0",
     "remark-breaks": "^4.0.0",
     "remark-gfm": "^4.0.0",
     "rimraf": "^6.0.0",
@@ -132,7 +132,7 @@
   },
   "homepage": "https://github.com/balena-io/ui-shared-components#readme",
   "versionist": {
-    "publishedAt": "2025-07-23T16:02:01.528Z"
+    "publishedAt": "2025-07-28T12:58:39.016Z"
   },
   "overrides": {
     "storybook": "$storybook"

package/dist/components/Announcement/index.d.ts

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import type { SxProps } from '@mui/material';
-import type { SnackbarCloseReason } from '@mui/material/Snackbar/Snackbar';
-export type AnnouncementCloseReason = SnackbarCloseReason | 'closeButtonClick' | 'linkClick';
-export interface AnnouncementProps {
-    open?: boolean;
-    onClose: (event: React.SyntheticEvent<any> | Event, reason: AnnouncementCloseReason) => void;
-    campaignId: string;
-    children: React.ReactNode;
-    illustration?: React.ReactNode;
-    title: string;
-    sx?: SxProps;
-}
-/**
- * This component is a notification intended to be displayed in the bottom right
- * corner of the screen, usually sharing updates on the product with our users.
- *
- * This is a Themed Component as documented here: https://mui.com/material-ui/customization/creating-themed-components/.
- * As such, it can be modified in the theme.
- */
-export declare const Announcement: React.ForwardRefExoticComponent<AnnouncementProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Announcement/index.js

@@ -1,89 +0,0 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { Typography } from '@mui/material';
-import { Box, Slide, Snackbar, Stack, styled, useThemeProps, } from '@mui/material';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faClose } from '@fortawesome/free-solid-svg-icons/faClose';
-import { IconButtonWithTracking } from '../IconButtonWithTracking';
-import { useEffect } from 'react';
-import { useAnalyticsContext } from '../../contexts/AnalyticsContext';
-import { token } from '../../utils/token';
-const AnnouncementRoot = styled(Box, {
-    name: 'Announcement',
-    slot: 'root',
-})(({ theme }) => ({
-    alignItems: 'center',
-    backgroundColor: 'white',
-    borderRadius: token('shape.borderRadius.md'),
-    boxShadow: '0px 0px 8px 0px rgba(35, 68, 94, 0.3)', // TODO add a design token for box shadows
-    display: 'flex',
-    gap: theme.spacing(3),
-    maxWidth: '100%',
-    padding: theme.spacing(3),
-    width: '100%',
-}));
-const AnnouncementIllustration = styled('figure', {
-    name: 'Announcement',
-    slot: 'illustration',
-})(({ theme }) => ({
-    margin: 0,
-    maxWidth: 48,
-    minWidth: 48,
-    [theme.breakpoints.up('sm')]: {
-        maxWidth: 72,
-    },
-    '& *': {
-        width: '100%',
-    },
-}));
-const AnnouncementTitle = styled('h3', {
-    name: 'Announcement',
-    slot: 'title',
-})(({ theme }) => (Object.assign(Object.assign({}, theme.typography.bodyLg), { margin: 0, display: 'flex', alignItems: 'center', gap: theme.spacing(1) })));
-const AnnouncementContent = styled(Stack, {
-    name: 'Announcement',
-    slot: 'content',
-})(({ theme }) => ({
-    flexGrow: 1,
-    gap: theme.spacing(1),
-    [theme.breakpoints.up('sm')]: {
-        gap: theme.spacing(2),
-    },
-}));
-function SlideTransition(props) {
-    return _jsx(Slide, Object.assign({}, props, { direction: "up" }));
-}
-/**
- * This component is a notification intended to be displayed in the bottom right
- * corner of the screen, usually sharing updates on the product with our users.
- *
- * This is a Themed Component as documented here: https://mui.com/material-ui/customization/creating-themed-components/.
- * As such, it can be modified in the theme.
- */
-export const Announcement = React.forwardRef(function Announcement(inProps, ref) {
-    const props = useThemeProps({ props: inProps, name: 'Announcement' });
-    const { illustration, campaignId, children, title, onClose, open, sx } = props, other = __rest(props, ["illustration", "campaignId", "children", "title", "onClose", "open", "sx"]);
-    const { state: analytics } = useAnalyticsContext();
-    // TODO remove this event after the first campaign, when we are sure that the notification is being shown properly
-    useEffect(() => {
-        var _a;
-        if (open) {
-            (_a = analytics.webTracker) === null || _a === void 0 ? void 0 : _a.track('Announcement displayed', {
-                campaign_id: campaignId,
-            });
-        }
-    }, [open, analytics.webTracker, campaignId]);
-    return (_jsx(Snackbar, { open: open, anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, TransitionComponent: SlideTransition, ref: ref, onClose: onClose, sx: [
-            (theme) => ({
-                zIndex: theme.zIndex.drawer - 1,
-                [theme.breakpoints.up('sm')]: {
-                    maxWidth: 350,
-                },
-            }),
-            // See: https://mui.com/system/getting-started/the-sx-prop/#passing-the-sx-prop
-            ...(Array.isArray(sx) ? sx : [sx]),
-        ], children: _jsxs(AnnouncementRoot, Object.assign({}, other, { children: [illustration && (_jsx(AnnouncementIllustration, { children: illustration })), _jsxs(AnnouncementContent, { children: [_jsxs(AnnouncementTitle, { children: [title, _jsx(IconButtonWithTracking, { edge: "end", size: "small", eventName: "Announcement dismissed", eventProperties: { campaign_id: campaignId }, onClick: (e) => {
-                                        onClose === null || onClose === void 0 ? void 0 : onClose(e, 'closeButtonClick');
-                                    }, sx: { ml: 'auto', my: -1 }, children: _jsx(FontAwesomeIcon, { icon: faClose }) })] }), _jsx(Typography, { children: children })] })] })) }, SlideTransition.name));
-});