@linagora/twake-mui 14.3.0 → 14.4.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# @linagora/twake-mui [14.4.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@14.3.0...@linagora/twake-mui@14.4.0) (2026-10-15)
+
+
+### Features
+
+* **twake-mui:** Migrate AlertProvider from cozy-ui ([9abdc95](https://github.com/linagora/twake-ui/commit/9abdc95037d43d96d2cdcc5c498567f0e065d018))
+
 # @linagora/twake-mui [14.3.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@14.2.0...@linagora/twake-mui@14.3.0) (2026-10-15)
 
 

package/dist/components/ActionsMenu/Actions/favorites.d.ts

@@ -1,4 +1,5 @@
-import { Action, ActionDocument, ShowAlert } from '../types';
+import { ShowAlert } from '../../../providers/AlertProvider/useAlert';
+import { Action, ActionDocument } from '../types';
 export interface FavoritesActionOptions {
     client: {
         save: (doc: ActionDocument) => Promise<unknown>;

package/dist/components/ActionsMenu/types.d.ts

@@ -57,12 +57,6 @@ export interface Action<Options extends object = ActionCallbackOptions> {
 /** An action keyed by its name, as built by `makeActions` */
 export type ActionObject = Record<string, Action>;
 export type ActionFactory<FactoryOptions extends object = object> = (options: FactoryOptions) => Action;
-export interface ShowAlertOptions {
-    message: string;
-    severity: 'success' | 'error' | 'info' | 'warning';
-    variant?: 'filled' | 'outlined' | 'standard';
-}
-export type ShowAlert = (options: ShowAlertOptions) => void;
 export interface WebLinkOptions {
     slug: string;
     cozyUrl: string;

package/dist/components/PointerAlert/PointerAlert.stories.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-console */
-import { DeviceLaptop, Download, Icon } from '@linagora/twake-icons';
+import { Download, Icon } from '@linagora/twake-icons';
 import { AlertTitle, Button, Stack, Typography } from '@mui/material';
 import React from 'react';
 import PointerAlert from './index';
@@ -39,8 +39,7 @@ const meta = {
             control: 'select',
             options: severities,
             description: 'Overrides the colour taken from `severity`'
-        },
-        square: { control: 'boolean' }
+        }
     }
 };
 export default meta;
@@ -73,14 +72,6 @@ export const Screenshot = {
             React.createElement(PointerAlert, { severity: "primary" },
                 React.createElement(AlertTitle, null, "This is the title"),
                 text),
-            React.createElement(PointerAlert, { severity: "primary", color: "warning" },
-                "Colour overridden: ",
-                text),
-            React.createElement(PointerAlert, { severity: "primary", icon: React.createElement(Icon, { icon: DeviceLaptop, color: "var(--twake-palette-error-main)", size: 32 }) }, text),
-            React.createElement(PointerAlert, { severity: "primary", icon: false }, text),
-            React.createElement(PointerAlert, { severity: "primary", square: true },
-                "Square: ",
-                text),
             React.createElement(PointerAlert, { severity: "primary", onClose: () => console.log('closed') }, text),
             React.createElement(PointerAlert, { severity: "primary", action: React.createElement(React.Fragment, null,
                     downloadAction,

package/dist/index.d.ts

@@ -5,7 +5,7 @@ export { default as Autocomplete } from '@mui/material/Autocomplete';
 export { makePalette } from './lib/makePalette';
 export { theme } from './lib/theme';
 export { radius } from './lib/radius';
-export { TwakeMuiThemeProvider } from './components/ThemeProvider';
+export { TwakeMuiThemeProvider } from './providers/ThemeProvider';
 export { default as ActionsBar } from './components/ActionsBar';
 export { default as ActionsMenu } from './components/ActionsMenu';
 export { default as ActionsMenuWrapper } from './components/ActionsMenu/ActionsMenuWrapper';
@@ -57,6 +57,10 @@ export { default as LoadMore } from './components/LoadMore';
 export { default as Markdown } from './components/Markdown';
 export { default as MidEllipsis } from './components/MidEllipsis';
 export { default as PointerAlert } from './components/PointerAlert';
+export type { AlertProviderProps } from './providers/AlertProvider';
+export type { AlertContextValue, ShowAlert, ShowAlertOptions } from './providers/AlertProvider/useAlert';
+export { default as AlertProvider } from './providers/AlertProvider';
+export { useAlert } from './providers/AlertProvider/useAlert';
 export { default as ProgressionBanner } from './components/ProgressionBanner';
 export { Tabs, default as TabsDefault } from './components/Tabs';
 export { Switch, default as SwitchDefault } from './components/Switch';
@@ -92,7 +96,7 @@ export type { ActionsMenuItemProps } from './components/ActionsMenu/ActionsMenuI
 export type { ActionsMenuMobileHeaderProps } from './components/ActionsMenu/ActionsMenuMobileHeader';
 export type { ActionsMenuButtonProps } from './components/ActionsMenu/ActionsMenuButton';
 export type { ActionsItemsProps } from './components/ActionsMenu/ActionsItems';
-export type { Action, ActionCallbackOptions, ActionComponent, ActionComponentProps, ActionComponentSlotProps, ActionDocument, ActionFactory, ActionObject, ActionTranslate, GenerateWebLink, ShowAlert, ShowAlertOptions, WebLinkActionOptions, WebLinkClient, WebLinkOptions } from './components/ActionsMenu/types';
+export type { Action, ActionCallbackOptions, ActionComponent, ActionComponentProps, ActionComponentSlotProps, ActionDocument, ActionFactory, ActionObject, ActionTranslate, GenerateWebLink, WebLinkActionOptions, WebLinkClient, WebLinkOptions } from './components/ActionsMenu/types';
 export type { MakeActionComponentOptions, MakeActionOptions } from './components/ActionsMenu/Actions/makeAction';
 export type { AppWebLinkOptions, FetchBlobFileById, MakePdfBlobOptions } from './components/ActionsMenu/Actions/helpers';
 export type { WrapTextToLinesOptions, PdfCursor, PushNewPageIfNeededOptions, DrawWrappedTextOptions } from './components/ActionsMenu/Actions/pdfHelpers';

package/dist/index.js

@@ -8,7 +8,7 @@ export { makePalette } from './lib/makePalette';
 export { theme } from './lib/theme';
 export { radius } from './lib/radius';
 // COMPONENTS & HELPERS
-export { TwakeMuiThemeProvider } from './components/ThemeProvider';
+export { TwakeMuiThemeProvider } from './providers/ThemeProvider';
 export { default as ActionsBar } from './components/ActionsBar';
 export { default as ActionsMenu } from './components/ActionsMenu';
 export { default as ActionsMenuWrapper } from './components/ActionsMenu/ActionsMenuWrapper';
@@ -60,6 +60,8 @@ export { default as LoadMore } from './components/LoadMore';
 export { default as Markdown } from './components/Markdown';
 export { default as MidEllipsis } from './components/MidEllipsis';
 export { default as PointerAlert } from './components/PointerAlert';
+export { default as AlertProvider } from './providers/AlertProvider';
+export { useAlert } from './providers/AlertProvider/useAlert';
 export { default as ProgressionBanner } from './components/ProgressionBanner';
 export { Tabs, default as TabsDefault } from './components/Tabs';
 export { Switch, default as SwitchDefault } from './components/Switch';

package/dist/providers/AlertProvider/AlertProvider.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { ShowAlertOptions } from './useAlert';
+interface StoryArgs extends ShowAlertOptions {
+    closable: boolean;
+}
+declare const meta: Meta<StoryArgs>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/providers/AlertProvider/AlertProvider.stories.js

@@ -0,0 +1,57 @@
+import { Button } from '@mui/material';
+import React from 'react';
+import AlertProvider from './index';
+import { useAlert } from './useAlert';
+const severities = [
+    'primary',
+    'secondary',
+    'success',
+    'error',
+    'warning',
+    'info'
+];
+const variants = ['filled', 'standard', 'outlined'];
+const makeOptions = ({ closable, ...options }) => closable ? options : { ...options, onClose: undefined };
+const meta = {
+    title: 'AlertProvider',
+    parameters: { layout: 'centered' },
+    tags: ['autodocs'],
+    argTypes: {
+        message: { control: 'text' },
+        title: { control: 'text' },
+        severity: { control: 'select', options: severities },
+        variant: { control: 'select', options: variants },
+        icon: {
+            control: 'select',
+            options: ['default', 'none'],
+            mapping: { default: undefined, none: false }
+        },
+        duration: {
+            control: 'number',
+            description: 'Milliseconds before the alert hides, `null` to keep it open'
+        },
+        noTimeOut: { control: 'boolean' },
+        noClickAway: { control: 'boolean' },
+        closable: {
+            control: 'boolean',
+            description: 'Story only: passes `onClose: undefined` when off'
+        }
+    }
+};
+export default meta;
+const ShowAlertButton = ({ args }) => {
+    const { showAlert } = useAlert();
+    return (React.createElement(Button, { onClick: () => showAlert(makeOptions(args)) }, "Show alert"));
+};
+export const Default = {
+    args: {
+        message: 'Alert message',
+        severity: 'success',
+        variant: 'filled',
+        noTimeOut: false,
+        noClickAway: false,
+        closable: true
+    },
+    render: args => (React.createElement(AlertProvider, null,
+        React.createElement(ShowAlertButton, { args: args })))
+};

package/dist/providers/AlertProvider/index.d.ts

@@ -0,0 +1,6 @@
+import React, { ReactNode } from 'react';
+export interface AlertProviderProps {
+    children?: ReactNode;
+}
+declare const AlertProvider: React.FC<AlertProviderProps>;
+export default AlertProvider;

package/dist/providers/AlertProvider/index.js

@@ -0,0 +1,25 @@
+import { Alert, AlertTitle, Snackbar } from '@mui/material';
+import React, { useMemo, useState } from 'react';
+import { AlertContext } from './useAlert';
+const AlertProvider = ({ children }) => {
+    const [state, setState] = useState({ message: '', open: false });
+    const { open, message, title, duration, noTimeOut, noClickAway, ...alertProps } = state;
+    const value = useMemo(() => ({
+        showAlert: (options) => setState({ ...options, open: true })
+    }), []);
+    const close = () => setState(current => ({ ...current, open: false }));
+    const handleSnackbarClose = (_event, reason) => {
+        if (reason === 'clickaway' && noClickAway)
+            return;
+        if (reason === 'timeout' && noTimeOut)
+            return;
+        close();
+    };
+    return (React.createElement(AlertContext.Provider, { value: value },
+        children,
+        React.createElement(Snackbar, { open: open, autoHideDuration: duration, onClose: handleSnackbarClose },
+            React.createElement(Alert, { variant: "filled", elevation: 6, onClose: close, ...alertProps },
+                title && React.createElement(AlertTitle, null, title),
+                message))));
+};
+export default AlertProvider;

package/dist/providers/AlertProvider/useAlert.d.ts

@@ -0,0 +1,17 @@
+import type { AlertProps } from '@mui/material';
+export interface ShowAlertOptions extends Omit<AlertProps, 'title'> {
+    message: string;
+    title?: string;
+    /** Milliseconds before the alert hides, `null` to keep it open */
+    duration?: number | null;
+    /** Ignores the timeout set by `duration` */
+    noTimeOut?: boolean;
+    /** Keeps the alert open on a click outside of it */
+    noClickAway?: boolean;
+}
+export type ShowAlert = (options: ShowAlertOptions) => void;
+export interface AlertContextValue {
+    showAlert: ShowAlert;
+}
+export declare const AlertContext: import("react").Context<AlertContextValue | null>;
+export declare const useAlert: () => AlertContextValue;

package/dist/providers/AlertProvider/useAlert.js

@@ -0,0 +1,9 @@
+import { createContext, useContext } from 'react';
+export const AlertContext = createContext(null);
+export const useAlert = () => {
+    const context = useContext(AlertContext);
+    if (!context) {
+        throw new Error('useAlert must be used within a AlertProvider');
+    }
+    return context;
+};

package/dist/stories/ThemePlayground.stories.js

@@ -1,7 +1,7 @@
 import { Button, Stack, Chip } from '@mui/material';
 import React from 'react';
-import { TwakeMuiThemeProvider } from '../components/ThemeProvider';
 import { makePalette } from '../lib/makePalette';
+import { TwakeMuiThemeProvider } from '../providers/ThemeProvider';
 const CUSTOM_PALETTE = {
     Primary: {
         50: '#FFF9F6',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@linagora/twake-mui",
   "type": "module",
-  "version": "14.3.0",
+  "version": "14.4.0",
   "description": "MUI v9 theme system for Twake applications",
   "author": "Twake",
   "license": "MIT",