cozy-ui 122.11.1 → 122.12.1

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+## [122.12.1](https://github.com/cozy/cozy-ui/compare/v122.12.0...v122.12.1) (2025-05-07)
+
+
+### Bug Fixes
+
+* **AppLinker:** Call onAppSwitch in flagship app ([eced0d4](https://github.com/cozy/cozy-ui/commit/eced0d4))
+
+# [122.12.0](https://github.com/cozy/cozy-ui/compare/v122.11.1...v122.12.0) (2025-05-05)
+
+
+### Features
+
+* **Dialogs:** Add `componentsProps.dialogContent.className` support ([cfa17e5](https://github.com/cozy/cozy-ui/commit/cfa17e5))
+* **PermissionDialog:** Remove `inverted` theme ([43d3049](https://github.com/cozy/cozy-ui/commit/43d3049))
+
 ## [122.11.1](https://github.com/cozy/cozy-ui/compare/v122.11.0...v122.11.1) (2025-04-28)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-ui",
-  "version": "122.11.1",
+  "version": "122.12.1",
   "description": "Cozy apps UI SDK",
   "main": "./index.js",
   "bin": {

package/react/AppLinker/index.jsx

@@ -33,7 +33,8 @@ export class AppLinker extends React.Component {
   }
 
   static getOnClickHref(props, context, imgRef) {
-    const { app, client } = props
+    const { app, client, onAppSwitch } = props
+
     let href = props.href
     let onClick = null
 
@@ -53,6 +54,8 @@ export class AppLinker extends React.Component {
           onClick: event => {
             event.preventDefault()
 
+            onAppSwitch?.()
+
             context
               ? context.call('openApp', href, app, imgPayload)
               : logger.error(
@@ -70,16 +73,6 @@ export class AppLinker extends React.Component {
     }
   }
 
-  static onAppSwitch(onAppSwitchFn) {
-    if (typeof onAppSwitchFn === 'function') {
-      onAppSwitchFn()
-    }
-  }
-
-  static openWeb(props) {
-    AppLinker.onAppSwitch(props.onAppSwitch)
-  }
-
   render() {
     const { children } = this.props
 

package/react/CozyDialogs/PermissionDialog.jsx

@@ -5,7 +5,6 @@ import React from 'react'
 import ConfirmDialog from './ConfirmDialog'
 import Icon from '../Icon'
 import Paper from '../Paper'
-import CozyTheme from '../providers/CozyTheme'
 import { makeStyles } from '../styles'
 
 const useStyles = makeStyles({
@@ -31,46 +30,39 @@ const PermissionDialog = ({
   const styles = useStyles()
 
   return (
-    <CozyTheme variant="inverted">
-      <ConfirmDialog
-        open={open}
-        size="small"
-        disableTitleAutoPadding
-        classes={{
-          // remove overflow in makeOverride and replace it by u-ov-visible when https://github.com/cozy/cozy-ui/issues/2284 is solved
-          paper: 'overflow'
-        }}
-        componentsProps={{
-          dialogTitle: {
-            className: 'u-ta-center u-pt-2 u-pb-half'
-          }
-        }}
-        title={
-          <>
-            <CozyTheme
-              variant="normal"
-              className="u-flex u-flex-justify-center"
-            >
-              <Paper
-                square
-                elevation={2}
-                className={cx(
-                  styles.floatingIcon,
-                  'u-pos-absolute u-bdrs-circle u-flex u-bg-white'
-                )}
-              >
-                <Icon className="u-m-auto" icon={icon} size={48} />
-              </Paper>
-            </CozyTheme>
-            {title}
-          </>
+    <ConfirmDialog
+      open={open}
+      size="small"
+      disableTitleAutoPadding
+      classes={{ paper: 'u-ov-visible' }}
+      componentsProps={{
+        dialogTitle: {
+          className: 'u-flex u-flex-justify-center u-ta-center u-pt-2 u-pb-half'
+        },
+        dialogContent: {
+          className: 'u-ov-visible'
         }
-        content={content}
-        actions={actions}
-        actionsLayout={actionsLayout}
-        onClose={onClose}
-      />
-    </CozyTheme>
+      }}
+      title={
+        <>
+          <Paper
+            elevation={2}
+            className={cx(
+              styles.floatingIcon,
+              'u-pos-absolute u-bdrs-circle u-flex'
+            )}
+          >
+            <Icon className="u-m-auto" icon={icon} size={48} />
+          </Paper>
+
+          {title}
+        </>
+      }
+      content={content}
+      actions={actions}
+      actionsLayout={actionsLayout}
+      onClose={onClose}
+    />
   )
 }
 

package/react/CozyDialogs/useCozyDialog.js

@@ -114,7 +114,10 @@ const useCozyDialog = props => {
       }),
       ...componentsProps?.dialogContent?.classes
     },
-    className: 'cozyDialogContent'
+    className: cx(
+      'cozyDialogContent',
+      componentsProps?.dialogContent?.className
+    )
   }
 
   return {

package/react/MuiCozyTheme/overrides/makeLightNormalOverrides.js

@@ -564,12 +564,6 @@ export const makeLightNormalOverrides = theme => ({
       '&.full': {
         width: '100%',
         maxWidth: '100%'
-      },
-      '&.overflow': {
-        overflowY: 'visible !important', // Allow the icon to overflow the dialog, otherwise it will be cut off,
-        '& .cozyDialogContent': {
-          overflowY: 'visible !important' // This allow the overflow to work also on iOS
-        }
       }
     },
     scrollPaper: {

package/transpiled/react/AppLinker/index.d.ts

@@ -8,8 +8,6 @@ export class AppLinker extends React.Component<any, any, any> {
         href: any;
         onClick: null;
     };
-    static onAppSwitch(onAppSwitchFn: any): void;
-    static openWeb(props: any): void;
     constructor(props: any);
     state: {
         imgRef: null;

package/transpiled/react/AppLinker/index.js

@@ -72,7 +72,8 @@ export var AppLinker = /*#__PURE__*/function (_React$Component) {
     key: "getOnClickHref",
     value: function getOnClickHref(props, context, imgRef) {
       var app = props.app,
-          client = props.client;
+          client = props.client,
+          onAppSwitch = props.onAppSwitch;
       var href = props.href;
       var onClick = null;
 
@@ -85,6 +86,7 @@ export var AppLinker = /*#__PURE__*/function (_React$Component) {
           return {
             onClick: function onClick(event) {
               event.preventDefault();
+              onAppSwitch === null || onAppSwitch === void 0 ? void 0 : onAppSwitch();
               context ? context.call('openApp', href, app, imgPayload) : logger.error("Failed to \"openApp(".concat(app, ")\". WebviewService has the following falsy value \"").concat(context, "\" in AppLinker's context."));
             },
             href: '#'
@@ -97,18 +99,6 @@ export var AppLinker = /*#__PURE__*/function (_React$Component) {
         onClick: onClick
       };
     }
-  }, {
-    key: "onAppSwitch",
-    value: function onAppSwitch(onAppSwitchFn) {
-      if (typeof onAppSwitchFn === 'function') {
-        onAppSwitchFn();
-      }
-    }
-  }, {
-    key: "openWeb",
-    value: function openWeb(props) {
-      AppLinker.onAppSwitch(props.onAppSwitch);
-    }
   }]);
 
   return AppLinker;

package/transpiled/react/CozyDialogs/PermissionDialog.js

@@ -4,7 +4,6 @@ import React from 'react';
 import ConfirmDialog from "cozy-ui/transpiled/react/CozyDialogs/ConfirmDialog";
 import Icon from "cozy-ui/transpiled/react/Icon";
 import Paper from "cozy-ui/transpiled/react/Paper";
-import CozyTheme from "cozy-ui/transpiled/react/providers/CozyTheme";
 import { makeStyles } from "cozy-ui/transpiled/react/styles";
 var useStyles = makeStyles({
   floatingIcon: {
@@ -26,38 +25,34 @@ var PermissionDialog = function PermissionDialog(_ref) {
       actionsLayout = _ref.actionsLayout,
       onClose = _ref.onClose;
   var styles = useStyles();
-  return /*#__PURE__*/React.createElement(CozyTheme, {
-    variant: "inverted"
-  }, /*#__PURE__*/React.createElement(ConfirmDialog, {
+  return /*#__PURE__*/React.createElement(ConfirmDialog, {
     open: open,
     size: "small",
     disableTitleAutoPadding: true,
     classes: {
-      // remove overflow in makeOverride and replace it by u-ov-visible when https://github.com/cozy/cozy-ui/issues/2284 is solved
-      paper: 'overflow'
+      paper: 'u-ov-visible'
     },
     componentsProps: {
       dialogTitle: {
-        className: 'u-ta-center u-pt-2 u-pb-half'
+        className: 'u-flex u-flex-justify-center u-ta-center u-pt-2 u-pb-half'
+      },
+      dialogContent: {
+        className: 'u-ov-visible'
       }
     },
-    title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CozyTheme, {
-      variant: "normal",
-      className: "u-flex u-flex-justify-center"
-    }, /*#__PURE__*/React.createElement(Paper, {
-      square: true,
+    title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Paper, {
       elevation: 2,
-      className: cx(styles.floatingIcon, 'u-pos-absolute u-bdrs-circle u-flex u-bg-white')
+      className: cx(styles.floatingIcon, 'u-pos-absolute u-bdrs-circle u-flex')
     }, /*#__PURE__*/React.createElement(Icon, {
       className: "u-m-auto",
       icon: icon,
       size: 48
-    }))), title),
+    })), title),
     content: content,
     actions: actions,
     actionsLayout: actionsLayout,
     onClose: onClose
-  }));
+  });
 };
 
 PermissionDialog.propTypes = {

package/transpiled/react/CozyDialogs/useCozyDialog.js

@@ -24,7 +24,7 @@ var useStyles = makeStyles({
 });
 
 var useCozyDialog = function useCozyDialog(props) {
-  var _componentsProps$dial, _componentsProps$dial2;
+  var _componentsProps$dial, _componentsProps$dial2, _componentsProps$dial3;
 
   var size = props.size,
       actions = props.actions,
@@ -118,7 +118,7 @@ var useCozyDialog = function useCozyDialog(props) {
         disableGutters: disableGutters
       })
     }, componentsProps === null || componentsProps === void 0 ? void 0 : (_componentsProps$dial2 = componentsProps.dialogContent) === null || _componentsProps$dial2 === void 0 ? void 0 : _componentsProps$dial2.classes),
-    className: 'cozyDialogContent'
+    className: cx('cozyDialogContent', componentsProps === null || componentsProps === void 0 ? void 0 : (_componentsProps$dial3 = componentsProps.dialogContent) === null || _componentsProps$dial3 === void 0 ? void 0 : _componentsProps$dial3.className)
   });
 
   return {

package/transpiled/react/MuiCozyTheme/overrides/makeDarkInvertedOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeDarkInvertedOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/makeDarkNormalOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeDarkNormalOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/makeLightInvertedOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeLightInvertedOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/makeLightNormalOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeLightNormalOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/makeLightNormalOverrides.js

@@ -528,14 +528,6 @@ export var makeLightNormalOverrides = function makeLightNormalOverrides(theme) {
         '&.full': {
           width: '100%',
           maxWidth: '100%'
-        },
-        '&.overflow': {
-          overflowY: 'visible !important',
-          // Allow the icon to overflow the dialog, otherwise it will be cut off,
-          '& .cozyDialogContent': {
-            overflowY: 'visible !important' // This allow the overflow to work also on iOS
-
-          }
         }
       },
       scrollPaper: {

package/transpiled/react/MuiCozyTheme/overrides/twake/makeDarkInvertedOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeDarkInvertedTwakeOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/twake/makeDarkNormalOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeDarkNormalTwakeOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/twake/makeLightInvertedOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeLightInvertedTwakeOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {

package/transpiled/react/MuiCozyTheme/overrides/twake/makeLightNormalOverrides.d.ts

@@ -631,12 +631,6 @@ export function makeLightNormalTwakeOverrides(theme: any): {
                 width: string;
                 maxWidth: string;
             };
-            '&.overflow': {
-                overflowY: string;
-                '& .cozyDialogContent': {
-                    overflowY: string;
-                };
-            };
         };
         scrollPaper: {
             '&.alignTop': {