cozy-ui 79.5.0 → 80.0.0

package/CHANGELOG.md

@@ -1,3 +1,16 @@
+# [80.0.0](https://github.com/cozy/cozy-ui/compare/v79.5.0...v80.0.0) (2023-01-18)
+
+
+### Features
+
+* Deprecates `generateWebLink` in AppLinker ([3ab64e9](https://github.com/cozy/cozy-ui/commit/3ab64e9))
+* Upgrade cozy-client from 34.4.0 to 34.8.0 ([2a40c08](https://github.com/cozy/cozy-ui/commit/2a40c08))
+
+
+### BREAKING CHANGES
+
+* `cozy-client` must be `>=34.8.0`
+
 # [79.5.0](https://github.com/cozy/cozy-ui/compare/v79.4.0...v79.5.0) (2023-01-10)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-ui",
-  "version": "79.5.0",
+  "version": "80.0.0",
   "description": "Cozy apps UI SDK",
   "main": "./index.js",
   "bin": {
@@ -90,14 +90,14 @@
     "babel-preset-cozy-app": "2.0.2",
     "browserslist-config-cozy": "0.4.0",
     "copyfiles": "2.4.1",
-    "cozy-client": "^34.4.0",
+    "cozy-client": "^34.8.0",
     "cozy-device-helper": "2.0.0",
     "cozy-flags": "^2.10.1",
     "cozy-harvest-lib": "^6.7.3",
     "cozy-intent": "1.16.1",
     "cozy-logger": "^1.9.0",
     "cozy-sharing": "^3.10.0",
-    "cozy-stack-client": "^33.0.0",
+    "cozy-stack-client": "^34.7.3",
     "css-loader": "0.28.11",
     "cssnano": "4.1.11",
     "cssnano-preset-advanced": "4.0.8",
@@ -179,7 +179,7 @@
     "rooks": "^5.11.2"
   },
   "peerDependencies": {
-    "cozy-client": ">=34.4.0",
+    "cozy-client": ">=34.8.0",
     "cozy-device-helper": "^2.0.0",
     "cozy-harvest-lib": "^6.7.3",
     "cozy-intent": ">=1.3.0",

package/react/Alert/index.jsx

@@ -2,8 +2,8 @@ import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
 import cx from 'classnames'
 import MuiAlert from '@material-ui/lab/Alert'
-import { makeStyles } from '@material-ui/core/styles'
 
+import { makeStyles } from '../styles'
 import Icon from '../Icon'
 import CheckCircleIcon from '../Icons/CheckCircle'
 import WarningIcon from '../Icons/Warning'

package/react/AppLinker/index.jsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { withClient } from 'cozy-client'
 
+import { withClient } from 'cozy-client'
 import {
   checkApp,
   startApp,

package/react/AppLinker/native.js

@@ -1,44 +1,19 @@
+import {
+  generateWebLink as generateWebLinkClient,
+  ensureFirstSlash
+} from 'cozy-client'
+
 import { UNIVERSAL_LINK_URL } from 'cozy-ui/transpiled/react/AppLinker/native.config.js'
 
 export const getUniversalLinkDomain = () => {
   return UNIVERSAL_LINK_URL
 }
 
-const ensureFirstSlash = path => {
-  if (!path) {
-    return '/'
-  } else {
-    return path.startsWith('/') ? path : '/' + path
-  }
-}
-
-/**
- * generateWebLink - Construct a link to a web app
- *
- * @param {object} Options               Object of options
- * @param {string}   options.cozyUrl       Base URL of the cozy, eg. http://cozy.localhost:8080 or https://test.mycozy.cloud:8080
- * @param {string}   options.nativePath    Path inside the app, eg. /files/test.jpg
- * @param {string}   options.slug          Slug of the app
- * @param {string}   options.subDomainType Whether the cozy is using flat or nested subdomains. Defaults to flat.
- *
- * @return {string} Generated URL
- */
-export const generateWebLink = ({
-  cozyUrl,
-  nativePath,
-  slug,
-  subDomainType
-}) => {
-  const url = new URL(cozyUrl)
-  url.host =
-    subDomainType === 'nested'
-      ? `${slug}.${url.host}`
-      : url.host
-          .split('.')
-          .map((x, i) => (i === 0 ? x + '-' + slug : x))
-          .join('.')
-  url.hash = ensureFirstSlash(nativePath)
-  return url.toString()
+export const generateWebLink = ({ nativePath, ...props }) => {
+  console.warn(
+    'Deprecated: you should use generateWebLink from cozy-client instead'
+  )
+  return generateWebLinkClient({ pathname: '/', hash: nativePath, ...props })
 }
 
 /**
@@ -55,16 +30,26 @@ export const generateUniversalLink = options => {
   const { slug, cozyUrl, subDomainType } = options
   let { fallbackUrl, nativePath } = options
   nativePath = ensureFirstSlash(nativePath)
+
   if (!cozyUrl && !fallbackUrl) {
     throw new Error(
       'Must have either cozyUrl or fallbackUrl to generate universal link.'
     )
   }
+
   if (cozyUrl && !fallbackUrl) {
-    fallbackUrl = generateWebLink({ cozyUrl, nativePath, slug, subDomainType })
+    fallbackUrl = generateWebLinkClient({
+      cozyUrl,
+      pathname: '/',
+      hash: nativePath,
+      slug,
+      subDomainType
+    })
   }
+
   const url = getUniversalLinkDomain(cozyUrl) + '/' + slug + nativePath
   const urlObj = new URL(url)
   urlObj.searchParams.append('fallback', fallbackUrl)
+
   return urlObj.toString()
 }

package/react/AppLinker/native.spec.js

@@ -1,11 +1,14 @@
-import { generateUniversalLink, generateWebLink } from './native'
+import { generateWebLink } from 'cozy-client'
+
+import { generateUniversalLink } from './native'
 
 describe('native functions', () => {
   describe('generating a web link', () => {
     it('should generate a web link', () => {
       const webLink = generateWebLink({
         cozyUrl: 'https://test.cozy.tools:8080',
-        nativePath: '/files/1',
+        pathname: '/',
+        hash: '/files/1',
         slug: 'drive'
       })
 
@@ -15,7 +18,8 @@ describe('native functions', () => {
     it('should handle both types of subdomains', () => {
       const flatLink = generateWebLink({
         cozyUrl: 'https://test.cozy.tools:8080',
-        nativePath: '/files/1',
+        pathname: '/',
+        hash: '/files/1',
         slug: 'drive',
         subDomainType: 'flat'
       })
@@ -23,7 +27,8 @@ describe('native functions', () => {
 
       const nestedLink = generateWebLink({
         cozyUrl: 'https://cozy.tools:8080',
-        nativePath: '/files/1',
+        pathname: '/',
+        hash: '/files/1',
         slug: 'drive',
         subDomainType: 'nested'
       })

package/react/CircleButton/index.jsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { makeStyles } from '@material-ui/core/styles'
 
+import { makeStyles } from '../styles'
 import Box from '../Box'
 import IconButton from '../IconButton'
 import Typography from '../Typography'

package/react/CozyDialogs/TopAnchoredDialog.jsx

@@ -1,5 +1,6 @@
 import React from 'react'
-import { withStyles } from '@material-ui/core/styles'
+
+import { withStyles } from '../styles'
 import Dialog from '../Dialog'
 
 /**

package/react/DropdownText/index.jsx

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
-import { makeStyles } from '@material-ui/core/styles'
 
+import { makeStyles } from '../styles'
 import Typography from '../Typography'
 import Icon from '../Icon'
 import BottomIcon from '../Icons/Bottom'

package/react/FilePicker/FilePickerBodyItem.jsx

@@ -2,10 +2,10 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import cx from 'classnames'
 import filesize from 'filesize'
-import { makeStyles } from '@material-ui/core/styles'
 
 import { models } from 'cozy-client'
 
+import { makeStyles } from '../styles'
 import ListItem from '../MuiCozyTheme/ListItem'
 import ListItemIcon from '../MuiCozyTheme/ListItemIcon'
 import ListItemText from '../ListItemText'

package/react/FilePicker/index.jsx

@@ -1,7 +1,7 @@
 import React, { useState, memo } from 'react'
-import { makeStyles } from '@material-ui/core/styles'
 import PropTypes from 'prop-types'
 
+import { makeStyles } from '../styles'
 import { FixedDialog } from '../CozyDialogs'
 import FilePickerHeader from './FilePickerHeader'
 import FilePickerFooter from './FilePickerFooter'

package/react/GhostFileBadge/index.jsx

@@ -1,7 +1,8 @@
 import React from 'react'
 import cx from 'classnames'
+
 import Badge from '../Badge'
-import { withStyles } from '@material-ui/core/styles'
+import { withStyles } from '../styles'
 
 const customStyles = () => ({
   ghost: {

package/react/Icon/Readme.md

@@ -23,9 +23,9 @@ import Icon from 'cozy-ui/transpiled/react/Icon'
 import Typography from 'cozy-ui/transpiled/react/Typography'
 import Dialog from 'cozy-ui/transpiled/react/CozyDialogs/Dialog'
 import { BreakpointsProvider } from 'cozy-ui/transpiled/react/hooks/useBreakpoints'
-import { makeStyles } from '@material-ui/styles'
 import cx from 'classnames'
 
+import { makeStyles } from 'cozy-ui/transpiled/react/styles'
 import Album from 'cozy-ui/transpiled/react/Icons/Album'
 import AlbumAdd from 'cozy-ui/transpiled/react/Icons/AlbumAdd'
 import AlbumRemove from 'cozy-ui/transpiled/react/Icons/AlbumRemove'
@@ -672,9 +672,9 @@ import Icon from 'cozy-ui/transpiled/react/Icon'
 import Typography from 'cozy-ui/transpiled/react/Typography'
 import Dialog from 'cozy-ui/transpiled/react/CozyDialogs/Dialog'
 import { BreakpointsProvider } from 'cozy-ui/transpiled/react/hooks/useBreakpoints'
-import { makeStyles } from '@material-ui/styles'
 import cx from 'classnames'
 
+import { makeStyles } from 'cozy-ui/transpiled/react/styles';
 import Accounts from 'cozy-ui/transpiled/react/Icons/Accounts'
 import Apps from 'cozy-ui/transpiled/react/Icons/Apps'
 import BankAccounts from 'cozy-ui/transpiled/react/Icons/BankAccounts'

package/react/InfosBadge/index.jsx

@@ -1,7 +1,8 @@
 import React from 'react'
 import cx from 'classnames'
+
 import Badge from '../Badge'
-import { withStyles } from '@material-ui/core/styles'
+import { withStyles } from '../styles'
 
 const customStyles = () => ({
   qualifier: {

package/react/IntentDialogOpener/IntentDialogOpener.md

@@ -1,5 +1,5 @@
 ```jsx
-import { withStyles } from '@material-ui/core/styles'
+import { withStyles } from 'cozy-ui/transpiled/react/styles'
 import IntentDialogOpener from 'cozy-ui/transpiled/react/IntentDialogOpener'
 import { BreakpointsProvider } from 'cozy-ui/transpiled/react/hooks/useBreakpoints'
 

package/react/IntentIframe/Readme.md

@@ -29,7 +29,7 @@ Sometimes you have to render an Intent inside a modal, and handle the modal open
 This method replaces deprecated `IntentModal` component.
 
 ```jsx
-import { withStyles } from '@material-ui/core/styles'
+import { withStyles } from 'cozy-ui/transpiled/react/styles'
 import { DialogCloseButton } from 'cozy-ui/transpiled/react/CozyDialogs'
 import Dialog from 'cozy-ui/transpiled/react/Dialog'
 import IntentIframe from 'cozy-ui/transpiled/react/IntentIframe'

package/react/MuiCozyTheme/Divider/index.jsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import MuiDivider from '@material-ui/core/Divider'
-import { withStyles } from '@material-ui/core/styles'
+
+import { withStyles } from '../../styles'
 import { normalTheme } from '../theme'
 import TextDivider from './TextDivider'
 

package/react/MuiCozyTheme/List/index.js

@@ -1,6 +1,7 @@
-import { withStyles } from '@material-ui/core/styles'
 import List from '@material-ui/core/List'
 
+import { withStyles } from '../../styles'
+
 export const BorderedList = withStyles({
   root: {
     borderTop: '1px solid var(--silver)'

package/react/MuiCozyTheme/Menus/index.js

@@ -3,16 +3,15 @@
 // we have to recompose the Menu component ourselves with basic Mui component
 
 import React, { Component } from 'react'
-
-import MenuButton from '../../Button'
 import PropTypes from 'prop-types'
-
 import ClickAwayListener from '@material-ui/core/ClickAwayListener'
 import Grow from '@material-ui/core/Grow'
 import Popper from '@material-ui/core/Popper'
 import Paper from '@material-ui/core/Paper'
 import MenuList from '@material-ui/core/MenuList'
-import { withStyles } from '@material-ui/core/styles'
+
+import { withStyles } from '../../styles'
+import MenuButton from '../../Button'
 
 const styles = {
   root: {

package/react/MuiCozyTheme/index.jsx

@@ -1,11 +1,12 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { MuiThemeProvider } from '@material-ui/core/styles'
+
+import { ThemeProvider } from '../styles'
 import { getTheme } from './theme'
 
 const MuiCozyTheme = ({ variant, children }) => {
   const theme = getTheme(variant)
-  return <MuiThemeProvider theme={theme}>{children}</MuiThemeProvider>
+  return <ThemeProvider theme={theme}>{children}</ThemeProvider>
 }
 
 MuiCozyTheme.propTypes = {

package/react/MuiCozyTheme/makeOverrides.js

@@ -1,4 +1,4 @@
-import { alpha, lighten, darken } from '@material-ui/core/styles'
+import { alpha, lighten, darken } from '../styles'
 
 const SWITCH_BAR_WIDTH = 25
 

package/react/MuiCozyTheme/makeTheme.js

@@ -1,6 +1,6 @@
 import React from 'react'
-import { createTheme } from '@material-ui/core/styles'
 
+import { createTheme } from '../styles'
 import { getCssVariableValue } from '../utils/color'
 import isTesting from '../helpers/isTesting'
 import AccordionExpandIcon from './AccordionExpandIcon'

package/react/Paper/Readme.md

@@ -4,7 +4,7 @@ import Variants from 'cozy-ui/docs/components/Variants';
 import Paper from 'cozy-ui/transpiled/react/Paper';
 import Stack from 'cozy-ui/transpiled/react/Stack';
 import Typography from 'cozy-ui/transpiled/react/Typography';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from 'cozy-ui/transpiled/react/styles';
 
 const styles = theme => ({
   root: {

package/react/PieChart/index.jsx

@@ -4,10 +4,10 @@ import cx from 'classnames'
 import { Chart as ChartJS, ArcElement, Tooltip } from 'chart.js'
 import { Doughnut } from 'react-chartjs-2'
 import { useTheme } from '@material-ui/core'
-import { makeStyles } from '@material-ui/core/styles'
 import set from 'lodash/set'
 import cloneDeep from 'lodash/cloneDeep'
 
+import { makeStyles } from '../styles'
 import Typography from '../Typography'
 import isTesting from '../helpers/isTesting'
 

package/react/ProgressionBanner/index.jsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { withStyles } from '@material-ui/core/styles'
 
+import { withStyles } from '../styles'
 import Banner from '../Banner'
 import { LinearProgress } from '../Progress'
 import Typography from '../Typography'

package/react/SquareAppIcon/index.jsx

@@ -1,9 +1,9 @@
 import React from 'react'
 import cx from 'classnames'
 import PropTypes from 'prop-types'
-import { makeStyles } from '@material-ui/styles'
 import get from 'lodash/get'
 
+import { makeStyles } from '../styles'
 import AppIcon from '../AppIcon'
 import Badge from '../Badge'
 import InfosBadge from '../InfosBadge'

package/react/UploadQueue/index.jsx

@@ -1,11 +1,11 @@
 import React, { Component, useState } from 'react'
 import cx from 'classnames'
-import { withStyles } from '@material-ui/core/styles'
 import LinearProgress from '@material-ui/core/LinearProgress'
 import { useIntervalWhen } from 'rooks'
 
 import { splitFilename } from 'cozy-client/dist/models/file'
 
+import { withStyles } from '../styles'
 import CrossIcon from '../Icons/Cross'
 import WarningIcon from '../Icons/Warning'
 import CheckIcon from '../Icons/Check'

package/react/Viewer/Footer/FooterContent.jsx

@@ -1,10 +1,9 @@
 import React, { useMemo, Children, cloneElement, isValidElement } from 'react'
 import PropTypes from 'prop-types'
-import { makeStyles } from '@material-ui/core/styles'
 import cx from 'classnames'
 
 import BottomSheet, { BottomSheetHeader } from '../../BottomSheet'
-
+import { makeStyles } from '../../styles'
 import { isValidForPanel } from '../helpers'
 import BottomSheetContent from './BottomSheetContent'
 

package/react/Viewer/Readme.md

@@ -35,8 +35,8 @@ The `Viewer` can display an **information panel** to show additional information
 ### Demo
 
 ```jsx
-import { makeStyles } from '@material-ui/core/styles';
 import cx from 'classnames';
+import { makeStyles } from 'cozy-ui/transpiled/react/styles';
 import Variants from 'cozy-ui/docs/components/Variants';
 import Card from 'cozy-ui/transpiled/react/Card';
 import Checkbox from 'cozy-ui/transpiled/react/Checkbox';

package/react/Viewer/components/InformationPanel.jsx

@@ -1,7 +1,8 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import Drawer from '@material-ui/core/Drawer'
-import { withStyles } from '@material-ui/core/styles'
+
+import { withStyles } from '../../styles'
 
 export const infoWidth = '22rem'
 

package/react/Viewer/components/Toolbar.jsx

@@ -2,11 +2,11 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import cx from 'classnames'
 import flow from 'lodash/flow'
-import { makeStyles } from '@material-ui/core/styles'
 
 import { useClient } from 'cozy-client'
 
 import withBreakpoints from '../../helpers/withBreakpoints'
+import { makeStyles } from '../../styles'
 import Button from '../../Button'
 import IconButton from '../../IconButton'
 import Icon from '../../Icon'

package/react/Viewer/components/ViewerControls.jsx

@@ -3,8 +3,8 @@ import PropTypes from 'prop-types'
 import flow from 'lodash/flow'
 import cx from 'classnames'
 import Hammer from 'hammerjs'
-import { withStyles } from '@material-ui/core/styles'
 
+import { withStyles } from '../../styles'
 import withBreakpoints from '../../helpers/withBreakpoints'
 
 import { toolbarPropsPropType } from '../index'

package/transpiled/react/Alert/index.js

@@ -5,7 +5,7 @@ import React, { forwardRef } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import MuiAlert from '@material-ui/lab/Alert';
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import Icon from "cozy-ui/transpiled/react/Icon";
 import CheckCircleIcon from "cozy-ui/transpiled/react/Icons/CheckCircle";
 import WarningIcon from "cozy-ui/transpiled/react/Icons/Warning";

package/transpiled/react/AppLinker/native.js

@@ -1,39 +1,25 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["nativePath"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import { generateWebLink as generateWebLinkClient, ensureFirstSlash } from 'cozy-client';
 import { UNIVERSAL_LINK_URL } from 'cozy-ui/transpiled/react/AppLinker/native.config.js';
 export var getUniversalLinkDomain = function getUniversalLinkDomain() {
   return UNIVERSAL_LINK_URL;
 };
-
-var ensureFirstSlash = function ensureFirstSlash(path) {
-  if (!path) {
-    return '/';
-  } else {
-    return path.startsWith('/') ? path : '/' + path;
-  }
-};
-/**
- * generateWebLink - Construct a link to a web app
- *
- * @param {object} Options               Object of options
- * @param {string}   options.cozyUrl       Base URL of the cozy, eg. http://cozy.localhost:8080 or https://test.mycozy.cloud:8080
- * @param {string}   options.nativePath    Path inside the app, eg. /files/test.jpg
- * @param {string}   options.slug          Slug of the app
- * @param {string}   options.subDomainType Whether the cozy is using flat or nested subdomains. Defaults to flat.
- *
- * @return {string} Generated URL
- */
-
-
 export var generateWebLink = function generateWebLink(_ref) {
-  var cozyUrl = _ref.cozyUrl,
-      nativePath = _ref.nativePath,
-      slug = _ref.slug,
-      subDomainType = _ref.subDomainType;
-  var url = new URL(cozyUrl);
-  url.host = subDomainType === 'nested' ? "".concat(slug, ".").concat(url.host) : url.host.split('.').map(function (x, i) {
-    return i === 0 ? x + '-' + slug : x;
-  }).join('.');
-  url.hash = ensureFirstSlash(nativePath);
-  return url.toString();
+  var nativePath = _ref.nativePath,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  console.warn('Deprecated: you should use generateWebLink from cozy-client instead');
+  return generateWebLinkClient(_objectSpread({
+    pathname: '/',
+    hash: nativePath
+  }, props));
 };
 /**
  * Returns a universal link for an app + native path
@@ -59,9 +45,10 @@ export var generateUniversalLink = function generateUniversalLink(options) {
   }
 
   if (cozyUrl && !fallbackUrl) {
-    fallbackUrl = generateWebLink({
+    fallbackUrl = generateWebLinkClient({
       cozyUrl: cozyUrl,
-      nativePath: nativePath,
+      pathname: '/',
+      hash: nativePath,
       slug: slug,
       subDomainType: subDomainType
     });

package/transpiled/react/CircleButton/index.js

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["className", "label", "variant", "disabled", "fullWidth", "children"];
 import React from 'react';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import Box from "cozy-ui/transpiled/react/Box";
 import IconButton from "cozy-ui/transpiled/react/IconButton";
 import Typography from "cozy-ui/transpiled/react/Typography";

package/transpiled/react/CozyDialogs/TopAnchoredDialog.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 import Dialog from "cozy-ui/transpiled/react/Dialog";
 /**
  * A Dialog that will not be centered vertically. Useful when

package/transpiled/react/DropdownText/index.js

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["spaceBetween", "variant", "disabled", "noWrap", "color", "children", "innerTextProps", "innerIconContainerProps", "innerIconProps"];
 import React, { forwardRef } from 'react';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import Typography from "cozy-ui/transpiled/react/Typography";
 import Icon from "cozy-ui/transpiled/react/Icon";
 import BottomIcon from "cozy-ui/transpiled/react/Icons/Bottom";

package/transpiled/react/FilePicker/FilePickerBodyItem.js

@@ -2,8 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import filesize from 'filesize';
-import { makeStyles } from '@material-ui/core/styles';
 import { models } from 'cozy-client';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import ListItem from "cozy-ui/transpiled/react/MuiCozyTheme/ListItem";
 import ListItemIcon from "cozy-ui/transpiled/react/MuiCozyTheme/ListItemIcon";
 import ListItemText from "cozy-ui/transpiled/react/ListItemText";

package/transpiled/react/FilePicker/index.js

@@ -1,7 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useState, memo } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
 import PropTypes from 'prop-types';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import { FixedDialog } from "cozy-ui/transpiled/react/CozyDialogs";
 import FilePickerHeader from "cozy-ui/transpiled/react/FilePicker/FilePickerHeader";
 import FilePickerFooter from "cozy-ui/transpiled/react/FilePicker/FilePickerFooter";

package/transpiled/react/GhostFileBadge/index.js

@@ -5,7 +5,7 @@ var _excluded = ["classes"],
 import React from 'react';
 import cx from 'classnames';
 import Badge from "cozy-ui/transpiled/react/Badge";
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 
 var customStyles = function customStyles() {
   return {

package/transpiled/react/InfosBadge/index.js

@@ -5,7 +5,7 @@ var _excluded = ["classes"],
 import React from 'react';
 import cx from 'classnames';
 import Badge from "cozy-ui/transpiled/react/Badge";
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 
 var customStyles = function customStyles() {
   return {

package/transpiled/react/MuiCozyTheme/Divider/index.js

@@ -8,7 +8,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React from 'react';
 import MuiDivider from '@material-ui/core/Divider';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 import { normalTheme } from "cozy-ui/transpiled/react/MuiCozyTheme/theme";
 import TextDivider from "cozy-ui/transpiled/react/MuiCozyTheme/Divider/TextDivider";
 /**

package/transpiled/react/MuiCozyTheme/List/index.js

@@ -1,5 +1,5 @@
-import { withStyles } from '@material-ui/core/styles';
 import List from '@material-ui/core/List';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 export var BorderedList = withStyles({
   root: {
     borderTop: '1px solid var(--silver)'

package/transpiled/react/MuiCozyTheme/Menus/index.js

@@ -15,14 +15,14 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 // Since the MuiMenu component doesn't allow another Popover positioning,
 // we have to recompose the Menu component ourselves with basic Mui component
 import React, { Component } from 'react';
-import MenuButton from "cozy-ui/transpiled/react/Button";
 import PropTypes from 'prop-types';
 import ClickAwayListener from '@material-ui/core/ClickAwayListener';
 import Grow from '@material-ui/core/Grow';
 import Popper from '@material-ui/core/Popper';
 import Paper from '@material-ui/core/Paper';
 import MenuList from '@material-ui/core/MenuList';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
+import MenuButton from "cozy-ui/transpiled/react/Button";
 var styles = {
   root: {
     position: 'relative'

package/transpiled/react/MuiCozyTheme/index.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { MuiThemeProvider } from '@material-ui/core/styles';
+import { ThemeProvider } from "cozy-ui/transpiled/react/styles";
 import { getTheme } from "cozy-ui/transpiled/react/MuiCozyTheme/theme";
 
 var MuiCozyTheme = function MuiCozyTheme(_ref) {
   var variant = _ref.variant,
       children = _ref.children;
   var theme = getTheme(variant);
-  return /*#__PURE__*/React.createElement(MuiThemeProvider, {
+  return /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: theme
   }, children);
 };

package/transpiled/react/MuiCozyTheme/makeOverrides.js

@@ -4,7 +4,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import { alpha, lighten, darken } from '@material-ui/core/styles';
+import { alpha, lighten, darken } from "cozy-ui/transpiled/react/styles";
 var SWITCH_BAR_WIDTH = 25;
 export var makeThemeOverrides = function makeThemeOverrides(theme) {
   var createOverrides = theme.palette.type === 'dark' ? makeInvertedOverrides : makeOverrides;

package/transpiled/react/MuiCozyTheme/makeTheme.js

@@ -5,7 +5,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import React from 'react';
-import { createTheme } from '@material-ui/core/styles';
+import { createTheme } from "cozy-ui/transpiled/react/styles";
 import { getCssVariableValue } from "cozy-ui/transpiled/react/utils/color";
 import isTesting from "cozy-ui/transpiled/react/helpers/isTesting";
 import AccordionExpandIcon from "cozy-ui/transpiled/react/MuiCozyTheme/AccordionExpandIcon";

package/transpiled/react/PieChart/index.js

@@ -13,9 +13,9 @@ import cx from 'classnames';
 import { Chart as ChartJS, ArcElement, Tooltip } from 'chart.js';
 import { Doughnut } from 'react-chartjs-2';
 import { useTheme } from '@material-ui/core';
-import { makeStyles } from '@material-ui/core/styles';
 import set from 'lodash/set';
 import cloneDeep from 'lodash/cloneDeep';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import Typography from "cozy-ui/transpiled/react/Typography";
 import isTesting from "cozy-ui/transpiled/react/helpers/isTesting";
 ChartJS.register(ArcElement, Tooltip);

package/transpiled/react/ProgressionBanner/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 import Banner from "cozy-ui/transpiled/react/Banner";
 import { LinearProgress } from "cozy-ui/transpiled/react/Progress";
 import Typography from "cozy-ui/transpiled/react/Typography";

package/transpiled/react/SquareAppIcon/index.js

@@ -4,8 +4,8 @@ var _excluded = ["name", "variant", "IconContent"];
 import React from 'react';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/styles';
 import get from 'lodash/get';
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import AppIcon from "cozy-ui/transpiled/react/AppIcon";
 import Badge from "cozy-ui/transpiled/react/Badge";
 import InfosBadge from "cozy-ui/transpiled/react/InfosBadge";

package/transpiled/react/UploadQueue/index.js

@@ -14,10 +14,10 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 import React, { Component, useState } from 'react';
 import cx from 'classnames';
-import { withStyles } from '@material-ui/core/styles';
 import LinearProgress from '@material-ui/core/LinearProgress';
 import { useIntervalWhen } from 'rooks';
 import { splitFilename } from 'cozy-client/dist/models/file';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 import CrossIcon from "cozy-ui/transpiled/react/Icons/Cross";
 import WarningIcon from "cozy-ui/transpiled/react/Icons/Warning";
 import CheckIcon from "cozy-ui/transpiled/react/Icons/Check";

package/transpiled/react/Viewer/Footer/FooterContent.js

@@ -1,8 +1,8 @@
 import React, { useMemo, Children, cloneElement, isValidElement } from 'react';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core/styles';
 import cx from 'classnames';
 import BottomSheet, { BottomSheetHeader } from "cozy-ui/transpiled/react/BottomSheet";
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import { isValidForPanel } from "cozy-ui/transpiled/react/Viewer/helpers";
 import BottomSheetContent from "cozy-ui/transpiled/react/Viewer/Footer/BottomSheetContent";
 var useStyles = makeStyles(function (theme) {

package/transpiled/react/Viewer/components/InformationPanel.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import Drawer from '@material-ui/core/Drawer';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 export var infoWidth = '22rem';
 
 var customStyles = function customStyles() {

package/transpiled/react/Viewer/components/Toolbar.js

@@ -3,9 +3,9 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import flow from 'lodash/flow';
-import { makeStyles } from '@material-ui/core/styles';
 import { useClient } from 'cozy-client';
 import withBreakpoints from "cozy-ui/transpiled/react/helpers/withBreakpoints";
+import { makeStyles } from "cozy-ui/transpiled/react/styles";
 import Button from "cozy-ui/transpiled/react/Button";
 import IconButton from "cozy-ui/transpiled/react/IconButton";
 import Icon from "cozy-ui/transpiled/react/Icon";

package/transpiled/react/Viewer/components/ViewerControls.js

@@ -15,7 +15,7 @@ import PropTypes from 'prop-types';
 import flow from 'lodash/flow';
 import cx from 'classnames';
 import Hammer from 'hammerjs';
-import { withStyles } from '@material-ui/core/styles';
+import { withStyles } from "cozy-ui/transpiled/react/styles";
 import withBreakpoints from "cozy-ui/transpiled/react/helpers/withBreakpoints";
 import { toolbarPropsPropType } from "cozy-ui/transpiled/react/Viewer/index";
 import { infoWidth } from "cozy-ui/transpiled/react/Viewer/components/InformationPanel";