cozy-ui 107.0.0 → 107.2.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [107.2.0](https://github.com/cozy/cozy-ui/compare/v107.1.0...v107.2.0) (2024-05-29)
+
+
+### Features
+
+* **IconStack:** The `foregroundIcon` container is not useful ([1895af7](https://github.com/cozy/cozy-ui/commit/1895af7))
+
+# [107.1.0](https://github.com/cozy/cozy-ui/compare/v107.0.0...v107.1.0) (2024-05-29)
+
+
+### Features
+
+* Add new icons ListMin and MosaicMin ([0418a8f](https://github.com/cozy/cozy-ui/commit/0418a8f))
+
 # [107.0.0](https://github.com/cozy/cozy-ui/compare/v106.9.0...v107.0.0) (2024-05-29)
 
 

package/assets/icons/ui/list-min.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M3 11a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm10 0a1 1 0 1 1 0 2H7a1 1 0 1 1 0-2h6ZM3 7a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm10 0a1 1 0 1 1 0 2H7a1 1 0 0 1 0-2h6ZM3 3a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm10 0a1 1 0 1 1 0 2H7a1 1 0 0 1 0-2h6Z"/></svg>

package/assets/icons/ui/mosaic-min.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 9a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h3Zm7 0a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h3ZM6 2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3Zm7 0a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3Z"/></svg>

package/package.json

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

package/react/Icon/Readme.md

@@ -208,6 +208,7 @@ import Lightning from 'cozy-ui/transpiled/react/Icons/Lightning'
 import Link from 'cozy-ui/transpiled/react/Icons/Link'
 import LinkOut from 'cozy-ui/transpiled/react/Icons/LinkOut'
 import List from 'cozy-ui/transpiled/react/Icons/List'
+import ListMin from 'cozy-ui/transpiled/react/Icons/ListMin'
 import Location from 'cozy-ui/transpiled/react/Icons/Location'
 import Lock from 'cozy-ui/transpiled/react/Icons/Lock'
 import LockScreen from 'cozy-ui/transpiled/react/Icons/LockScreen'
@@ -217,6 +218,7 @@ import Magnet from 'cozy-ui/transpiled/react/Icons/Magnet'
 import Magnifier from 'cozy-ui/transpiled/react/Icons/Magnifier'
 import Merge from 'cozy-ui/transpiled/react/Icons/Merge'
 import Moped from 'cozy-ui/transpiled/react/Icons/Moped'
+import MosaicMin from 'cozy-ui/transpiled/react/Icons/MosaicMin'
 import Motorcycle from 'cozy-ui/transpiled/react/Icons/Motorcycle'
 import Mountain from 'cozy-ui/transpiled/react/Icons/Mountain'
 import Movement from 'cozy-ui/transpiled/react/Icons/Movement'
@@ -465,6 +467,7 @@ const icons = [
   Link,
   LinkOut,
   List,
+  ListMin,
   Location,
   Lock,
   LockScreen,
@@ -474,6 +477,7 @@ const icons = [
   Magnifier,
   Merge,
   Moped,
+  MosaicMin,
   Motorcycle,
   Mountain,
   MovementIn,
@@ -913,7 +917,7 @@ import Typography from 'cozy-ui/transpiled/react/Typography'
 
 const colors = ['#297EF2', '#08b442', '#B449E7', '#F52D2D', '#FF962F']
 let i = 0
-const availableIcons = ['album-add','album-remove','album','answer','apple','archive','arrowUp','attachment','attention','bank-check','bank','banking-add','banking','bell','benefit','bike','bill','bottom','browser-brave','browser-chrome','browser-duckduckgo','browser-edge','browser-edge-chromium','browser-firefox','browser-ie','browser-opera','browser-safari','burger','bus','calendar','camera','car','carbonCopy','carpooling','categories','certified','check-circle','check-list','check-square','check','checkbox','chess','child','circle-filled','clock','clock-outline','cloud-happy','cloud','collect','cocktail','comment','company','compare','compass','connector','contract','contrast','copy','cozy-circle','cozy-laugh', 'cozy-lock', 'cozy-text', 'cozy-release', 'credit-card-add','credit-card','credit','crop','cross-circle-outline','cross-circle','cross-medium','cross-small','cross','cube','dash','dashboard','data-control','debit','devices','dots','down','download','drawing-arrow-up','dropdown-close','dropdown-open','dropdown','dropup','electric-bike','electric-car','electric-scooter','email-notification','email','eu','euro','exchange','eye-closed','eye','face-id','file-add','file-duotone','file-new','file-none','file-outline','file','filter','fingerprint','fitness','flag-outlined','flag','flash-auto','flashlight','folder-add','folder-moveto','folder','forbidden','from-user','gear','globe','gouv','graph-circle','grid','group-list','groups','growth','hand','heart','help','help-outlined','history','home','hourglass','image','info-outlined','info','justice','key','label-outlined','laudry','laptop','left','library','lightbulb','lightning','link-out','link','list','location','lock', 'lock-screen', 'logout','magic-trick','magnet','magnifier','merge','moped','motorcycle','mountain','movement-in','movement-out','mouvement','moveto','multi-files','music','new','next','note','notification-email','offline','online', 'openapp', 'openwith','palette','paper','paperplane','password','pen','people','percent-circle','percent','personal-data','phone-download','phone-upload','phone','pie-chart','pin','plane','plus-small','plus', 'pop-inside', 'previous','printer','qualify','radio-checked','radio-unchecked','refresh','relationship','remboursement','rename','repare','reply','restaurant','restore-straight','restore','right','rise','rotate-left','rotate-right','sad-cozy','safe','school','scooter','select-all','setting','share-circle','share','shield','shop','sound','spinner','sport-bag','stack','star','stats','subway', 'support', 'swap', 'sync-cozy','sync','tag','target','team','telecom','telephone','to-the-cloud','top','train','tram','trash','trophy', 'uncloud', 'unknow','unlink','unlock','up','upload','videos','walk','wallet-add','wallet-new','wallet','warn','warning-circle','warning','water','wrench-circle','work']
+const availableIcons = ['album-add','album-remove','album','answer','apple','archive','arrowUp','attachment','attention','bank-check','bank','banking-add','banking','bell','benefit','bike','bill','bottom','browser-brave','browser-chrome','browser-duckduckgo','browser-edge','browser-edge-chromium','browser-firefox','browser-ie','browser-opera','browser-safari','burger','bus','calendar','camera','car','carbonCopy','carpooling','categories','certified','check-circle','check-list','check-square','check','checkbox','chess','child','circle-filled','clock','clock-outline','cloud-happy','cloud','collect','cocktail','comment','company','compare','compass','connector','contract','contrast','copy','cozy-circle','cozy-laugh', 'cozy-lock', 'cozy-text', 'cozy-release', 'credit-card-add','credit-card','credit','crop','cross-circle-outline','cross-circle','cross-medium','cross-small','cross','cube','dash','dashboard','data-control','debit','devices','dots','down','download','drawing-arrow-up','dropdown-close','dropdown-open','dropdown','dropup','electric-bike','electric-car','electric-scooter','email-notification','email','eu','euro','exchange','eye-closed','eye','face-id','file-add','file-duotone','file-new','file-none','file-outline','file','filter','fingerprint','fitness','flag-outlined','flag','flash-auto','flashlight','folder-add','folder-moveto','folder','forbidden','from-user','gear','globe','gouv','graph-circle','grid','group-list','groups','growth','hand','heart','help','help-outlined','history','home','hourglass','image','info-outlined','info','justice','key','label-outlined','laudry','laptop','left','library','lightbulb','lightning','link-out','link','list','list-min','location','lock', 'lock-screen', 'logout','magic-trick','magnet','magnifier','merge','moped','mosaic-min','motorcycle','mountain','movement-in','movement-out','mouvement','moveto','multi-files','music','new','next','note','notification-email','offline','online', 'openapp', 'openwith','palette','paper','paperplane','password','pen','people','percent-circle','percent','personal-data','phone-download','phone-upload','phone','pie-chart','pin','plane','plus-small','plus', 'pop-inside', 'previous','printer','qualify','radio-checked','radio-unchecked','refresh','relationship','remboursement','rename','repare','reply','restaurant','restore-straight','restore','right','rise','rotate-left','rotate-right','sad-cozy','safe','school','scooter','select-all','setting','share-circle','share','shield','shop','sound','spinner','sport-bag','stack','star','stats','subway', 'support', 'swap', 'sync-cozy','sync','tag','target','team','telecom','telephone','to-the-cloud','top','train','tram','trash','trophy', 'uncloud', 'unknow','unlink','unlock','up','upload','videos','walk','wallet-add','wallet-new','wallet','warn','warning-circle','warning','water','wrench-circle','work']
 ;
 <div style={{ fontSize: '2rem', display: 'grid', gridTemplateColumns: 'repeat(6, 1fr)' }}>
   <Sprite />

package/react/Icon/icons-sprite.js

@@ -429,7 +429,7 @@ animation: checkmark 0.5s ease-in-out 0.16s backwards
   </g>
 </symbol><symbol id="link" viewBox="0 0 16 16">
     <path fill-rule="evenodd" d="M9.259 4.045a1.043 1.043 0 1 1-1.475-1.474L9.44.915a3.126 3.126 0 0 1 4.417-.002l1.23 1.23a3.126 3.126 0 0 1-.007 4.422l-3.612 3.612c-1.6 1.6-4.244 1.65-5.77.124a1.043 1.043 0 1 1 1.475-1.474c.699.698 2.023.673 2.82-.125l3.613-3.612a1.04 1.04 0 0 0 .006-1.473l-1.23-1.23a1.04 1.04 0 0 0-1.468.003L9.26 4.045zm-2.518 7.91a1.043 1.043 0 0 1 1.475 1.474L6.56 15.085a3.126 3.126 0 0 1-4.417.002l-1.23-1.23a3.126 3.126 0 0 1 .006-4.422l3.613-3.612c1.6-1.6 4.243-1.65 5.77-.124a1.043 1.043 0 0 1-1.475 1.474c-.7-.698-2.023-.673-2.82.125L2.393 10.91a1.04 1.04 0 0 0-.007 1.473l1.23 1.23a1.04 1.04 0 0 0 1.469-.003l1.655-1.655z"/>
-</symbol><symbol id="list" viewBox="0 0 16 16">
+</symbol><symbol id="list-min" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M3 11a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm10 0a1 1 0 1 1 0 2H7a1 1 0 1 1 0-2h6ZM3 7a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm10 0a1 1 0 1 1 0 2H7a1 1 0 0 1 0-2h6ZM3 3a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm10 0a1 1 0 1 1 0 2H7a1 1 0 0 1 0-2h6Z"/></symbol><symbol id="list" viewBox="0 0 16 16">
     <path fill-rule="evenodd" d="M0 0h4v4H0V0zm6 0h10v4H6V0zM0 6h4v4H0V6zm6 0h10v4H6V6zm-6 6h4v4H0v-4zm6 0h10v4H6v-4z"/>
 </symbol><symbol id="location" viewBox="0 0 16 16">
     <path fill-rule="evenodd" d="M8 0c3.99 0 7 2.866 7 6.667 0 4.782-6.508 9.089-6.784 9.27a.398.398 0 0 1-.432 0C7.507 15.756 1 11.45 1 6.667 1 2.866 4.01 0 8 0zm0 9a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z"/>
@@ -445,7 +445,7 @@ animation: checkmark 0.5s ease-in-out 0.16s backwards
     <path fill-rule="evenodd" d="M10.472 10H11.5l3.294 3.294a.996.996 0 0 1 0 1.412l-.088.088a1 1 0 0 1-1.412 0L10 11.5v-1.028a6 6 0 1 1 .472-.472zM6 10a4 4 0 1 0 0-8 4 4 0 0 0 0 8z"/>
 </symbol><symbol id="merge" viewBox="0 0 16 16">
     <path fill-rule="evenodd" d="M8 0L4 3.997h3.064V9.18L2 14.59 3.32 16l5.616-5.999V3.997H12L8 0zm1.488 12.59L12.68 16 14 14.591l-3.191-3.411-1.32 1.41z"/>
-</symbol><symbol id="moped" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 0a1 1 0 1 0 0 2h2.246l1.604 5.613L12 9H8V5a1 1 0 0 0-1-1H2a1 1 0 1 0 0 2h2a4 4 0 0 0-4 4v1.986A1 1 0 0 0 1 13a3 3 0 0 0 6 0h2a3 3 0 1 0 4.48-2.61L15.6 8.8a1 1 0 0 0 .362-1.075l-2-7A1 1 0 0 0 13 0h-3ZM4.922 12.613a1 1 0 1 1-1.903.19l1.903-.19ZM12 14a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"/></symbol><symbol id="motorcycle" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.965 4H6a1 1 0 0 1 0-2h2.324c.444 0 .86.222 1.106.592l1.596 2.395L14 3.5V6h-2.298l1.333 2a3 3 0 1 1-1.946.687l-.744-1.116-1.589 3.814a1 1 0 0 1-.923.615H7.46a1 1 0 0 1-.76-.35l-.705-.822a3 3 0 1 1-2.908-2.826L3.086 8H1a1 1 0 0 1 0-2h2.615c.192 0 .375.076.511.212l1.282 1.282 1.57-1.121A2 2 0 0 1 8.141 6h1.157L7.965 4ZM4 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm10 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"/></symbol><symbol id="mountain" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="m6.065 7.66-.003.005-1.19-2.116a1 1 0 0 0-1.744 0l-2.79 4.96A1 1 0 0 0 1.21 12h13.538a1 1 0 0 0 .86-1.509l-4.747-8.034a1 1 0 0 0-1.722 0l-2.192 3.71 1.527 2.715a.75.75 0 1 1-1.308.736L6.065 7.66Z"/></symbol><symbol id="movement-in" viewBox="0 0 16 16">
+</symbol><symbol id="moped" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 0a1 1 0 1 0 0 2h2.246l1.604 5.613L12 9H8V5a1 1 0 0 0-1-1H2a1 1 0 1 0 0 2h2a4 4 0 0 0-4 4v1.986A1 1 0 0 0 1 13a3 3 0 0 0 6 0h2a3 3 0 1 0 4.48-2.61L15.6 8.8a1 1 0 0 0 .362-1.075l-2-7A1 1 0 0 0 13 0h-3ZM4.922 12.613a1 1 0 1 1-1.903.19l1.903-.19ZM12 14a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"/></symbol><symbol id="mosaic-min" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 9a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h3Zm7 0a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h3ZM6 2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3Zm7 0a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3Z"/></symbol><symbol id="motorcycle" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.965 4H6a1 1 0 0 1 0-2h2.324c.444 0 .86.222 1.106.592l1.596 2.395L14 3.5V6h-2.298l1.333 2a3 3 0 1 1-1.946.687l-.744-1.116-1.589 3.814a1 1 0 0 1-.923.615H7.46a1 1 0 0 1-.76-.35l-.705-.822a3 3 0 1 1-2.908-2.826L3.086 8H1a1 1 0 0 1 0-2h2.615c.192 0 .375.076.511.212l1.282 1.282 1.57-1.121A2 2 0 0 1 8.141 6h1.157L7.965 4ZM4 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm10 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"/></symbol><symbol id="mountain" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="m6.065 7.66-.003.005-1.19-2.116a1 1 0 0 0-1.744 0l-2.79 4.96A1 1 0 0 0 1.21 12h13.538a1 1 0 0 0 .86-1.509l-4.747-8.034a1 1 0 0 0-1.722 0l-2.192 3.71 1.527 2.715a.75.75 0 1 1-1.308.736L6.065 7.66Z"/></symbol><symbol id="movement-in" viewBox="0 0 16 16">
     <g fill-rule="evenodd">
         <path d="M3.414 10H11a1 1 0 0 1 0 2H3.414l1.293 1.293a1 1 0 0 1-1.414 1.414l-3-3a1 1 0 0 1 0-1.414l3-3a1 1 0 1 1 1.414 1.414L3.414 10z" opacity=".322"/>
         <path d="M12.586 4l-1.293-1.293a1 1 0 1 1 1.414-1.414l3 3a1 1 0 0 1 0 1.414l-3 3a1 1 0 0 1-1.414-1.414L12.586 6H5a1 1 0 1 1 0-2h7.586z"/>

package/react/IconStack/index.jsx

@@ -1,5 +1,6 @@
 import React from 'react'
 import classNames from 'classnames'
+import PropTypes from 'prop-types'
 
 import migrateProps from '../helpers/migrateProps'
 import styles from './styles.styl'
@@ -16,19 +17,35 @@ const IconStack = ({
       className={classNames(styles['IconStack-wrapper'], backgroundClassName)}
     >
       {backgroundIcon}
-      <div
-        style={{ marginTop: offset?.vertical, marginLeft: offset?.horizontal }}
-        className={classNames(
-          styles['IconStack-foregroundIcon'],
-          foregroundClassName
-        )}
-      >
-        {foregroundIcon}
-      </div>
+      {foregroundIcon && (
+        <div
+          style={{
+            marginTop: offset?.vertical,
+            marginLeft: offset?.horizontal
+          }}
+          className={classNames(
+            styles['IconStack-foregroundIcon'],
+            foregroundClassName
+          )}
+        >
+          {foregroundIcon}
+        </div>
+      )}
     </div>
   )
 }
 
+IconStack.propTypes = {
+  backgroundClassName: PropTypes.string,
+  foregroundClassName: PropTypes.string,
+  backgroundIcon: PropTypes.node,
+  foregroundIcon: PropTypes.node,
+  offset: PropTypes.shape({
+    vertical: PropTypes.string,
+    horizontal: PropTypes.string
+  })
+}
+
 export default migrateProps([
   { src: 'className', dest: 'backgroundClassName' },
   { src: 'background', dest: 'backgroundIcon' },

package/react/Icons/ListMin.jsx

@@ -0,0 +1,16 @@
+// Automatically created, please run `scripts/generate-svgr-icon.sh assets/icons/ui/list-min.svg` to regenerate;
+import React from 'react'
+
+function SvgListMin(props) {
+  return (
+    <svg viewBox="0 0 16 16" {...props}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M3 11a1 1 0 110 2 1 1 0 010-2zm10 0a1 1 0 110 2H7a1 1 0 110-2h6zM3 7a1 1 0 110 2 1 1 0 010-2zm10 0a1 1 0 110 2H7a1 1 0 010-2h6zM3 3a1 1 0 110 2 1 1 0 010-2zm10 0a1 1 0 110 2H7a1 1 0 010-2h6z"
+      />
+    </svg>
+  )
+}
+
+export default SvgListMin

package/react/Icons/MosaicMin.jsx

@@ -0,0 +1,16 @@
+// Automatically created, please run `scripts/generate-svgr-icon.sh assets/icons/ui/mosaic-min.svg` to regenerate;
+import React from 'react'
+
+function SvgMosaicMin(props) {
+  return (
+    <svg viewBox="0 0 16 16" {...props}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M6 9a1 1 0 011 1v3a1 1 0 01-1 1H3a1 1 0 01-1-1v-3a1 1 0 011-1h3zm7 0a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-3a1 1 0 011-1h3zM6 2a1 1 0 011 1v3a1 1 0 01-1 1H3a1 1 0 01-1-1V3a1 1 0 011-1h3zm7 0a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1V3a1 1 0 011-1h3z"
+      />
+    </svg>
+  )
+}
+
+export default SvgMosaicMin