cozy-ui 121.1.0 → 121.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cozy-ui.min.css +1 -1
  3. package/package.json +1 -1
  4. package/react/Avatar/Readme.md +41 -21
  5. package/react/Avatar/helpers.js +13 -2
  6. package/react/Avatar/index.jsx +26 -5
  7. package/react/Fab/Readme.md +2 -1
  8. package/react/Fab/index.js +6 -0
  9. package/react/MuiCozyTheme/overrides/makeLightNormalOverrides.js +71 -0
  10. package/react/MuiCozyTheme/overrides/twake/makeLightNormalOverrides.js +7 -19
  11. package/stylus/components/nav.styl +2 -0
  12. package/transpiled/react/Avatar/helpers.d.ts +1 -1
  13. package/transpiled/react/Avatar/helpers.js +16 -2
  14. package/transpiled/react/Avatar/index.js +11 -5
  15. package/transpiled/react/Fab/index.js +4 -0
  16. package/transpiled/react/MuiCozyTheme/overrides/makeDarkInvertedOverrides.d.ts +71 -0
  17. package/transpiled/react/MuiCozyTheme/overrides/makeDarkNormalOverrides.d.ts +71 -0
  18. package/transpiled/react/MuiCozyTheme/overrides/makeLightInvertedOverrides.d.ts +71 -0
  19. package/transpiled/react/MuiCozyTheme/overrides/makeLightNormalOverrides.d.ts +71 -0
  20. package/transpiled/react/MuiCozyTheme/overrides/makeLightNormalOverrides.js +72 -0
  21. package/transpiled/react/MuiCozyTheme/overrides/twake/makeDarkInvertedOverrides.d.ts +78 -19
  22. package/transpiled/react/MuiCozyTheme/overrides/twake/makeDarkNormalOverrides.d.ts +78 -19
  23. package/transpiled/react/MuiCozyTheme/overrides/twake/makeLightInvertedOverrides.d.ts +78 -19
  24. package/transpiled/react/MuiCozyTheme/overrides/twake/makeLightNormalOverrides.d.ts +78 -19
  25. package/transpiled/react/MuiCozyTheme/overrides/twake/makeLightNormalOverrides.js +7 -19
  26. package/transpiled/react/stylesheet.css +1 -1
@@ -728,6 +728,77 @@ export function makeLightInvertedOverrides(theme: any): {
728
728
  };
729
729
  };
730
730
  };
731
+ MuiAvatarGroup: {
732
+ avatar: {
733
+ border: string;
734
+ };
735
+ };
736
+ MuiAvatar: {
737
+ root: {
738
+ fontWeight: number;
739
+ '&.size': {
740
+ '&-xs': {
741
+ width: number;
742
+ height: number;
743
+ fontSize: number;
744
+ '& svg': {
745
+ width: number;
746
+ height: number;
747
+ };
748
+ };
749
+ '&-s': {
750
+ width: number;
751
+ height: number;
752
+ fontSize: number;
753
+ '& svg': {
754
+ width: number;
755
+ height: number;
756
+ };
757
+ };
758
+ '&-m': {
759
+ width: number;
760
+ height: number;
761
+ fontSize: number;
762
+ '& svg': {
763
+ width: number;
764
+ height: number;
765
+ };
766
+ };
767
+ '&-l': {
768
+ width: number;
769
+ height: number;
770
+ fontSize: number;
771
+ '& svg': {
772
+ width: number;
773
+ height: number;
774
+ };
775
+ };
776
+ '&-xl': {
777
+ width: number;
778
+ height: number;
779
+ fontSize: number;
780
+ '& svg': {
781
+ width: number;
782
+ height: number;
783
+ };
784
+ };
785
+ };
786
+ '&.disabled': {
787
+ color: any;
788
+ background: string;
789
+ '& img': {
790
+ filter: string;
791
+ opacity: number;
792
+ };
793
+ };
794
+ '&.border': {
795
+ border: string;
796
+ };
797
+ '&.innerBorder': {
798
+ boxShadow: string;
799
+ };
800
+ };
801
+ };
731
802
  MuiCheckbox: {
732
803
  colorSecondary: {
733
804
  '&$checked': {
@@ -728,6 +728,77 @@ export function makeLightNormalOverrides(theme: any): {
728
728
  };
729
729
  };
730
730
  };
731
+ MuiAvatarGroup: {
732
+ avatar: {
733
+ border: string;
734
+ };
735
+ };
736
+ MuiAvatar: {
737
+ root: {
738
+ fontWeight: number;
739
+ '&.size': {
740
+ '&-xs': {
741
+ width: number;
742
+ height: number;
743
+ fontSize: number;
744
+ '& svg': {
745
+ width: number;
746
+ height: number;
747
+ };
748
+ };
749
+ '&-s': {
750
+ width: number;
751
+ height: number;
752
+ fontSize: number;
753
+ '& svg': {
754
+ width: number;
755
+ height: number;
756
+ };
757
+ };
758
+ '&-m': {
759
+ width: number;
760
+ height: number;
761
+ fontSize: number;
762
+ '& svg': {
763
+ width: number;
764
+ height: number;
765
+ };
766
+ };
767
+ '&-l': {
768
+ width: number;
769
+ height: number;
770
+ fontSize: number;
771
+ '& svg': {
772
+ width: number;
773
+ height: number;
774
+ };
775
+ };
776
+ '&-xl': {
777
+ width: number;
778
+ height: number;
779
+ fontSize: number;
780
+ '& svg': {
781
+ width: number;
782
+ height: number;
783
+ };
784
+ };
785
+ };
786
+ '&.disabled': {
787
+ color: any;
788
+ background: string;
789
+ '& img': {
790
+ filter: string;
791
+ opacity: number;
792
+ };
793
+ };
794
+ '&.border': {
795
+ border: string;
796
+ };
797
+ '&.innerBorder': {
798
+ boxShadow: string;
799
+ };
800
+ };
801
+ };
731
802
  MuiCheckbox: {
732
803
  colorSecondary: {
733
804
  '&$checked': {
@@ -642,6 +642,78 @@ export var makeLightNormalOverrides = function makeLightNormalOverrides(theme) {
642
642
  }
643
643
  }
644
644
  },
645
+ MuiAvatarGroup: {
646
+ avatar: {
647
+ border: "2px solid ".concat(theme.palette.background.paper)
648
+ }
649
+ },
650
+ MuiAvatar: {
651
+ root: {
652
+ fontWeight: 600,
653
+ '&.size': {
654
+ '&-xs': {
655
+ width: 16,
656
+ height: 16,
657
+ fontSize: 8,
658
+ '& svg': {
659
+ width: 8,
660
+ height: 8
661
+ }
662
+ },
663
+ '&-s': {
664
+ width: 24,
665
+ height: 24,
666
+ fontSize: 12,
667
+ '& svg': {
668
+ width: 12,
669
+ height: 12
670
+ }
671
+ },
672
+ '&-m': {
673
+ width: 32,
674
+ height: 32,
675
+ fontSize: 16,
676
+ '& svg': {
677
+ width: 16,
678
+ height: 16
679
+ }
680
+ },
681
+ '&-l': {
682
+ width: 48,
683
+ height: 48,
684
+ fontSize: 24,
685
+ '& svg': {
686
+ width: 24,
687
+ height: 24
688
+ }
689
+ },
690
+ '&-xl': {
691
+ width: 64,
692
+ height: 64,
693
+ fontSize: 32,
694
+ '& svg': {
695
+ width: 32,
696
+ height: 32
697
+ }
698
+ }
699
+ },
700
+ '&.disabled': {
701
+ color: theme.palette.primary.contrastText,
702
+ background: 'var(--silver)',
703
+ // should be semantic but used legacy component color for now
704
+ '& img': {
705
+ filter: 'grayscale(1) brightness(2)',
706
+ opacity: 0.5
707
+ }
708
+ },
709
+ '&.border': {
710
+ border: "2px solid ".concat(theme.palette.background.paper)
711
+ },
712
+ '&.innerBorder': {
713
+ boxShadow: "inset 0px 0px 0px 1px ".concat(theme.palette.border.main)
714
+ }
715
+ }
716
+ },
645
717
  MuiCheckbox: {
646
718
  colorSecondary: {
647
719
  '&$checked': {
@@ -728,6 +728,77 @@ export function makeDarkInvertedTwakeOverrides(theme: any): {
728
728
  };
729
729
  };
730
730
  };
731
+ MuiAvatarGroup: {
732
+ avatar: {
733
+ border: string;
734
+ };
735
+ };
736
+ MuiAvatar: {
737
+ root: {
738
+ fontWeight: number;
739
+ '&.size': {
740
+ '&-xs': {
741
+ width: number;
742
+ height: number;
743
+ fontSize: number;
744
+ '& svg': {
745
+ width: number;
746
+ height: number;
747
+ };
748
+ };
749
+ '&-s': {
750
+ width: number;
751
+ height: number;
752
+ fontSize: number;
753
+ '& svg': {
754
+ width: number;
755
+ height: number;
756
+ };
757
+ };
758
+ '&-m': {
759
+ width: number;
760
+ height: number;
761
+ fontSize: number;
762
+ '& svg': {
763
+ width: number;
764
+ height: number;
765
+ };
766
+ };
767
+ '&-l': {
768
+ width: number;
769
+ height: number;
770
+ fontSize: number;
771
+ '& svg': {
772
+ width: number;
773
+ height: number;
774
+ };
775
+ };
776
+ '&-xl': {
777
+ width: number;
778
+ height: number;
779
+ fontSize: number;
780
+ '& svg': {
781
+ width: number;
782
+ height: number;
783
+ };
784
+ };
785
+ };
786
+ '&.disabled': {
787
+ color: any;
788
+ background: string;
789
+ '& img': {
790
+ filter: string;
791
+ opacity: number;
792
+ };
793
+ };
794
+ '&.border': {
795
+ border: string;
796
+ };
797
+ '&.innerBorder': {
798
+ boxShadow: string;
799
+ };
800
+ };
801
+ };
731
802
  MuiCheckbox: {
732
803
  colorSecondary: {
733
804
  '&$checked': {
@@ -1654,22 +1725,23 @@ export function makeDarkInvertedTwakeOverrides(theme: any): {
1654
1725
  height: number;
1655
1726
  };
1656
1727
  };
1728
+ MuiAvatarGroup: {
1729
+ root: {
1730
+ '& > div:last-child': {
1731
+ boxShadow: string;
1732
+ };
1733
+ };
1734
+ };
1657
1735
  MuiAvatar: {
1658
1736
  root: {
1659
- fontWeight: number;
1660
1737
  '&.size': {
1661
1738
  '&-xs': {
1662
- width: number;
1663
- height: number;
1664
- fontSize: number;
1665
1739
  '& svg': {
1666
1740
  width: number;
1667
1741
  height: number;
1668
1742
  };
1669
1743
  };
1670
1744
  '&-s': {
1671
- width: number;
1672
- height: number;
1673
1745
  fontSize: number;
1674
1746
  '& svg': {
1675
1747
  width: number;
@@ -1677,37 +1749,24 @@ export function makeDarkInvertedTwakeOverrides(theme: any): {
1677
1749
  };
1678
1750
  };
1679
1751
  '&-m': {
1680
- width: number;
1681
- height: number;
1682
- fontSize: number;
1683
1752
  '& svg': {
1684
1753
  width: number;
1685
1754
  height: number;
1686
1755
  };
1687
1756
  };
1688
1757
  '&-l': {
1689
- width: number;
1690
- height: number;
1691
- fontSize: number;
1692
1758
  '& svg': {
1693
1759
  width: number;
1694
1760
  height: number;
1695
1761
  };
1696
1762
  };
1697
1763
  '&-xl': {
1698
- width: number;
1699
- height: number;
1700
- fontSize: number;
1701
1764
  '& svg': {
1702
1765
  width: number;
1703
1766
  height: number;
1704
1767
  };
1705
1768
  };
1706
1769
  };
1707
- '&.disabled': {
1708
- color: any;
1709
- background: any;
1710
- };
1711
1770
  };
1712
1771
  colorDefault: {
1713
1772
  backgroundColor: any;
@@ -728,6 +728,77 @@ export function makeDarkNormalTwakeOverrides(theme: any): {
728
728
  };
729
729
  };
730
730
  };
731
+ MuiAvatarGroup: {
732
+ avatar: {
733
+ border: string;
734
+ };
735
+ };
736
+ MuiAvatar: {
737
+ root: {
738
+ fontWeight: number;
739
+ '&.size': {
740
+ '&-xs': {
741
+ width: number;
742
+ height: number;
743
+ fontSize: number;
744
+ '& svg': {
745
+ width: number;
746
+ height: number;
747
+ };
748
+ };
749
+ '&-s': {
750
+ width: number;
751
+ height: number;
752
+ fontSize: number;
753
+ '& svg': {
754
+ width: number;
755
+ height: number;
756
+ };
757
+ };
758
+ '&-m': {
759
+ width: number;
760
+ height: number;
761
+ fontSize: number;
762
+ '& svg': {
763
+ width: number;
764
+ height: number;
765
+ };
766
+ };
767
+ '&-l': {
768
+ width: number;
769
+ height: number;
770
+ fontSize: number;
771
+ '& svg': {
772
+ width: number;
773
+ height: number;
774
+ };
775
+ };
776
+ '&-xl': {
777
+ width: number;
778
+ height: number;
779
+ fontSize: number;
780
+ '& svg': {
781
+ width: number;
782
+ height: number;
783
+ };
784
+ };
785
+ };
786
+ '&.disabled': {
787
+ color: any;
788
+ background: string;
789
+ '& img': {
790
+ filter: string;
791
+ opacity: number;
792
+ };
793
+ };
794
+ '&.border': {
795
+ border: string;
796
+ };
797
+ '&.innerBorder': {
798
+ boxShadow: string;
799
+ };
800
+ };
801
+ };
731
802
  MuiCheckbox: {
732
803
  colorSecondary: {
733
804
  '&$checked': {
@@ -1654,22 +1725,23 @@ export function makeDarkNormalTwakeOverrides(theme: any): {
1654
1725
  height: number;
1655
1726
  };
1656
1727
  };
1728
+ MuiAvatarGroup: {
1729
+ root: {
1730
+ '& > div:last-child': {
1731
+ boxShadow: string;
1732
+ };
1733
+ };
1734
+ };
1657
1735
  MuiAvatar: {
1658
1736
  root: {
1659
- fontWeight: number;
1660
1737
  '&.size': {
1661
1738
  '&-xs': {
1662
- width: number;
1663
- height: number;
1664
- fontSize: number;
1665
1739
  '& svg': {
1666
1740
  width: number;
1667
1741
  height: number;
1668
1742
  };
1669
1743
  };
1670
1744
  '&-s': {
1671
- width: number;
1672
- height: number;
1673
1745
  fontSize: number;
1674
1746
  '& svg': {
1675
1747
  width: number;
@@ -1677,37 +1749,24 @@ export function makeDarkNormalTwakeOverrides(theme: any): {
1677
1749
  };
1678
1750
  };
1679
1751
  '&-m': {
1680
- width: number;
1681
- height: number;
1682
- fontSize: number;
1683
1752
  '& svg': {
1684
1753
  width: number;
1685
1754
  height: number;
1686
1755
  };
1687
1756
  };
1688
1757
  '&-l': {
1689
- width: number;
1690
- height: number;
1691
- fontSize: number;
1692
1758
  '& svg': {
1693
1759
  width: number;
1694
1760
  height: number;
1695
1761
  };
1696
1762
  };
1697
1763
  '&-xl': {
1698
- width: number;
1699
- height: number;
1700
- fontSize: number;
1701
1764
  '& svg': {
1702
1765
  width: number;
1703
1766
  height: number;
1704
1767
  };
1705
1768
  };
1706
1769
  };
1707
- '&.disabled': {
1708
- color: any;
1709
- background: any;
1710
- };
1711
1770
  };
1712
1771
  colorDefault: {
1713
1772
  backgroundColor: any;
@@ -728,6 +728,77 @@ export function makeLightInvertedTwakeOverrides(theme: any): {
728
728
  };
729
729
  };
730
730
  };
731
+ MuiAvatarGroup: {
732
+ avatar: {
733
+ border: string;
734
+ };
735
+ };
736
+ MuiAvatar: {
737
+ root: {
738
+ fontWeight: number;
739
+ '&.size': {
740
+ '&-xs': {
741
+ width: number;
742
+ height: number;
743
+ fontSize: number;
744
+ '& svg': {
745
+ width: number;
746
+ height: number;
747
+ };
748
+ };
749
+ '&-s': {
750
+ width: number;
751
+ height: number;
752
+ fontSize: number;
753
+ '& svg': {
754
+ width: number;
755
+ height: number;
756
+ };
757
+ };
758
+ '&-m': {
759
+ width: number;
760
+ height: number;
761
+ fontSize: number;
762
+ '& svg': {
763
+ width: number;
764
+ height: number;
765
+ };
766
+ };
767
+ '&-l': {
768
+ width: number;
769
+ height: number;
770
+ fontSize: number;
771
+ '& svg': {
772
+ width: number;
773
+ height: number;
774
+ };
775
+ };
776
+ '&-xl': {
777
+ width: number;
778
+ height: number;
779
+ fontSize: number;
780
+ '& svg': {
781
+ width: number;
782
+ height: number;
783
+ };
784
+ };
785
+ };
786
+ '&.disabled': {
787
+ color: any;
788
+ background: string;
789
+ '& img': {
790
+ filter: string;
791
+ opacity: number;
792
+ };
793
+ };
794
+ '&.border': {
795
+ border: string;
796
+ };
797
+ '&.innerBorder': {
798
+ boxShadow: string;
799
+ };
800
+ };
801
+ };
731
802
  MuiCheckbox: {
732
803
  colorSecondary: {
733
804
  '&$checked': {
@@ -1654,22 +1725,23 @@ export function makeLightInvertedTwakeOverrides(theme: any): {
1654
1725
  height: number;
1655
1726
  };
1656
1727
  };
1728
+ MuiAvatarGroup: {
1729
+ root: {
1730
+ '& > div:last-child': {
1731
+ boxShadow: string;
1732
+ };
1733
+ };
1734
+ };
1657
1735
  MuiAvatar: {
1658
1736
  root: {
1659
- fontWeight: number;
1660
1737
  '&.size': {
1661
1738
  '&-xs': {
1662
- width: number;
1663
- height: number;
1664
- fontSize: number;
1665
1739
  '& svg': {
1666
1740
  width: number;
1667
1741
  height: number;
1668
1742
  };
1669
1743
  };
1670
1744
  '&-s': {
1671
- width: number;
1672
- height: number;
1673
1745
  fontSize: number;
1674
1746
  '& svg': {
1675
1747
  width: number;
@@ -1677,37 +1749,24 @@ export function makeLightInvertedTwakeOverrides(theme: any): {
1677
1749
  };
1678
1750
  };
1679
1751
  '&-m': {
1680
- width: number;
1681
- height: number;
1682
- fontSize: number;
1683
1752
  '& svg': {
1684
1753
  width: number;
1685
1754
  height: number;
1686
1755
  };
1687
1756
  };
1688
1757
  '&-l': {
1689
- width: number;
1690
- height: number;
1691
- fontSize: number;
1692
1758
  '& svg': {
1693
1759
  width: number;
1694
1760
  height: number;
1695
1761
  };
1696
1762
  };
1697
1763
  '&-xl': {
1698
- width: number;
1699
- height: number;
1700
- fontSize: number;
1701
1764
  '& svg': {
1702
1765
  width: number;
1703
1766
  height: number;
1704
1767
  };
1705
1768
  };
1706
1769
  };
1707
- '&.disabled': {
1708
- color: any;
1709
- background: any;
1710
- };
1711
1770
  };
1712
1771
  colorDefault: {
1713
1772
  backgroundColor: any;