@linagora/twake-mui 9.11.0 → 9.11.2

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## @linagora/twake-mui [9.11.2](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@9.11.1...@linagora/twake-mui@9.11.2) (2026-09-29)
+
+
+### Bug Fixes
+
+* Added break-word to long name and email ([fdfcd16](https://github.com/linagora/twake-ui/commit/fdfcd16b7a381eb9272e1e405f60fc65c85fbbdd))
+* Added disable param for contact popover actions ([fe4af23](https://github.com/linagora/twake-ui/commit/fe4af23240350aa9df0b2a9a58a2bb255340efce))
+* Removed fullwidth from email action button ([e7eb7da](https://github.com/linagora/twake-ui/commit/e7eb7dae06b5afc4421b5f77c512e765ee7b7dfb))
+
+## @linagora/twake-mui [9.11.1](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@9.11.0...@linagora/twake-mui@9.11.1) (2026-09-29)
+
+
+### Reverts
+
+* Revert "feat(twake-mui): Migrate ExtendableFab from cozy-ui" ([671a8f7](https://github.com/linagora/twake-ui/commit/671a8f7621b383aeec7071bda645d07560d6f470))
+
 # @linagora/twake-mui [9.11.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@9.10.0...@linagora/twake-mui@9.11.0) (2026-09-29)
 
 

package/dist/components/ContactPopover/AttendeeInfo.js

@@ -25,9 +25,9 @@ export const AttendeeInfo = ({ name, email, onEmailCopy }) => {
     return (React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 2 } },
         React.createElement(Avatar, { color: avatarColor, size: 48, sx: { width: 48, height: 48, fontSize: '1.25rem' } }, initials),
         React.createElement(Box, { sx: { minWidth: 0 } },
-            name && name !== email ? (React.createElement(Typography, { variant: "body1", sx: { fontWeight: 500 }, noWrap: true }, name)) : null,
+            name && name !== email ? (React.createElement(Typography, { variant: "body1", sx: { fontWeight: 500, wordBreak: 'break-word' } }, name)) : null,
             React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 } },
-                React.createElement(Typography, { variant: "body2", color: "text.secondary", noWrap: true }, email),
+                React.createElement(Typography, { variant: "body2", color: "text.secondary", sx: { wordBreak: 'break-word' } }, email),
                 React.createElement(IconButton, { size: "small", onClick: () => void handleCopy(), sx: { p: 0.5, color: alpha(theme.palette.grey[900], 0.9) }, title: showCopied
                         ? t('ContactPopover.copiedTooltip')
                         : t('ContactPopover.copyTooltip') },

package/dist/components/ContactPopover/ContactPopoverCalendarAction.d.ts

@@ -1,5 +1,7 @@
 export interface ContactPopoverCalendarActionProps {
     /** URL for calendar action (e.g., view attendee's calendar) */
     url: string;
+    /** Disable the action button */
+    disabled?: boolean;
 }
-export declare const ContactPopoverCalendarAction: ({ url }: ContactPopoverCalendarActionProps) => JSX.Element;
+export declare const ContactPopoverCalendarAction: ({ url, disabled }: ContactPopoverCalendarActionProps) => JSX.Element;

package/dist/components/ContactPopover/ContactPopoverCalendarAction.js

@@ -2,8 +2,8 @@ import { Icon } from '@linagora/twake-icons';
 import { CalendarToday } from '@linagora/twake-icons';
 import { IconButton, useTheme } from '@mui/material';
 import React from 'react';
-export const ContactPopoverCalendarAction = ({ url }) => {
+export const ContactPopoverCalendarAction = ({ url, disabled = false }) => {
     const theme = useTheme();
-    return (React.createElement(IconButton, { href: url, target: "_blank", rel: "noopener noreferrer", size: "small", sx: { border: `1px solid ${theme.palette.divider}` } },
+    return (React.createElement(IconButton, { href: url, target: "_blank", rel: "noopener noreferrer", size: "small", disabled: disabled, sx: { border: `1px solid ${theme.palette.divider}` } },
         React.createElement(Icon, { icon: CalendarToday, size: 20, color: theme.palette.text.icon })));
 };

package/dist/components/ContactPopover/ContactPopoverChatAction.d.ts

@@ -1,5 +1,7 @@
 export interface ContactPopoverChatActionProps {
     /** URL for chat action (e.g., Twake Chat link) */
     url: string;
+    /** Disable the action button */
+    disabled?: boolean;
 }
-export declare const ContactPopoverChatAction: ({ url }: ContactPopoverChatActionProps) => JSX.Element;
+export declare const ContactPopoverChatAction: ({ url, disabled }: ContactPopoverChatActionProps) => JSX.Element;

package/dist/components/ContactPopover/ContactPopoverChatAction.js

@@ -2,8 +2,8 @@ import { Icon } from '@linagora/twake-icons';
 import { Discuss } from '@linagora/twake-icons';
 import { IconButton, useTheme } from '@mui/material';
 import React from 'react';
-export const ContactPopoverChatAction = ({ url }) => {
+export const ContactPopoverChatAction = ({ url, disabled = false }) => {
     const theme = useTheme();
-    return (React.createElement(IconButton, { href: url, target: "_blank", rel: "noopener noreferrer", size: "small", sx: { border: `1px solid ${theme.palette.divider}` } },
+    return (React.createElement(IconButton, { href: url, target: "_blank", rel: "noopener noreferrer", size: "small", disabled: disabled, sx: { border: `1px solid ${theme.palette.divider}` } },
         React.createElement(Icon, { icon: Discuss, size: 20, color: theme.palette.text.icon })));
 };

package/dist/components/ContactPopover/ContactPopoverEmailAction.d.ts

@@ -1,5 +1,7 @@
 export interface ContactPopoverEmailActionProps {
     /** URL for email action */
     url: string;
+    /** Disable the action button */
+    disabled?: boolean;
 }
-export declare const ContactPopoverEmailAction: ({ url }: ContactPopoverEmailActionProps) => JSX.Element;
+export declare const ContactPopoverEmailAction: ({ url, disabled }: ContactPopoverEmailActionProps) => JSX.Element;

package/dist/components/ContactPopover/ContactPopoverEmailAction.js

@@ -1,10 +1,10 @@
 import { Button, useTheme } from '@mui/material';
 import React from 'react';
 import { useI18n } from 'twake-i18n';
-export const ContactPopoverEmailAction = ({ url }) => {
+export const ContactPopoverEmailAction = ({ url, disabled = false }) => {
     const theme = useTheme();
     const { t } = useI18n();
-    return (React.createElement(Button, { href: url, target: "_blank", rel: "noopener noreferrer", variant: "outlined", size: "small", fullWidth: true, sx: {
+    return (React.createElement(Button, { href: url, target: "_blank", rel: "noopener noreferrer", variant: "outlined", size: "small", disabled: disabled, sx: {
             justifyContent: 'center',
             color: theme.palette.text.primary,
             borderColor: theme.palette.divider

package/dist/components/ContactPopover/ContactPopoverVideoAction.d.ts

@@ -1,5 +1,7 @@
 export interface ContactPopoverVideoActionProps {
     /** URL for video call action (e.g., Twake Meet link) */
     url: string;
+    /** Disable the action button */
+    disabled?: boolean;
 }
-export declare const ContactPopoverVideoAction: ({ url }: ContactPopoverVideoActionProps) => JSX.Element;
+export declare const ContactPopoverVideoAction: ({ url, disabled }: ContactPopoverVideoActionProps) => JSX.Element;

package/dist/components/ContactPopover/ContactPopoverVideoAction.js

@@ -2,8 +2,8 @@ import { Icon } from '@linagora/twake-icons';
 import { Camera } from '@linagora/twake-icons';
 import { IconButton, useTheme } from '@mui/material';
 import React from 'react';
-export const ContactPopoverVideoAction = ({ url }) => {
+export const ContactPopoverVideoAction = ({ url, disabled = false }) => {
     const theme = useTheme();
-    return (React.createElement(IconButton, { href: url, target: "_blank", rel: "noopener noreferrer", size: "small", sx: { border: `1px solid ${theme.palette.divider}` } },
+    return (React.createElement(IconButton, { href: url, target: "_blank", rel: "noopener noreferrer", size: "small", disabled: disabled, sx: { border: `1px solid ${theme.palette.divider}` } },
         React.createElement(Icon, { icon: Camera, size: 20, color: theme.palette.text.icon })));
 };

package/dist/components/ContactPopover/index.js

@@ -113,7 +113,8 @@ export const ContactPopover = ({ name, email, children, onEmailCopy, onClose, di
                 paper: {
                     elevation: 4,
                     sx: {
-                        borderRadius: 2
+                        borderRadius: 2,
+                        maxWidth: 400
                     },
                     onMouseEnter: handlePopoverMouseEnter,
                     onMouseLeave: handleMouseLeave

package/dist/index.d.ts

@@ -13,7 +13,6 @@ export { Dialog, default as DialogDefault } from './components/Dialog';
 export { ContactPopover, default as ContactPopoverDefault } from './components/ContactPopover';
 export { default as DropdownButton } from './components/DropdownButton';
 export { default as DropdownText } from './components/DropdownText';
-export { ExtendableFab } from './components/ExtendableFab';
 export { default as ListItem } from './components/ListItem';
 export { default as ListItemButton } from './components/ListItemButton';
 export { default as ListItemText } from './components/ListItemText';
@@ -50,7 +49,6 @@ export type { ChipProps } from './components/Chip';
 export type { DialogProps, DialogSize } from './components/Dialog';
 export type { DropdownButtonProps } from './components/DropdownButton';
 export type { DropdownTextProps, DropdownTextVariant } from './components/DropdownText';
-export type { ExtendableFabProps, ScrollOptions } from './components/ExtendableFab';
 export type { ListItemProps, ListItemGutters, ListItemSize } from './components/ListItem';
 export type { ListItemButtonProps } from './components/ListItemButton';
 export type { ListItemTextProps } from './components/ListItemText';

package/dist/index.js

@@ -16,7 +16,6 @@ export { Dialog, default as DialogDefault } from './components/Dialog';
 export { ContactPopover, default as ContactPopoverDefault } from './components/ContactPopover';
 export { default as DropdownButton } from './components/DropdownButton';
 export { default as DropdownText } from './components/DropdownText';
-export { ExtendableFab } from './components/ExtendableFab';
 export { default as ListItem } from './components/ListItem';
 export { default as ListItemButton } from './components/ListItemButton';
 export { default as ListItemText } from './components/ListItemText';

package/package.json

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

package/dist/components/ExtendableFab/ExtendableFab.stories.d.ts

@@ -1,7 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { ExtendableFab } from './index';
-declare const meta: Meta<typeof ExtendableFab>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-export declare const Screenshot: Story;

package/dist/components/ExtendableFab/ExtendableFab.stories.js

@@ -1,43 +0,0 @@
-import { Plus } from '@linagora/twake-icons';
-import { Box, Stack } from '@mui/material';
-import React from 'react';
-import { ExtendableFab } from './index';
-const meta = {
-    title: 'ExtendableFab',
-    component: ExtendableFab,
-    parameters: { layout: 'fullscreen' },
-    tags: ['autodocs'],
-    args: {
-        label: 'Add',
-        icon: Plus,
-        color: 'primary',
-        size: 'medium',
-        topLimit: 50,
-        scrollOptions: { delay: 250 }
-    },
-    argTypes: {
-        label: { control: 'text' },
-        icon: { control: false },
-        color: {
-            control: 'select',
-            options: ['default', 'primary', 'secondary', 'inherit']
-        },
-        size: { control: 'select', options: ['small', 'medium', 'large'] },
-        topLimit: { control: 'number' },
-        scrollOptions: { control: 'object' },
-        disabled: { control: 'boolean' }
-    }
-};
-export default meta;
-export const Default = {
-    render: args => (React.createElement(Box, { sx: { p: 2 } },
-        React.createElement(ExtendableFab, { sx: { position: 'sticky', top: 16 }, ...args }),
-        React.createElement(Box, { sx: { py: 2 } }, "Scroll the page vertically"),
-        React.createElement(Box, { sx: { height: '200vh' } })))
-};
-export const Screenshot = {
-    tags: ['argos'],
-    render: () => (React.createElement(Stack, { spacing: 2, direction: "row", sx: { p: 4 } },
-        React.createElement(ExtendableFab, { label: "Add", icon: Plus, color: "primary" }),
-        React.createElement(ExtendableFab, { label: "Add", icon: Plus, color: "inherit" })))
-};

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

@@ -1,16 +0,0 @@
-import { IconProps } from '@linagora/twake-icons';
-import { FabProps } from '@mui/material';
-import React from 'react';
-export interface ScrollOptions {
-    /** Delay in ms before the window scroll position is read */
-    delay?: number;
-}
-export interface ExtendableFabProps extends Omit<FabProps, 'ref' | 'children'> {
-    label: string;
-    icon: IconProps['icon'];
-    /** Window scroll offset in px below which the Fab stays extended */
-    topLimit?: number;
-    scrollOptions?: ScrollOptions;
-}
-export declare const ExtendableFab: React.ForwardRefExoticComponent<ExtendableFabProps & React.RefAttributes<HTMLButtonElement>>;
-export default ExtendableFab;

package/dist/components/ExtendableFab/index.js

@@ -1,17 +0,0 @@
-import { Icon } from '@linagora/twake-icons';
-import { Fab, styled } from '@mui/material';
-import React, { forwardRef, useState } from 'react';
-import { useDebounce, useOnWindowScroll } from 'rooks';
-const GappedFab = styled(Fab)(({ theme }) => ({ gap: theme.spacing(1) }));
-export const ExtendableFab = forwardRef(({ label, icon, topLimit = 50, scrollOptions, ...props }, ref) => {
-    const [isBelowTopLimit, setIsBelowTopLimit] = useState(true);
-    const handleScroll = useDebounce(() => {
-        setIsBelowTopLimit(window.scrollY < topLimit);
-    }, scrollOptions?.delay ?? 250);
-    useOnWindowScroll(handleScroll);
-    return (React.createElement(GappedFab, { ref: ref, "aria-label": label, variant: isBelowTopLimit ? 'extended' : 'circular', ...props },
-        React.createElement(Icon, { icon: icon }),
-        isBelowTopLimit && label));
-});
-ExtendableFab.displayName = 'ExtendableFab';
-export default ExtendableFab;