@mond-design-system/react 4.6.0 → 4.7.0

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.
package/dist/index.css CHANGED
@@ -791,6 +791,9 @@ button.mds-Link__link {
791
791
  .mds-Sheet__headerTitle {
792
792
  flex: 1;
793
793
  min-width: 0;
794
+ margin: 0;
795
+ font: inherit;
796
+ color: inherit;
794
797
  }
795
798
  .mds-Sheet__close {
796
799
  display: inline-flex;
@@ -1221,6 +1224,9 @@ button.mds-Link__link {
1221
1224
  .mds-Checkbox__root:has(.mds-Checkbox__box:disabled) {
1222
1225
  cursor: not-allowed;
1223
1226
  }
1227
+ .mds-Checkbox__bare {
1228
+ gap: 0;
1229
+ }
1224
1230
  .mds-Checkbox__box {
1225
1231
  appearance: none;
1226
1232
  flex: none;
@@ -1241,6 +1247,16 @@ button.mds-Link__link {
1241
1247
  background: var(--mds-action-bg);
1242
1248
  border-color: var(--mds-action-bg);
1243
1249
  }
1250
+ .mds-Checkbox__box:indeterminate {
1251
+ background: var(--mds-action-bg);
1252
+ border-color: var(--mds-action-bg);
1253
+ }
1254
+ .mds-Checkbox__box:indeterminate::after {
1255
+ content: "";
1256
+ width: 0.5em;
1257
+ height: 0;
1258
+ border-top: solid calc(var(--mds-border-width) * 2) var(--mds-action-fg);
1259
+ }
1244
1260
  .mds-Checkbox__box:checked::after {
1245
1261
  content: "";
1246
1262
  width: 0.32em;
@@ -1650,6 +1666,169 @@ button.mds-Link__link {
1650
1666
  color: var(--mds-text-secondary);
1651
1667
  }
1652
1668
 
1669
+ /* mds-css:/home/runner/work/mond-design-system/mond-design-system/packages/react/src/components/DataTable/DataTable.module.css?mds-scoped */
1670
+ .mds-DataTable__root {
1671
+ display: flex;
1672
+ flex-direction: column;
1673
+ gap: var(--mds-gap-tight);
1674
+ }
1675
+ .mds-DataTable__table {
1676
+ width: 100%;
1677
+ display: block;
1678
+ }
1679
+ .mds-DataTable__table colgroup {
1680
+ display: none;
1681
+ }
1682
+ .mds-DataTable__body {
1683
+ display: flex;
1684
+ flex-direction: column;
1685
+ gap: var(--mds-gap-tight);
1686
+ }
1687
+ .mds-DataTable__row {
1688
+ display: flex;
1689
+ flex-direction: column;
1690
+ gap: var(--mds-gap-hairline);
1691
+ padding: var(--mds-pad-card);
1692
+ background: var(--mds-surface-card);
1693
+ border: var(--mds-border-width) solid var(--mds-border-subtle);
1694
+ border-radius: var(--mds-radius-card);
1695
+ }
1696
+ .mds-DataTable__cell,
1697
+ .mds-DataTable__select,
1698
+ .mds-DataTable__actions {
1699
+ display: block;
1700
+ padding: 0;
1701
+ font: var(--mds-type-body);
1702
+ text-align: start;
1703
+ }
1704
+ .mds-DataTable__key {
1705
+ display: block;
1706
+ color: var(--mds-text-secondary);
1707
+ font: var(--mds-type-label);
1708
+ }
1709
+ .mds-DataTable__lead {
1710
+ font: var(--mds-type-subtitle);
1711
+ }
1712
+ .mds-DataTable__select {
1713
+ order: -1;
1714
+ }
1715
+ .mds-DataTable__actions {
1716
+ display: flex;
1717
+ flex-wrap: wrap;
1718
+ gap: var(--mds-gap-tight);
1719
+ margin-block-start: var(--mds-gap-hairline);
1720
+ }
1721
+ .mds-DataTable__selected {
1722
+ background: var(--mds-surface-selected);
1723
+ }
1724
+ .mds-DataTable__muted {
1725
+ color: var(--mds-text-secondary);
1726
+ }
1727
+ .mds-DataTable__empty {
1728
+ padding: var(--mds-pad-card);
1729
+ text-align: center;
1730
+ }
1731
+ .mds-DataTable__bulk {
1732
+ display: flex;
1733
+ flex-direction: column;
1734
+ align-items: stretch;
1735
+ gap: var(--mds-gap-tight);
1736
+ padding: var(--mds-pad-tight) var(--mds-pad-control);
1737
+ background: var(--mds-surface-sunken);
1738
+ border: var(--mds-border-width) solid var(--mds-border-subtle);
1739
+ border-radius: var(--mds-radius-card);
1740
+ }
1741
+ .mds-DataTable__bulkActions {
1742
+ display: flex;
1743
+ gap: var(--mds-gap-tight);
1744
+ }
1745
+ .mds-DataTable__bulkActions > * {
1746
+ flex: 1;
1747
+ }
1748
+ @media (min-width: 600px) {
1749
+ .mds-DataTable__bulk {
1750
+ flex-direction: row;
1751
+ align-items: center;
1752
+ justify-content: space-between;
1753
+ }
1754
+ .mds-DataTable__bulkActions > * {
1755
+ flex: initial;
1756
+ }
1757
+ }
1758
+ @media (min-width: 1024px) {
1759
+ .mds-DataTable__table {
1760
+ display: table;
1761
+ border-collapse: collapse;
1762
+ background: var(--mds-surface-card);
1763
+ border: var(--mds-border-width) solid var(--mds-border-subtle);
1764
+ border-radius: var(--mds-radius-card);
1765
+ overflow: hidden;
1766
+ }
1767
+ .mds-DataTable__table colgroup {
1768
+ display: table-column-group;
1769
+ }
1770
+ .mds-DataTable__root .mds-DataTable__head {
1771
+ display: table-header-group;
1772
+ position: static;
1773
+ width: auto;
1774
+ height: auto;
1775
+ margin: 0;
1776
+ overflow: visible;
1777
+ clip-path: none;
1778
+ white-space: normal;
1779
+ }
1780
+ .mds-DataTable__body {
1781
+ display: table-row-group;
1782
+ }
1783
+ .mds-DataTable__row {
1784
+ display: table-row;
1785
+ padding: 0;
1786
+ background: none;
1787
+ border: none;
1788
+ border-radius: 0;
1789
+ border-bottom: var(--mds-border-width) solid var(--mds-border-subtle);
1790
+ }
1791
+ .mds-DataTable__body .mds-DataTable__row:last-child {
1792
+ border-bottom: none;
1793
+ }
1794
+ .mds-DataTable__body .mds-DataTable__row:hover {
1795
+ background: var(--mds-surface-sunken);
1796
+ }
1797
+ .mds-DataTable__body .mds-DataTable__selected {
1798
+ background: var(--mds-surface-selected);
1799
+ }
1800
+ .mds-DataTable__cell,
1801
+ .mds-DataTable__select,
1802
+ .mds-DataTable__actions {
1803
+ display: table-cell;
1804
+ padding: var(--mds-pad-tight) var(--mds-pad-control);
1805
+ vertical-align: middle;
1806
+ }
1807
+ .mds-DataTable__key {
1808
+ display: none;
1809
+ }
1810
+ .mds-DataTable__lead {
1811
+ font: var(--mds-type-body);
1812
+ }
1813
+ th.mds-DataTable__cell,
1814
+ th.mds-DataTable__select,
1815
+ th.mds-DataTable__actions {
1816
+ color: var(--mds-text-secondary);
1817
+ font: var(--mds-type-label);
1818
+ white-space: nowrap;
1819
+ }
1820
+ .mds-DataTable__select {
1821
+ order: 0;
1822
+ width: var(--mds-tap-min);
1823
+ }
1824
+ .mds-DataTable__actions {
1825
+ width: 0;
1826
+ margin-block-start: 0;
1827
+ white-space: nowrap;
1828
+ text-align: end;
1829
+ }
1830
+ }
1831
+
1653
1832
  /* mds-css:/home/runner/work/mond-design-system/mond-design-system/packages/react/src/components/EmptyState/EmptyState.module.css?mds-scoped */
1654
1833
  .mds-EmptyState__root {
1655
1834
  display: flex;
@@ -1977,6 +2156,13 @@ button.mds-Link__link {
1977
2156
  font: var(--mds-type-panel-title);
1978
2157
  color: var(--mds-text-primary);
1979
2158
  }
2159
+ .mds-Modal__headerTitle {
2160
+ flex: 1;
2161
+ min-width: 0;
2162
+ margin: 0;
2163
+ font: inherit;
2164
+ color: inherit;
2165
+ }
1980
2166
  .mds-Modal__body {
1981
2167
  flex: 1;
1982
2168
  overflow-y: auto;