@toptal/picasso-application-update-notification 1.0.24-alpha-fx-5525-container-4ebd3caa7.27 → 2.0.0

package/dist-package/src/ApplicationUpdateNotification/ApplicationUpdateNotification.d.ts

@@ -13,6 +13,6 @@ export interface Props extends BaseProps {
     /** On close click callback */
     onClose?: () => void;
 }
-export declare const ApplicationUpdateNotification: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
+export declare const ApplicationUpdateNotification: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
 export default ApplicationUpdateNotification;
 //# sourceMappingURL=ApplicationUpdateNotification.d.ts.map

package/dist-package/src/ApplicationUpdateNotification/ApplicationUpdateNotification.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ApplicationUpdateNotification.d.ts","sourceRoot":"","sources":["../../../src/ApplicationUpdateNotification/ApplicationUpdateNotification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAqB,MAAM,OAAO,CAAA;AAKzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAQvD,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,mCAAmC;IACnC,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,6BAA6B;IAC7B,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,KAAK,SAAS,CAAA;IAC7C,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAMD,eAAO,MAAM,6BAA6B,2EAsEzC,CAAA;AAWD,eAAe,6BAA6B,CAAA"}
+{"version":3,"file":"ApplicationUpdateNotification.d.ts","sourceRoot":"","sources":["../../../src/ApplicationUpdateNotification/ApplicationUpdateNotification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAMvD,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,mCAAmC;IACnC,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,6BAA6B;IAC7B,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,KAAK,SAAS,CAAA;IAC7C,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,eAAO,MAAM,6BAA6B,8EAoEzC,CAAA;AAWD,eAAe,6BAA6B,CAAA"}

package/dist-package/src/ApplicationUpdateNotification/ApplicationUpdateNotification.js

@@ -10,33 +10,22 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef } from 'react';
-import cx from 'classnames';
-import { makeStyles } from '@material-ui/core/styles';
-import { SnackbarContent } from '@material-ui/core';
 import { Typography } from '@toptal/picasso-typography';
 import { Container } from '@toptal/picasso-container';
 import { Close16 } from '@toptal/picasso-icons';
 import { ButtonCircular } from '@toptal/picasso-button';
-import styles from './styles';
-const useStyles = makeStyles(styles, {
-    name: 'ApplicationUpdateNotification',
-});
 export const ApplicationUpdateNotification = forwardRef(function ApplicationUpdateNotification(props, ref) {
     const { title, description, actions = null, dismissable = false, onClose } = props, rest = __rest(props, ["title", "description", "actions", "dismissable", "onClose"]);
-    const classes = useStyles();
     const notification = (React.createElement(Container, { flex: true, direction: 'column', gap: 'xsmall' },
-        React.createElement("svg", { className: classes.icon, viewBox: '0 0 105 105', width: '105', height: '105' },
+        React.createElement("svg", { className: 'opacity-40 absolute -top-[0.4em] -left-[0.5em] fill-blue-700', viewBox: '0 0 105 105', width: '105', height: '105' },
             React.createElement("path", { d: 'M8.364 72.364h32v8h-21.47c.829.99 1.701 1.942 2.614 2.855C29.641 91.353 40.63 96 52.364 96 76.464 96 96 76.463 96 52.364h8.727c0 28.92-23.444 52.363-52.363 52.363A52.192 52.192 0 0116.363 90.39v13.975h-8v-32zM52.364 0a52.192 52.192 0 0136 14.338V.364h8v32h-32v-8l21.469-.001a43.924 43.924 0 00-2.614-2.855c-8.133-8.133-19.12-12.78-30.855-12.78-24.1 0-43.637 19.536-43.637 43.636H0C0 23.444 23.444 0 52.364 0z' })),
         React.createElement(Container, { flex: true, direction: 'row', alignItems: 'flex-start', justifyContent: 'space-between' },
-            React.createElement(Typography, { variant: 'heading', size: 'medium', color: 'inherit', className: classes.positionRelative }, title),
-            dismissable && (React.createElement(ButtonCircular, { "data-testid": 'btn-dismiss', className: classes.closeAction, variant: 'transparent', icon: React.createElement(Close16, null), onClick: onClose }))),
-        React.createElement(Container, { className: classes.positionRelative },
+            React.createElement(Typography, { variant: 'heading', size: 'medium', color: 'inherit', className: 'relative' }, title),
+            dismissable && (React.createElement(ButtonCircular, { "data-testid": 'btn-dismiss', className: 'text-lg text-white inline-flex items-center font-semibold whitespace-nowrap', variant: 'transparent', icon: React.createElement(Close16, null), onClick: onClose }))),
+        React.createElement(Container, { className: 'relative' },
             React.createElement(Typography, { size: 'medium', color: 'inherit' }, description)), actions === null || actions === void 0 ? void 0 :
         actions(onClose)));
-    return (React.createElement(SnackbarContent, Object.assign({}, rest, { classes: {
-            root: cx([classes.root, classes.positionRelative]),
-            message: classes.message,
-        }, message: notification, ref: ref })));
+    return (React.createElement("div", Object.assign({}, rest, { className: 'relative flex flex-wrap text-lg/[1.43] items-center rounded-md bg-blue-600 shadow-3 w-[27.5em] text-white p-[1.5em] overflow-hidden', ref: ref, role: 'alert' }), notification));
 });
 ApplicationUpdateNotification.defaultProps = {
     title: 'A New Update is Available',

package/dist-package/src/ApplicationUpdateNotification/ApplicationUpdateNotification.js.map

@@ -1 +1 @@
-{"version":3,"file":"ApplicationUpdateNotification.js","sourceRoot":"","sources":["../../../src/ApplicationUpdateNotification/ApplicationUpdateNotification.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEvD,OAAO,MAAM,MAAM,UAAU,CAAA;AAe7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,+BAA+B;CACtC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,6BAA6B,GAAG,UAAU,CACrD,SAAS,6BAA6B,CAAC,KAAK,EAAE,GAAG;IAC/C,MAAM,EACJ,KAAK,EACL,WAAW,EACX,OAAO,GAAG,IAAI,EACd,WAAW,GAAG,KAAK,EACnB,OAAO,KAEL,KAAK,EADJ,IAAI,UACL,KAAK,EAPH,6DAOL,CAAQ,CAAA;IACT,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,YAAY,GAAG,CACnB,oBAAC,SAAS,IAAC,IAAI,QAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAC,QAAQ;QAC7C,6BACE,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK;YAEZ,8BAAM,CAAC,EAAC,0ZAA0Z,GAAG,CACja;QAEN,oBAAC,SAAS,IACR,IAAI,QACJ,SAAS,EAAC,KAAK,EACf,UAAU,EAAC,YAAY,EACvB,cAAc,EAAC,eAAe;YAE9B,oBAAC,UAAU,IACT,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,SAAS,EACf,SAAS,EAAE,OAAO,CAAC,gBAAgB,IAElC,KAAK,CACK;YACZ,WAAW,IAAI,CACd,oBAAC,cAAc,mBACD,aAAa,EACzB,SAAS,EAAE,OAAO,CAAC,WAAW,EAC9B,OAAO,EAAC,aAAa,EACrB,IAAI,EAAE,oBAAC,OAAO,OAAG,EACjB,OAAO,EAAE,OAAO,GAChB,CACH,CACS;QAEZ,oBAAC,SAAS,IAAC,SAAS,EAAE,OAAO,CAAC,gBAAgB;YAC5C,oBAAC,UAAU,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,SAAS,IACtC,WAAW,CACD,CACH,EAEX,OAAO,aAAP,OAAO;QAAP,OAAO,CAAG,OAAO,CAAC,CACT,CACb,CAAA;IAED,OAAO,CACL,oBAAC,eAAe,oBACV,IAAI,IACR,OAAO,EAAE;YACP,IAAI,EAAE,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;YAClD,OAAO,EAAE,OAAO,CAAC,OAAO;SACzB,EACD,OAAO,EAAE,YAAY,EACrB,GAAG,EAAE,GAAG,IACR,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAED,6BAA6B,CAAC,YAAY,GAAG;IAC3C,KAAK,EAAE,2BAA2B;IAClC,WAAW,EACT,uHAAuH;IACzH,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;CAClB,CAAA;AAED,6BAA6B,CAAC,WAAW,GAAG,+BAA+B,CAAA;AAE3E,eAAe,6BAA6B,CAAA"}
+{"version":3,"file":"ApplicationUpdateNotification.js","sourceRoot":"","sources":["../../../src/ApplicationUpdateNotification/ApplicationUpdateNotification.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAevD,MAAM,CAAC,MAAM,6BAA6B,GAAG,UAAU,CACrD,SAAS,6BAA6B,CAAC,KAAK,EAAE,GAAG;IAC/C,MAAM,EACJ,KAAK,EACL,WAAW,EACX,OAAO,GAAG,IAAI,EACd,WAAW,GAAG,KAAK,EACnB,OAAO,KAEL,KAAK,EADJ,IAAI,UACL,KAAK,EAPH,6DAOL,CAAQ,CAAA;IAET,MAAM,YAAY,GAAG,CACnB,oBAAC,SAAS,IAAC,IAAI,QAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAC,QAAQ;QAC7C,6BACE,SAAS,EAAC,8DAA8D,EACxE,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK;YAEZ,8BAAM,CAAC,EAAC,0ZAA0Z,GAAG,CACja;QAEN,oBAAC,SAAS,IACR,IAAI,QACJ,SAAS,EAAC,KAAK,EACf,UAAU,EAAC,YAAY,EACvB,cAAc,EAAC,eAAe;YAE9B,oBAAC,UAAU,IACT,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,SAAS,EACf,SAAS,EAAC,UAAU,IAEnB,KAAK,CACK;YACZ,WAAW,IAAI,CACd,oBAAC,cAAc,mBACD,aAAa,EACzB,SAAS,EAAC,6EAA6E,EACvF,OAAO,EAAC,aAAa,EACrB,IAAI,EAAE,oBAAC,OAAO,OAAG,EACjB,OAAO,EAAE,OAAO,GAChB,CACH,CACS;QAEZ,oBAAC,SAAS,IAAC,SAAS,EAAC,UAAU;YAC7B,oBAAC,UAAU,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,SAAS,IACtC,WAAW,CACD,CACH,EAEX,OAAO,aAAP,OAAO;QAAP,OAAO,CAAG,OAAO,CAAC,CACT,CACb,CAAA;IAED,OAAO,CACL,6CACM,IAAI,IACR,SAAS,EAAC,qIAAqI,EAC/I,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,KAEX,YAAY,CACT,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,6BAA6B,CAAC,YAAY,GAAG;IAC3C,KAAK,EAAE,2BAA2B;IAClC,WAAW,EACT,uHAAuH;IACzH,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;CAClB,CAAA;AAED,6BAA6B,CAAC,WAAW,GAAG,+BAA+B,CAAA;AAE3E,eAAe,6BAA6B,CAAA"}

package/dist-package/src/ApplicationUpdateNotificationCompound/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const ApplicationUpdateNotificationCompound: import("react").ForwardRefExoticComponent<import("../ApplicationUpdateNotification").ApplicationUpdateNotificationProps & import("react").RefAttributes<HTMLElement>> & {
+export declare const ApplicationUpdateNotificationCompound: import("react").ForwardRefExoticComponent<import("../ApplicationUpdateNotification").ApplicationUpdateNotificationProps & import("react").RefAttributes<HTMLDivElement>> & {
     Actions: {
         ({ justifyContent, alignItems, children, }: import("../ApplicationUpdateNotificationActions").ApplicationUpdateNotificationActionsProps): JSX.Element;
         displayName: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso-application-update-notification",
-  "version": "1.0.24-alpha-fx-5525-container-4ebd3caa7.27+4ebd3caa7",
+  "version": "2.0.0",
   "description": "Toptal UI components library - ApplicationUpdateNotification",
   "publishConfig": {
     "access": "public"
@@ -22,11 +22,11 @@
   },
   "homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
   "dependencies": {
-    "@toptal/picasso-button": "2.1.1-alpha-fx-5525-container-4ebd3caa7.27+4ebd3caa7",
-    "@toptal/picasso-container": "1.0.4-alpha-fx-5525-container-4ebd3caa7.81+4ebd3caa7",
-    "@toptal/picasso-icons": "1.4.1-alpha-fx-5525-container-4ebd3caa7.47+4ebd3caa7",
-    "@toptal/picasso-typography": "2.0.3-alpha-fx-5525-container-4ebd3caa7.63+4ebd3caa7",
-    "@toptal/picasso-utils": "1.0.4-alpha-fx-5525-container-4ebd3caa7.81+4ebd3caa7",
+    "@toptal/picasso-button": "3.0.0",
+    "@toptal/picasso-container": "2.0.0",
+    "@toptal/picasso-icons": "1.5.0",
+    "@toptal/picasso-typography": "3.0.0",
+    "@toptal/picasso-utils": "1.0.3",
     "classnames": "^2.5.1"
   },
   "sideEffects": [
@@ -34,19 +34,18 @@
     "**/styles.js"
   ],
   "peerDependencies": {
-    "@material-ui/core": "4.12.4",
+    "@toptal/picasso-tailwind": ">=2.7",
     "react": ">=16.12.0 < 19.0.0"
   },
   "exports": {
     ".": "./dist-package/src/index.js"
   },
   "devDependencies": {
-    "@toptal/picasso-test-utils": "1.1.2-alpha-fx-5525-container-4ebd3caa7.81+4ebd3caa7"
+    "@toptal/picasso-test-utils": "1.1.1"
   },
   "files": [
     "dist-package/**",
     "!dist-package/tsconfig.tsbuildinfo",
     "src"
-  ],
-  "gitHead": "4ebd3caa763220e28d7bfe67e6a63a05ea37599a"
+  ]
 }

package/src/ApplicationUpdateNotification/ApplicationUpdateNotification.tsx

@@ -1,17 +1,11 @@
 import type { ReactNode } from 'react'
 import React, { forwardRef } from 'react'
-import cx from 'classnames'
-import type { Theme } from '@material-ui/core/styles'
-import { makeStyles } from '@material-ui/core/styles'
-import { SnackbarContent } from '@material-ui/core'
 import type { BaseProps } from '@toptal/picasso-shared'
 import { Typography } from '@toptal/picasso-typography'
 import { Container } from '@toptal/picasso-container'
 import { Close16 } from '@toptal/picasso-icons'
 import { ButtonCircular } from '@toptal/picasso-button'
 
-import styles from './styles'
-
 export interface Props extends BaseProps {
   /** Notification title */
   title?: ReactNode
@@ -25,11 +19,7 @@ export interface Props extends BaseProps {
   onClose?: () => void
 }
 
-const useStyles = makeStyles<Theme>(styles, {
-  name: 'ApplicationUpdateNotification',
-})
-
-export const ApplicationUpdateNotification = forwardRef<HTMLElement, Props>(
+export const ApplicationUpdateNotification = forwardRef<HTMLDivElement, Props>(
   function ApplicationUpdateNotification(props, ref) {
     const {
       title,
@@ -39,12 +29,11 @@ export const ApplicationUpdateNotification = forwardRef<HTMLElement, Props>(
       onClose,
       ...rest
     } = props
-    const classes = useStyles()
 
     const notification = (
       <Container flex direction='column' gap='xsmall'>
         <svg
-          className={classes.icon}
+          className='opacity-40 absolute -top-[0.4em] -left-[0.5em] fill-blue-700'
           viewBox='0 0 105 105'
           width='105'
           height='105'
@@ -62,14 +51,14 @@ export const ApplicationUpdateNotification = forwardRef<HTMLElement, Props>(
             variant='heading'
             size='medium'
             color='inherit'
-            className={classes.positionRelative}
+            className='relative'
           >
             {title}
           </Typography>
           {dismissable && (
             <ButtonCircular
               data-testid='btn-dismiss'
-              className={classes.closeAction}
+              className='text-lg text-white inline-flex items-center font-semibold whitespace-nowrap'
               variant='transparent'
               icon={<Close16 />}
               onClick={onClose}
@@ -77,7 +66,7 @@ export const ApplicationUpdateNotification = forwardRef<HTMLElement, Props>(
           )}
         </Container>
 
-        <Container className={classes.positionRelative}>
+        <Container className='relative'>
           <Typography size='medium' color='inherit'>
             {description}
           </Typography>
@@ -88,15 +77,14 @@ export const ApplicationUpdateNotification = forwardRef<HTMLElement, Props>(
     )
 
     return (
-      <SnackbarContent
+      <div
         {...rest}
-        classes={{
-          root: cx([classes.root, classes.positionRelative]),
-          message: classes.message,
-        }}
-        message={notification}
+        className='relative flex flex-wrap text-lg/[1.43] items-center rounded-md bg-blue-600 shadow-3 w-[27.5em] text-white p-[1.5em] overflow-hidden'
         ref={ref}
-      />
+        role='alert'
+      >
+        {notification}
+      </div>
     )
   }
 )

package/src/ApplicationUpdateNotification/__snapshots__/test.tsx.snap

@@ -6,43 +6,39 @@ exports[`ApplicationUpdateNotification renders 1`] = `
     class="Picasso-root"
   >
     <div
-      class="MuiPaper-root MuiSnackbarContent-root ApplicationUpdateNotification-root ApplicationUpdateNotification-positionRelative MuiPaper-elevation6"
+      class="relative flex flex-wrap text-lg/[1.43] items-center rounded-md bg-blue shadow-3 w-[27.5em] text-white p-[1.5em] overflow-hidden"
       role="alert"
     >
       <div
-        class="MuiSnackbarContent-message ApplicationUpdateNotification-message"
+        class="gap-2 flex flex-col"
       >
+        <svg
+          class="opacity-40 absolute -top -left fill-blue"
+          height="105"
+          viewBox="0 0 105 105"
+          width="105"
+        >
+          <path
+            d="M8.364 72.364h32v8h-21.47c.829.99 1.701 1.942 2.614 2.855C29.641 91.353 40.63 96 52.364 96 76.464 96 96 76.463 96 52.364h8.727c0 28.92-23.444 52.363-52.363 52.363A52.192 52.192 0 0116.363 90.39v13.975h-8v-32zM52.364 0a52.192 52.192 0 0136 14.338V.364h8v32h-32v-8l21.469-.001a43.924 43.924 0 00-2.614-2.855c-8.133-8.133-19.12-12.78-30.855-12.78-24.1 0-43.637 19.536-43.637 43.636H0C0 23.444 23.444 0 52.364 0z"
+          />
+        </svg>
         <div
-          class="gap-2 flex flex-col"
+          class="items-start justify-between flex"
         >
-          <svg
-            class="ApplicationUpdateNotification-icon"
-            height="105"
-            viewBox="0 0 105 105"
-            width="105"
-          >
-            <path
-              d="M8.364 72.364h32v8h-21.47c.829.99 1.701 1.942 2.614 2.855C29.641 91.353 40.63 96 52.364 96 76.464 96 96 76.463 96 52.364h8.727c0 28.92-23.444 52.363-52.363 52.363A52.192 52.192 0 0116.363 90.39v13.975h-8v-32zM52.364 0a52.192 52.192 0 0136 14.338V.364h8v32h-32v-8l21.469-.001a43.924 43.924 0 00-2.614-2.855c-8.133-8.133-19.12-12.78-30.855-12.78-24.1 0-43.637 19.536-43.637 43.636H0C0 23.444 23.444 0 52.364 0z"
-            />
-          </svg>
-          <div
-            class="items-start justify-between flex"
+          <h3
+            class="m-0 text-lg text-inherit font-semibold relative"
           >
-            <h3
-              class="m-0 text-lg text-inherit font-semibold ApplicationUpdateNotification-positionRelative"
-            >
-              A New Update is Available
-            </h3>
-          </div>
-          <div
-            class="ApplicationUpdateNotification-positionRelative"
+            A New Update is Available
+          </h3>
+        </div>
+        <div
+          class="relative"
+        >
+          <p
+            class="m-0 text-md text-inherit font-regular"
           >
-            <p
-              class="m-0 text-md text-inherit font-regular"
-            >
-              Get performance improvements and bug fixes with this update. Make sure to save any data on this page before updating.
-            </p>
-          </div>
+            Get performance improvements and bug fixes with this update. Make sure to save any data on this page before updating.
+          </p>
         </div>
       </div>
     </div>

package/LICENSE

@@ -1,20 +0,0 @@
-MIT License
-
-Copyright (c) 2021-2022 Toptal, LLC
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of
-this software and associated documentation files (the “Software”), to deal in
-the Software without restriction, including without limitation the rights to
-use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
-the Software, and to permit persons to whom the Software is furnished to do so,
-subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
-FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
-COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
-IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
-CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/dist-package/src/ApplicationUpdateNotification/styles.d.ts

@@ -1,4 +0,0 @@
-import type { Theme } from '@material-ui/core/styles';
-declare const _default: ({ palette, sizes, shadows }: Theme) => import("@material-ui/styles").StyleRules<{}, "root" | "icon" | "message" | "positionRelative">;
-export default _default;
-//# sourceMappingURL=styles.d.ts.map

package/dist-package/src/ApplicationUpdateNotification/styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/ApplicationUpdateNotification/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;sDAGR,KAAK;AAAlD,wBAyBI"}

package/dist-package/src/ApplicationUpdateNotification/styles.js

@@ -1,27 +0,0 @@
-import { createStyles } from '@material-ui/core/styles';
-export default ({ palette, sizes, shadows }) => createStyles({
-    root: {
-        borderRadius: sizes.borderRadius.medium,
-        backgroundColor: palette.blue.dark,
-        boxShadow: shadows[3],
-        width: '27.5em',
-        color: palette.common.white,
-        overflow: 'hidden',
-        padding: '1.5em',
-    },
-    message: {
-        padding: 0,
-        flexDirection: 'column',
-    },
-    icon: {
-        opacity: 0.4,
-        position: 'absolute',
-        top: '-0.4em',
-        left: '-0.5em',
-        fill: palette.blue.darker,
-    },
-    positionRelative: {
-        position: 'relative',
-    },
-});
-//# sourceMappingURL=styles.js.map

package/dist-package/src/ApplicationUpdateNotification/styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/ApplicationUpdateNotification/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAS,EAAE,EAAE,CACpD,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,MAAM;QACvC,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;QAClC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;QACrB,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;QAC3B,QAAQ,EAAE,QAAQ;QAClB,OAAO,EAAE,OAAO;KACjB;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,aAAa,EAAE,QAAQ;KACxB;IACD,IAAI,EAAE;QACJ,OAAO,EAAE,GAAG;QACZ,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,QAAQ;QACb,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,MAAM;KAC1B;IACD,gBAAgB,EAAE;QAChB,QAAQ,EAAE,UAAU;KACrB;CACF,CAAC,CAAA"}

package/src/ApplicationUpdateNotification/styles.ts

@@ -1,29 +0,0 @@
-import type { Theme } from '@material-ui/core/styles'
-import { createStyles } from '@material-ui/core/styles'
-
-export default ({ palette, sizes, shadows }: Theme) =>
-  createStyles({
-    root: {
-      borderRadius: sizes.borderRadius.medium,
-      backgroundColor: palette.blue.dark,
-      boxShadow: shadows[3],
-      width: '27.5em',
-      color: palette.common.white,
-      overflow: 'hidden',
-      padding: '1.5em',
-    },
-    message: {
-      padding: 0,
-      flexDirection: 'column',
-    },
-    icon: {
-      opacity: 0.4,
-      position: 'absolute',
-      top: '-0.4em',
-      left: '-0.5em',
-      fill: palette.blue.darker,
-    },
-    positionRelative: {
-      position: 'relative',
-    },
-  })