cozy-ui 96.0.0 → 96.1.1

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [96.1.1](https://github.com/cozy/cozy-ui/compare/v96.1.0...v96.1.1) (2023-11-27)
+
+
+### Bug Fixes
+
+* Improve IllustrationDialog layout in native ([2946e9d](https://github.com/cozy/cozy-ui/commit/2946e9d))
+
+# [96.1.0](https://github.com/cozy/cozy-ui/compare/v96.0.0...v96.1.0) (2023-11-24)
+
+
+### Features
+
+* Add TrashDuotone icon ([b3b26b5](https://github.com/cozy/cozy-ui/commit/b3b26b5))
+
 # [96.0.0](https://github.com/cozy/cozy-ui/compare/v95.11.1...v96.0.0) (2023-11-23)
 
 

package/assets/icons/illus/trash-duotone.svg

@@ -0,0 +1 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.586 3 10.707.879A3 3 0 0 1 12.828 0h6.344a3 3 0 0 1 2.121.879L23.414 3H29a2 2 0 1 1 0 4H3a2 2 0 1 1 0-4h5.586Zm3.535-.707A1 1 0 0 1 12.828 2h6.344a1 1 0 0 1 .707.293l.707.707h-9.172l.707-.707Z" fill="#95999D"/><path d="M4 8a1 1 0 0 1 1-1h22a1 1 0 0 1 1 1v22a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V8Z" fill="#D6D8DA"/></svg>

package/package.json

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

package/react/Icon/Readme.md

@@ -22,7 +22,7 @@ import Album from 'cozy-ui/transpiled/react/Icons/Album'
 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/providers/Breakpoints'
+import DemoProvider from 'cozy-ui/docs/components/DemoProvider'
 import cx from 'classnames'
 
 import { makeStyles } from 'cozy-ui/transpiled/react/styles'
@@ -503,7 +503,7 @@ const icons = [
   WrenchCircle,
   Work
 ]
-
+const locale = {}
 const wrapperStyle = {
   fontSize: '2rem',
   display: 'grid',
@@ -540,7 +540,7 @@ const InfoModal = ({ icon }) => {
 
 const Example = () => {
   return (
-    <BreakpointsProvider>
+    <DemoProvider>
       <Typography component='p' variant='body1' className='u-mb-1'>
         Font size: <input type='range' min='8' max='48' value={state.size} onChange={handleInputRangeChange} /> {state.size}px
       </Typography>
@@ -559,7 +559,7 @@ const Example = () => {
         )}
       { state.selected ? <InfoModal icon={state.selected} /> : null }
       </div>
-    </BreakpointsProvider>
+    </DemoProvider>
   )
 }
 
@@ -574,15 +574,22 @@ const Example = () => {
 import Icon from 'cozy-ui/transpiled/react/Icon'
 import Typography from 'cozy-ui/transpiled/react/Typography'
 
-import CozyIcon from 'cozy-ui/transpiled/react/Icons/Cozy'
+import BottomSelectIcon from 'cozy-ui/transpiled/react/Icons/BottomSelect'
+import CheckWhiteIcon from 'cozy-ui/transpiled/react/Icons/CheckWhite'
 import CloudBrokenIcon from 'cozy-ui/transpiled/react/Icons/CloudBroken'
 import CloudSync2 from 'cozy-ui/transpiled/react/Icons/CloudSync2'
+import ContactsIcon from 'cozy-ui/transpiled/react/Icons/Contacts'
+import CozyAuthentificationIcon from 'cozy-ui/transpiled/react/Icons/CozyAuthentification'
+import CozyIcon from 'cozy-ui/transpiled/react/Icons/Cozy'
 import CozyLogoIcon from 'cozy-ui/transpiled/react/Icons/CozyLogo'
+import CozyUpgradeIcon from 'cozy-ui/transpiled/react/Icons/CozyUpgrade'
+import DashWhiteIcon from 'cozy-ui/transpiled/react/Icons/DashWhite'
+import DeviceBrowserIcon from 'cozy-ui/transpiled/react/Icons/DeviceBrowser'
 import DeviceLaptopIcon from 'cozy-ui/transpiled/react/Icons/DeviceLaptop'
 import DevicePhoneIcon from 'cozy-ui/transpiled/react/Icons/DevicePhone'
 import DeviceTabletIcon from 'cozy-ui/transpiled/react/Icons/DeviceTablet'
-import DeviceBrowserIcon from 'cozy-ui/transpiled/react/Icons/DeviceBrowser'
 import FileTypeAudioIcon from 'cozy-ui/transpiled/react/Icons/FileTypeAudio'
+import FileTypeBankingAccountIcon from 'cozy-ui/transpiled/react/Icons/FileTypeBankingAccount'
 import FileTypeBinIcon from 'cozy-ui/transpiled/react/Icons/FileTypeBin'
 import FileTypeCodeIcon from 'cozy-ui/transpiled/react/Icons/FileTypeCode'
 import FileTypeFilesIcon from 'cozy-ui/transpiled/react/Icons/FileTypeFiles'
@@ -594,32 +601,32 @@ import FileTypeSlideIcon from 'cozy-ui/transpiled/react/Icons/FileTypeSlide'
 import FileTypeTextIcon from 'cozy-ui/transpiled/react/Icons/FileTypeText'
 import FileTypeVideoIcon from 'cozy-ui/transpiled/react/Icons/FileTypeVideo'
 import FileTypeZipIcon from 'cozy-ui/transpiled/react/Icons/FileTypeZip'
-import FileTypeBankingAccountIcon from 'cozy-ui/transpiled/react/Icons/FileTypeBankingAccount'
-import ContactsIcon from 'cozy-ui/transpiled/react/Icons/Contacts'
-import PapersIcon from 'cozy-ui/transpiled/react/Icons/Papers'
-import StoreIcon from 'cozy-ui/transpiled/react/Icons/Store'
 import ForbiddenSignIcon from 'cozy-ui/transpiled/react/Icons/ForbiddenSign'
 import GoogleIcon from 'cozy-ui/transpiled/react/Icons/Google'
+import KeychainIcon from 'cozy-ui/transpiled/react/Icons/Keychain'
 import LogoutLargeIcon from 'cozy-ui/transpiled/react/Icons/LogoutLarge'
+import PapersIcon from 'cozy-ui/transpiled/react/Icons/Papers'
+import StoreIcon from 'cozy-ui/transpiled/react/Icons/Store'
 import TopSelectIcon from 'cozy-ui/transpiled/react/Icons/TopSelect'
-import BottomSelectIcon from 'cozy-ui/transpiled/react/Icons/BottomSelect'
-import CheckWhiteIcon from 'cozy-ui/transpiled/react/Icons/CheckWhite'
-import DashWhiteIcon from 'cozy-ui/transpiled/react/Icons/DashWhite'
-import KeychainIcon from 'cozy-ui/transpiled/react/Icons/Keychain'
-import CozyUpgradeIcon from 'cozy-ui/transpiled/react/Icons/CozyUpgrade'
-import CozyAuthentificationIcon from 'cozy-ui/transpiled/react/Icons/CozyAuthentification'
-
+import TrashDuotoneIcon from 'cozy-ui/transpiled/react/Icons/TrashDuotone'
 
 const icons = [
-  CozyIcon,
+  BottomSelectIcon,
+  CheckWhiteIcon,
   CloudBrokenIcon,
   CloudSync2,
+  ContactsIcon,
+  CozyAuthentificationIcon,
+  CozyIcon,
   CozyLogoIcon,
+  CozyUpgradeIcon,
+  DashWhiteIcon,
+  DeviceBrowserIcon,
   DeviceLaptopIcon,
   DevicePhoneIcon,
   DeviceTabletIcon,
-  DeviceBrowserIcon,
   FileTypeAudioIcon,
+  FileTypeBankingAccountIcon,
   FileTypeBinIcon,
   FileTypeCodeIcon,
   FileTypeFilesIcon,
@@ -631,20 +638,14 @@ const icons = [
   FileTypeTextIcon,
   FileTypeVideoIcon,
   FileTypeZipIcon,
-  FileTypeBankingAccountIcon,
-  ContactsIcon,
-  PapersIcon,
-  StoreIcon,
   ForbiddenSignIcon,
   GoogleIcon,
+  KeychainIcon,
   LogoutLargeIcon,
+  PapersIcon,
+  StoreIcon,
   TopSelectIcon,
-  BottomSelectIcon,
-  CheckWhiteIcon,
-  DashWhiteIcon,
-  KeychainIcon,
-  CozyUpgradeIcon,
-  CozyAuthentificationIcon
+  TrashDuotoneIcon
 ]
 
 const wrapperStyle = {
@@ -684,7 +685,7 @@ import Icon from 'cozy-ui/transpiled/react/Icon'
 import Typography from 'cozy-ui/transpiled/react/Typography'
 import Sprite from 'cozy-ui/transpiled/react/Icon/Sprite'
 
-const availableIcons = ['cozy', 'cloud-broken', 'cozy-logo', 'device-laptop', 'device-phone', 'device-tablet', 'device-browser', 'file-type-audio', 'file-type-bin', 'file-type-code', 'file-type-files', 'file-type-folder', 'file-type-image', 'file-type-note', 'file-type-pdf', 'file-type-sheet', 'file-type-slide', 'file-type-text', 'file-type-video', 'file-type-zip', 'file-type-banking-account' , 'forbidden-sign', 'google', 'logout-large', 'top-select', 'bottom-select', 'check-white', 'dash-white', 'keychain', 'contacts', 'papers', 'store', 'cozy-upgrade', 'cozy-authentification']
+const availableIcons = ['bottom-select', 'check-white', 'cloud-broken', 'contacts', 'cozy-authentification', 'cozy-logo', 'cozy-upgrade', 'dash-white', 'device-browser', 'device-laptop', 'device-phone', 'device-tablet', 'file-type-audio', 'file-type-banking-account' , 'file-type-bin', 'file-type-code', 'file-type-files', 'file-type-folder', 'file-type-image', 'file-type-note', 'file-type-pdf', 'file-type-sheet', 'file-type-slide', 'file-type-text', 'file-type-video', 'file-type-zip', 'forbidden-sign', 'google', 'keychain', 'logout-large', 'papers', 'store', 'top-select', 'trash-duotone', 'cozy']
 
 ;
 
@@ -704,7 +705,7 @@ const availableIcons = ['cozy', 'cloud-broken', 'cozy-logo', 'device-laptop', 'd
 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/providers/Breakpoints'
+import DemoProvider from 'cozy-ui/docs/components/DemoProvider'
 import cx from 'classnames'
 
 import { makeStyles } from 'cozy-ui/transpiled/react/styles'
@@ -755,7 +756,7 @@ import Triggers from 'cozy-ui/transpiled/react/Icons/Triggers'
 import Versioning from 'cozy-ui/transpiled/react/Icons/Versioning'
 
 const icons = [Accounts, Apps, BankAccounts, BankGroups, BankOperations, BankRecurrence, BillPermissions, BugReport, CalendarPermissions, Category, CertifiedPermissions, ConnectedClients, Consumption, ContactsAccounts, ContactsGroups, Contacts, Contract, Ecolyo, Energy, Energybreakdown, Fallback, Family, FilesPen, FilesVersions, Files, HomePermissions, Identities, KonnectorsResult, Konnectors, LocationPermissions, Notifications, Opinions, Passwords, Permissions, PhotosAlbum, PhotosSettings, Profile, SafePermissions, Settings, Sharings, Sinister, Tags,TaskToEffectuate, Triggers, Versioning]
-
+const locale = {}
 const wrapperStyle = {
   fontSize: '2rem',
   display: 'grid',
@@ -792,7 +793,7 @@ const InfoModal = ({ icon }) => {
 
 const Example = () => {
   return (
-    <BreakpointsProvider>
+    <DemoProvider>
       <Typography component='p' variant='body1' className='u-mb-1'>
         Font size: <input type='range' min='8' max='48' value={state.size} onChange={handleInputRangeChange} /> {state.size}px
       </Typography>
@@ -811,7 +812,7 @@ const Example = () => {
         )}
       { state.selected ? <InfoModal icon={state.selected} /> : null }
       </div>
-    </BreakpointsProvider>
+    </DemoProvider>
   )
 }
 

package/react/Icon/icons-sprite.js

@@ -167,7 +167,7 @@ animation: checkmark 0.5s ease-in-out 0.16s backwards
   <g fill="#95999d" fill-rule="evenodd" transform="translate(12.285714, 12.000000) rotate(270.000000) translate(-12.285714, -12.000000)">
     <path d="M6.46026077,20.3174036 C5.84657974,20.9310847 5.84657974,21.9260582 6.46026077,22.5397392 C7.0739418,23.1534203 8.06891534,23.1534203 8.68259637,22.5397392 L18.1111678,13.1111678 C18.7248488,12.4974868 18.7248488,11.5025132 18.1111678,10.8888322 L8.68259637,1.46026077 C8.06891534,0.846579743 7.0739418,0.846579743 6.46026077,1.46026077 C5.84657974,2.0739418 5.84657974,3.06891534 6.46026077,3.68259637 L14.7776644,12 L6.46026077,20.3174036 Z"/>
   </g>
-</symbol><symbol id="album-add" viewBox="0 0 16 16">
+</symbol><symbol id="trash-duotone" viewBox="0 0 32 32"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.586 3 10.707.879A3 3 0 0 1 12.828 0h6.344a3 3 0 0 1 2.121.879L23.414 3H29a2 2 0 1 1 0 4H3a2 2 0 1 1 0-4h5.586Zm3.535-.707A1 1 0 0 1 12.828 2h6.344a1 1 0 0 1 .707.293l.707.707h-9.172l.707-.707Z" fill="#95999D"/><path d="M4 8a1 1 0 0 1 1-1h22a1 1 0 0 1 1 1v22a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V8Z" fill="#D6D8DA"/></symbol><symbol id="album-add" viewBox="0 0 16 16">
   <path fill-rule="evenodd" d="M65,99.0094776 C65,97.347389 66.3423789,96 68.0033512,96 L77.9931545,96 C78.5492199,96 79,96.4438648 79,97 C79,97.5522847 78.544239,98 77.9975267,98 L68.0024733,98 C67.4488226,98 67,98.4438648 67,99 C67,99.5522847 67.455761,100 68.0024733,100 L77.9975267,100 C78.5511774,100 79,100.455761 79,101.002473 L79,110.997527 C79,111.551177 78.5500512,112 77.9931545,112 L68.0033512,112 C66.3446462,112 65,110.663369 65,108.990522 L65,99.0094776 Z M72,102 L74,102 L74,105 L77,105 L77,107 L74,107 L74,110 L72,110 L72,107 L69,107 L69,105 L72,105 L72,102 Z" transform="translate(-64 -96)"/>
 </symbol><symbol id="album-remove" viewBox="0 0 16 16">
   <path fill-rule="evenodd" d="M65,99.009C65,97.347 66.342,96 68.003,96L77.993,96C78.549,96 79,96.444 79,97C79,97.552 78.544,98 77.998,98L68.002,98C67.449,98 67,98.444 67,99C67,99.552 67.456,100 68.002,100L77.998,100C78.551,100 79,100.456 79,101.002L79,110.998C79,111.551 78.55,112 77.993,112L68.003,112C66.345,112 65,110.663 65,108.991L65,99.009ZM72,105L77,105L77,107L74,107L72,107L69,107L69,105L72,105Z" transform="translate(-64 -96)"/>

package/react/Icons/TrashDuotone.jsx

@@ -0,0 +1,21 @@
+// Automatically created, please run `scripts/generate-svgr-icon.sh assets/icons/illus/trash-duotone.svg` to regenerate;
+import React from 'react'
+
+function SvgTrashDuotone(props) {
+  return (
+    <svg viewBox="0 0 32 32" fill="none" {...props}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8.586 3L10.707.879A3 3 0 0112.828 0h6.344a3 3 0 012.121.879L23.414 3H29a2 2 0 110 4H3a2 2 0 110-4h5.586zm3.535-.707A1 1 0 0112.828 2h6.344a1 1 0 01.707.293l.707.707h-9.172l.707-.707z"
+        fill="#95999D"
+      />
+      <path
+        d="M4 8a1 1 0 011-1h22a1 1 0 011 1v22a2 2 0 01-2 2H6a2 2 0 01-2-2V8z"
+        fill="#D6D8DA"
+      />
+    </svg>
+  )
+}
+
+export default SvgTrashDuotone

package/react/MuiCozyTheme/makeOverrides.js

@@ -506,11 +506,13 @@ export const makeOverrides = theme => ({
             '& .dialogContentWrapper': {
               flexGrow: 1,
               '&:not(.withActions)': {
-                paddingBottom: '16px'
+                paddingBottom:
+                  'calc(env(safe-area-inset-bottom) + var(--flagship-bottom-height) + 16px)'
               }
             },
             '& .cozyDialogActions': {
-              paddingBottom: '16px'
+              paddingBottom:
+                'calc(env(safe-area-inset-bottom) + var(--flagship-bottom-height) + 16px)'
             }
           }
         },