morya-ui 0.3.6 → 0.3.7

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 (201) hide show
  1. package/CHANGELOG.md +45 -1
  2. package/dist/Input-DQiiKSm3.js +174 -0
  3. package/dist/accordion/style.css +7 -9
  4. package/dist/auto-complete/style.css +7 -9
  5. package/dist/avatar/style.css +7 -9
  6. package/dist/badge/style.css +7 -9
  7. package/dist/block-ui/style.css +7 -9
  8. package/dist/breadcrumb/style.css +7 -9
  9. package/dist/button/style.css +7 -9
  10. package/dist/card/style.css +7 -9
  11. package/dist/carousel/style.css +7 -9
  12. package/dist/cascade-select/style.css +7 -9
  13. package/dist/checkbox/style.css +7 -9
  14. package/dist/chip/style.css +7 -9
  15. package/dist/command-menu/style.css +7 -9
  16. package/dist/component-registry.d.ts.map +1 -1
  17. package/dist/components/Drawer/Drawer.vue.d.ts +3 -1
  18. package/dist/components/Drawer/Drawer.vue.d.ts.map +1 -1
  19. package/dist/components/Drawer/styles.css +15 -3
  20. package/dist/components/Table/Table.vue.d.ts +188 -733
  21. package/dist/components/Table/Table.vue.d.ts.map +1 -1
  22. package/dist/components/Table/columns/keys.d.ts +13 -0
  23. package/dist/components/Table/columns/keys.d.ts.map +1 -0
  24. package/dist/components/Table/{hooks → columns}/useFixedColumn.d.ts +1 -1
  25. package/dist/components/Table/columns/useFixedColumn.d.ts.map +1 -0
  26. package/dist/components/Table/columns/useHeaders.d.ts +37 -0
  27. package/dist/components/Table/columns/useHeaders.d.ts.map +1 -0
  28. package/dist/components/Table/core/layout.d.ts +26 -0
  29. package/dist/components/Table/core/layout.d.ts.map +1 -0
  30. package/dist/components/Table/core/normalize.d.ts +30 -0
  31. package/dist/components/Table/core/normalize.d.ts.map +1 -0
  32. package/dist/components/Table/{tableQuery.d.ts → core/tableQuery.d.ts} +3 -2
  33. package/dist/components/Table/core/tableQuery.d.ts.map +1 -0
  34. package/dist/components/Table/core/tree.d.ts +31 -0
  35. package/dist/components/Table/core/tree.d.ts.map +1 -0
  36. package/dist/components/Table/core/treeSelection.d.ts +35 -0
  37. package/dist/components/Table/core/treeSelection.d.ts.map +1 -0
  38. package/dist/components/Table/core/utils.d.ts +15 -0
  39. package/dist/components/Table/core/utils.d.ts.map +1 -0
  40. package/dist/components/Table/hooks/index.d.ts +14 -10
  41. package/dist/components/Table/hooks/index.d.ts.map +1 -1
  42. package/dist/components/Table/index.d.ts +1 -1
  43. package/dist/components/Table/index.d.ts.map +1 -1
  44. package/dist/components/Table/render/TableDefaultCell.vue.d.ts +11 -0
  45. package/dist/components/Table/render/TableDefaultCell.vue.d.ts.map +1 -0
  46. package/dist/components/Table/render/TableHeaderFilter.vue.d.ts +20 -0
  47. package/dist/components/Table/render/TableHeaderFilter.vue.d.ts.map +1 -0
  48. package/dist/components/Table/render/TableLoadingLine.vue.d.ts.map +1 -0
  49. package/dist/components/Table/render/TableTbody.vue.d.ts +154 -0
  50. package/dist/components/Table/render/TableTbody.vue.d.ts.map +1 -0
  51. package/dist/components/Table/render/TableThead.vue.d.ts +76 -0
  52. package/dist/components/Table/render/TableThead.vue.d.ts.map +1 -0
  53. package/dist/components/Table/{hooks → state}/internal.d.ts +8 -2
  54. package/dist/components/Table/state/internal.d.ts.map +1 -0
  55. package/dist/components/Table/state/useClickRow.d.ts +7 -0
  56. package/dist/components/Table/state/useClickRow.d.ts.map +1 -0
  57. package/dist/components/Table/state/useColumnResize.d.ts +11 -0
  58. package/dist/components/Table/state/useColumnResize.d.ts.map +1 -0
  59. package/dist/components/Table/state/useExpandableRow.d.ts +25 -0
  60. package/dist/components/Table/state/useExpandableRow.d.ts.map +1 -0
  61. package/dist/components/Table/state/usePageItems.d.ts +15 -0
  62. package/dist/components/Table/state/usePageItems.d.ts.map +1 -0
  63. package/dist/components/Table/{hooks → state}/usePagination.d.ts.map +1 -1
  64. package/dist/components/Table/{hooks → state}/useRows.d.ts +2 -2
  65. package/dist/components/Table/{hooks → state}/useRows.d.ts.map +1 -1
  66. package/dist/components/Table/state/useServerOptions.d.ts.map +1 -0
  67. package/dist/components/Table/{hooks → state}/useTotalItems.d.ts +2 -2
  68. package/dist/components/Table/{hooks → state}/useTotalItems.d.ts.map +1 -1
  69. package/dist/components/Table/state/useTreeRows.d.ts +21 -0
  70. package/dist/components/Table/state/useTreeRows.d.ts.map +1 -0
  71. package/dist/components/Table/state/useVirtualRows.d.ts +23 -0
  72. package/dist/components/Table/state/useVirtualRows.d.ts.map +1 -0
  73. package/dist/components/Table/styles.css +182 -6
  74. package/dist/components/Table/types.d.ts +108 -25
  75. package/dist/components/Table/types.d.ts.map +1 -1
  76. package/dist/components/Tree/Tree.vue.d.ts +2 -2
  77. package/dist/components/TreeSelect/TreeSelect.vue.d.ts +1 -1
  78. package/dist/config-provider/style.css +7 -9
  79. package/dist/confirm-dialog/style.css +7 -9
  80. package/dist/confirm-popup/style.css +7 -9
  81. package/dist/context-menu/style.css +7 -9
  82. package/dist/data-view/style.css +7 -9
  83. package/dist/date-picker/style.css +7 -9
  84. package/dist/dialog/style.css +7 -9
  85. package/dist/divider/style.css +7 -9
  86. package/dist/dock/style.css +7 -9
  87. package/dist/drawer/index.js +57 -50
  88. package/dist/drawer/style.css +22 -12
  89. package/dist/dropdown/style.css +7 -9
  90. package/dist/empty/style.css +7 -9
  91. package/dist/fieldset/style.css +7 -9
  92. package/dist/file-upload/style.css +7 -9
  93. package/dist/flex/style.css +7 -9
  94. package/dist/float-label/style.css +7 -9
  95. package/dist/fluid/style.css +7 -9
  96. package/dist/form/style.css +7 -9
  97. package/dist/gallery/style.css +7 -9
  98. package/dist/grid/style.css +7 -9
  99. package/dist/icon/style.css +7 -9
  100. package/dist/icon-field/style.css +7 -9
  101. package/dist/index.d.ts +1 -3
  102. package/dist/index.d.ts.map +1 -1
  103. package/dist/index.js +4899 -3591
  104. package/dist/inplace/style.css +7 -9
  105. package/dist/input/index.js +2 -174
  106. package/dist/input/style.css +7 -9
  107. package/dist/input-color/style.css +7 -9
  108. package/dist/input-group/style.css +7 -9
  109. package/dist/input-number/style.css +7 -9
  110. package/dist/input-otp/style.css +7 -9
  111. package/dist/input-password/style.css +7 -9
  112. package/dist/input-tags/style.css +7 -9
  113. package/dist/knob/style.css +7 -9
  114. package/dist/label/style.css +7 -9
  115. package/dist/layout/style.css +7 -9
  116. package/dist/listbox/style.css +7 -9
  117. package/dist/loading/style.css +7 -9
  118. package/dist/mega-menu/style.css +7 -9
  119. package/dist/menu/style.css +7 -9
  120. package/dist/menubar/style.css +7 -9
  121. package/dist/message/style.css +7 -9
  122. package/dist/meter-group/style.css +7 -9
  123. package/dist/order-list/style.css +7 -9
  124. package/dist/page/style.css +7 -9
  125. package/dist/pagination/style.css +7 -9
  126. package/dist/panel/style.css +7 -9
  127. package/dist/pick-list/style.css +7 -9
  128. package/dist/popover/style.css +7 -9
  129. package/dist/progress-bar/style.css +7 -9
  130. package/dist/progress-spinner/style.css +7 -9
  131. package/dist/radio/style.css +7 -9
  132. package/dist/rating/style.css +7 -9
  133. package/dist/resolver-map.d.ts.map +1 -1
  134. package/dist/resolver.js +0 -1
  135. package/dist/result/style.css +7 -9
  136. package/dist/scroll-top/style.css +7 -9
  137. package/dist/scrollbar/style.css +7 -9
  138. package/dist/select/style.css +7 -9
  139. package/dist/select-button/style.css +7 -9
  140. package/dist/sidebar/style.css +7 -9
  141. package/dist/skeleton/style.css +7 -9
  142. package/dist/slider/style.css +7 -9
  143. package/dist/space/style.css +7 -9
  144. package/dist/speed-dial/style.css +7 -9
  145. package/dist/split-button/style.css +7 -9
  146. package/dist/splitter/style.css +7 -9
  147. package/dist/status/style.css +7 -9
  148. package/dist/stepper/style.css +7 -9
  149. package/dist/styles/base.css +0 -2
  150. package/dist/styles.css +1 -1
  151. package/dist/switch/style.css +7 -9
  152. package/dist/table/index.js +2027 -601
  153. package/dist/table/style.css +189 -166
  154. package/dist/table/style.js +0 -4
  155. package/dist/tabs/style.css +7 -9
  156. package/dist/tag/style.css +7 -9
  157. package/dist/terminal/style.css +7 -9
  158. package/dist/textarea/style.css +7 -9
  159. package/dist/theme/styles.css +7 -7
  160. package/dist/tiered-menu/style.css +7 -9
  161. package/dist/timeline/style.css +7 -9
  162. package/dist/toast/style.css +7 -9
  163. package/dist/toggle-button/style.css +7 -9
  164. package/dist/toolbar/style.css +7 -9
  165. package/dist/tooltip/style.css +7 -9
  166. package/dist/tree/style.css +7 -9
  167. package/dist/tree-select/style.css +7 -9
  168. package/dist/virtual-scroller/style.css +7 -9
  169. package/package.json +1 -8
  170. package/dist/components/Table/TableLoadingLine.vue.d.ts.map +0 -1
  171. package/dist/components/Table/hooks/internal.d.ts.map +0 -1
  172. package/dist/components/Table/hooks/useClickRow.d.ts +0 -7
  173. package/dist/components/Table/hooks/useClickRow.d.ts.map +0 -1
  174. package/dist/components/Table/hooks/useExpandableRow.d.ts +0 -9
  175. package/dist/components/Table/hooks/useExpandableRow.d.ts.map +0 -1
  176. package/dist/components/Table/hooks/useFixedColumn.d.ts.map +0 -1
  177. package/dist/components/Table/hooks/useHeaders.d.ts +0 -14
  178. package/dist/components/Table/hooks/useHeaders.d.ts.map +0 -1
  179. package/dist/components/Table/hooks/usePageItems.d.ts +0 -17
  180. package/dist/components/Table/hooks/usePageItems.d.ts.map +0 -1
  181. package/dist/components/Table/hooks/useServerOptions.d.ts.map +0 -1
  182. package/dist/components/Table/normalize.d.ts +0 -9
  183. package/dist/components/Table/normalize.d.ts.map +0 -1
  184. package/dist/components/Table/tableQuery.d.ts.map +0 -1
  185. package/dist/components/Table/utils.d.ts +0 -10
  186. package/dist/components/Table/utils.d.ts.map +0 -1
  187. package/dist/components/TreeTable/TreeTable.vue.d.ts +0 -24
  188. package/dist/components/TreeTable/TreeTable.vue.d.ts.map +0 -1
  189. package/dist/components/TreeTable/TreeTableRow.vue.d.ts +0 -17
  190. package/dist/components/TreeTable/TreeTableRow.vue.d.ts.map +0 -1
  191. package/dist/components/TreeTable/index.d.ts +0 -3
  192. package/dist/components/TreeTable/index.d.ts.map +0 -1
  193. package/dist/components/TreeTable/styles.css +0 -97
  194. package/dist/components/TreeTable/types.d.ts +0 -25
  195. package/dist/components/TreeTable/types.d.ts.map +0 -1
  196. package/dist/tree-table/index.js +0 -128
  197. package/dist/tree-table/style.css +0 -1296
  198. package/dist/tree-table/style.js +0 -4
  199. /package/dist/components/Table/{TableLoadingLine.vue.d.ts → render/TableLoadingLine.vue.d.ts} +0 -0
  200. /package/dist/components/Table/{hooks → state}/usePagination.d.ts +0 -0
  201. /package/dist/components/Table/{hooks → state}/useServerOptions.d.ts +0 -0
@@ -35,9 +35,9 @@
35
35
  --m-color-contrast-active: #020617;
36
36
  --m-color-on-emphasis: #ffffff;
37
37
  --m-overlay-scrim: rgb(15 23 42 / 0.55);
38
- --m-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.25);
39
- --m-shadow-md: 0 0.75rem 2rem rgb(15 23 42 / 0.16);
40
- --m-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
38
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
39
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
40
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
41
41
  --m-shadow-raised: 0 0.25rem 0.75rem
42
42
  color-mix(in srgb, var(--m-color-text) 14%, transparent);
43
43
  --m-shadow-sticky: 4px 0 8px
@@ -132,7 +132,7 @@
132
132
  --m-slider-marks-side: 0.5rem;
133
133
  --m-stepper-connector-color: var(--m-color-border);
134
134
 
135
- /* Table (Element Plus–aligned) */
135
+ /* Table */
136
136
  --m-color-fill-light: color-mix(in srgb, var(--m-color-text) 6%, var(--m-color-surface));
137
137
  --m-color-fill-lighter: color-mix(in srgb, var(--m-color-text) 3.5%, var(--m-color-surface));
138
138
  --m-table-border-color: var(--m-color-border);
@@ -335,9 +335,9 @@
335
335
  --m-color-contrast-hover: #e2e8f0;
336
336
  --m-color-contrast-active: #cbd5e1;
337
337
  --m-overlay-scrim: rgb(2 6 23 / 0.72);
338
- --m-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
339
- --m-shadow-md: 0 0.75rem 2rem rgb(0 0 0 / 0.45);
340
- --m-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
338
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
339
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
340
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
341
341
  --m-shadow-raised: 0 0.25rem 0.75rem
342
342
  color-mix(in srgb, var(--m-color-text) 22%, transparent);
343
343
  --m-shadow-sticky: 4px 0 8px
@@ -426,7 +426,6 @@
426
426
  .m-orderlist,
427
427
  .m-picklist,
428
428
  .m-virtualscroller,
429
- .m-treetable,
430
429
  .m-megamenu,
431
430
  .m-dock,
432
431
  .m-sidebar,
@@ -938,7 +937,6 @@
938
937
  overflow-x: hidden;
939
938
  }
940
939
 
941
- .m-treetable__scrollbar > .m-scrollbar__wrap,
942
940
  .m-terminal__scrollbar > .m-scrollbar__wrap {
943
941
  height: 100%;
944
942
  overflow-x: hidden;
@@ -1148,83 +1146,6 @@
1148
1146
  animation: none !important;
1149
1147
  }
1150
1148
 
1151
- .m-checkbox__control {
1152
- border-radius: var(--m-radius-sm);
1153
- }
1154
-
1155
- .m-checkbox__control svg {
1156
- fill: none;
1157
- height: 0.875rem;
1158
- stroke: var(--m-color-on-emphasis);
1159
- stroke-linecap: round;
1160
- stroke-linejoin: round;
1161
- stroke-width: 2;
1162
- width: 0.875rem;
1163
- }
1164
-
1165
- .m-checkbox__input:indeterminate + .m-checkbox__control {
1166
- background: var(--m-color-primary);
1167
- border-color: var(--m-color-primary);
1168
- }
1169
-
1170
- .m-checkbox__input:focus-visible + .m-checkbox__control {
1171
- border-color: var(--m-color-primary-hover);
1172
- }
1173
-
1174
- .m-checkbox--invalid .m-checkbox__input:focus-visible + .m-checkbox__control {
1175
- border-color: var(--m-color-danger);
1176
- box-shadow: var(--m-focus-shadow-danger);
1177
- }
1178
-
1179
- .m-icon {
1180
- color: currentColor;
1181
- display: inline-flex;
1182
- flex-shrink: 0;
1183
- height: 1rem;
1184
- line-height: 0;
1185
- vertical-align: middle;
1186
- width: 1rem;
1187
- }
1188
-
1189
- .m-icon svg {
1190
- display: block;
1191
- height: 100%;
1192
- width: 100%;
1193
- }
1194
-
1195
- .m-icon--sm,
1196
- .m-icon--small {
1197
- height: 0.875rem;
1198
- width: 0.875rem;
1199
- }
1200
-
1201
- .m-icon--md,
1202
- .m-icon--normal {
1203
- height: 1rem;
1204
- width: 1rem;
1205
- }
1206
-
1207
- .m-icon--lg,
1208
- .m-icon--large {
1209
- height: 1.25rem;
1210
- width: 1.25rem;
1211
- }
1212
-
1213
- .m-icon--spin svg {
1214
- animation: m-icon-spin var(--m-motion-spin-fast) linear infinite;
1215
- }
1216
-
1217
- @keyframes m-icon-spin {
1218
- to {
1219
- transform: rotate(360deg);
1220
- }
1221
- }
1222
-
1223
- :root[data-m-motion='none'] .m-icon--spin svg,
1224
- :root[data-m-motion='reduced'] .m-icon--spin svg {
1225
- animation: none;
1226
- }
1227
-
1228
1149
  /* —— Feedback: Loading —— */
1229
1150
 
1230
1151
  .m-loading {
@@ -1710,27 +1631,6 @@
1710
1631
  width: var(--m-pagination-jumper-width);
1711
1632
  }
1712
1633
 
1713
- .m-radio__control {
1714
- border-radius: var(--m-radius-full);
1715
- }
1716
-
1717
- .m-radio__input:checked + .m-radio__control::after {
1718
- background: var(--m-color-on-emphasis);
1719
- border-radius: var(--m-radius-full);
1720
- content: "";
1721
- height: 0.375rem;
1722
- width: 0.375rem;
1723
- }
1724
-
1725
- .m-radio__input:focus-visible + .m-radio__control {
1726
- border-color: var(--m-color-primary-hover);
1727
- }
1728
-
1729
- .m-radio--invalid .m-radio__input:focus-visible + .m-radio__control {
1730
- border-color: var(--m-color-danger);
1731
- box-shadow: var(--m-focus-shadow-danger);
1732
- }
1733
-
1734
1634
  .m-scrollbar {
1735
1635
  --m-scrollbar-track-size: 6px;
1736
1636
  --m-scrollbar-inset: 0.125rem;
@@ -1863,59 +1763,6 @@
1863
1763
  transition: none;
1864
1764
  }
1865
1765
 
1866
- /* —— Feedback: Tooltip —— */
1867
- .m-tooltip {
1868
- display: inline-flex;
1869
- position: relative;
1870
- }
1871
-
1872
- .m-tooltip__content {
1873
- background: var(--m-color-text);
1874
- border-radius: var(--m-radius-sm);
1875
- color: var(--m-color-surface);
1876
- font-family: var(--m-font-sans);
1877
- font-size: var(--m-font-size-xs);
1878
- left: 50%;
1879
- line-height: 1.35;
1880
- padding: var(--m-space-2) var(--m-space-3);
1881
- pointer-events: none;
1882
- position: absolute;
1883
- transform: translateX(-50%);
1884
- white-space: nowrap;
1885
- z-index: var(--m-z-popper);
1886
- }
1887
-
1888
- .m-tooltip__content--top {
1889
- bottom: calc(100% + var(--m-space-2));
1890
- }
1891
-
1892
- .m-tooltip__content--bottom {
1893
- top: calc(100% + var(--m-space-2));
1894
- }
1895
-
1896
- .m-tooltip__content--left {
1897
- left: auto;
1898
- right: calc(100% + var(--m-space-2));
1899
- top: 50%;
1900
- transform: translateY(-50%);
1901
- }
1902
-
1903
- .m-tooltip__content--right {
1904
- left: calc(100% + var(--m-space-2));
1905
- top: 50%;
1906
- transform: translateY(-50%);
1907
- }
1908
-
1909
- .m-tooltip__content--teleported {
1910
- bottom: auto;
1911
- left: auto;
1912
- position: fixed;
1913
- right: auto;
1914
- top: auto;
1915
- white-space: normal;
1916
- z-index: var(--m-z-tooltip);
1917
- }
1918
-
1919
1766
  /**
1920
1767
  * MTable — Morya UI design tokens and table interaction patterns.
1921
1768
  */
@@ -2102,8 +1949,7 @@
2102
1949
 
2103
1950
  .m-table__header-cell--sortable:focus-visible {
2104
1951
  outline: none;
2105
- box-shadow: inset 0 0 0 var(--m-border-width)
2106
- color-mix(in srgb, var(--m-color-primary) 45%, transparent);
1952
+ box-shadow: var(--m-focus-shadow);
2107
1953
  }
2108
1954
 
2109
1955
  .m-table__header-inner {
@@ -2150,14 +1996,17 @@
2150
1996
 
2151
1997
  .m-table__sort-icon.m-icon {
2152
1998
  display: block;
2153
- width: 0.75rem;
2154
- height: 0.375rem;
1999
+ /* width: 0.75rem;
2000
+ height: 0.375rem; */
2155
2001
  color: color-mix(in srgb, var(--m-color-text-muted) 55%, transparent);
2156
2002
  }
2157
2003
 
2158
- .m-table__sort-icon--ascending,
2004
+ .m-table__sort-icon--ascending {
2005
+ margin-bottom: -0.375rem;
2006
+ }
2007
+
2159
2008
  .m-table__sort-icon--descending {
2160
- margin: 0;
2009
+ margin-top: -0.375rem;
2161
2010
  }
2162
2011
 
2163
2012
  .m-table__header-cell--sortable:hover .m-table__sort-icon {
@@ -2427,6 +2276,180 @@
2427
2276
  max-width: 100%;
2428
2277
  }
2429
2278
 
2279
+ .m-table__resize-handle {
2280
+ position: absolute;
2281
+ top: 0;
2282
+ right: 0;
2283
+ z-index: 4;
2284
+ width: 6px;
2285
+ height: 100%;
2286
+ cursor: col-resize;
2287
+ user-select: none;
2288
+ }
2289
+
2290
+ .m-table__resize-handle:hover,
2291
+ .m-table__resize-handle:active {
2292
+ background: color-mix(in srgb, var(--m-color-primary) 35%, transparent);
2293
+ }
2294
+
2295
+ .m-table__filter-btn {
2296
+ display: inline-flex;
2297
+ flex-shrink: 0;
2298
+ align-items: center;
2299
+ justify-content: center;
2300
+ width: var(--m-space-5);
2301
+ height: var(--m-space-5);
2302
+ margin: 0;
2303
+ padding: 0;
2304
+ border: 0;
2305
+ border-radius: var(--m-radius-control);
2306
+ color: color-mix(in srgb, var(--m-color-text-muted) 70%, transparent);
2307
+ background: transparent;
2308
+ cursor: pointer;
2309
+ }
2310
+
2311
+ .m-table__filter-btn:hover,
2312
+ .m-table__filter-btn--active {
2313
+ color: var(--m-color-primary);
2314
+ background: color-mix(in srgb, var(--m-color-primary) 8%, transparent);
2315
+ }
2316
+
2317
+ .m-table__filter-btn:focus-visible {
2318
+ outline: none;
2319
+ box-shadow: var(--m-focus-shadow);
2320
+ }
2321
+
2322
+ .m-table__filter-btn .m-icon {
2323
+ width: var(--m-font-size-sm);
2324
+ height: var(--m-font-size-sm);
2325
+ }
2326
+
2327
+ .m-table__filter-panel {
2328
+ display: flex;
2329
+ flex-direction: column;
2330
+ gap: var(--m-space-2);
2331
+ min-width: 10rem;
2332
+ padding: var(--m-space-2);
2333
+ }
2334
+
2335
+ .m-table__filter-options {
2336
+ display: flex;
2337
+ flex-direction: column;
2338
+ gap: var(--m-space-1);
2339
+ max-height: 12rem;
2340
+ overflow: auto;
2341
+ }
2342
+
2343
+ .m-table__filter-option {
2344
+ display: flex;
2345
+ align-items: center;
2346
+ gap: var(--m-space-2);
2347
+ margin: 0;
2348
+ font-size: var(--m-font-size-sm);
2349
+ cursor: pointer;
2350
+ }
2351
+
2352
+ .m-table__filter-actions {
2353
+ display: flex;
2354
+ justify-content: flex-end;
2355
+ gap: var(--m-space-1);
2356
+ }
2357
+
2358
+ .m-table__virtual-spacer td {
2359
+ line-height: 0;
2360
+ background: transparent !important;
2361
+ }
2362
+
2363
+ .m-table__tfoot td {
2364
+ box-sizing: border-box;
2365
+ padding: var(--m-table-cell-padding-block) 0;
2366
+ border: 0;
2367
+ border-top: var(--m-border-width) solid var(--m-table-border-color);
2368
+ color: var(--m-table-header-text);
2369
+ font-size: var(--m-table-font-size);
2370
+ font-weight: 600;
2371
+ background: var(--m-table-header-bg);
2372
+ vertical-align: middle;
2373
+ }
2374
+
2375
+ .m-table--border .m-table__tfoot td,
2376
+ .m-table__main--border-cell .m-table__tfoot td {
2377
+ border-right: var(--m-border-width) solid var(--m-table-border-color);
2378
+ }
2379
+
2380
+ .m-table--border .m-table__tfoot td:last-child,
2381
+ .m-table__main--border-cell .m-table__tfoot td:last-child {
2382
+ border-right: 0;
2383
+ }
2384
+
2385
+ /* —— Tree mode —— */
2386
+ .m-table__tree-cell {
2387
+ align-items: center;
2388
+ display: flex;
2389
+ gap: var(--m-space-1);
2390
+ min-width: 0;
2391
+ }
2392
+
2393
+ .m-table__tree-toggler,
2394
+ .m-table__tree-toggler-spacer {
2395
+ background: transparent;
2396
+ border: 0;
2397
+ border-radius: var(--m-radius-sm);
2398
+ color: var(--m-color-text-muted);
2399
+ flex: 0 0 var(--m-tree-toggler-size, 1.25rem);
2400
+ font: inherit;
2401
+ height: var(--m-tree-toggler-size, 1.25rem);
2402
+ padding: 0;
2403
+ width: var(--m-tree-toggler-size, 1.25rem);
2404
+ }
2405
+
2406
+ .m-table__tree-toggler {
2407
+ align-items: center;
2408
+ cursor: pointer;
2409
+ display: inline-flex;
2410
+ justify-content: center;
2411
+ transition: color var(--m-motion-fast) var(--m-motion-ease),
2412
+ background-color var(--m-motion-fast) var(--m-motion-ease);
2413
+ }
2414
+
2415
+ .m-table__tree-toggler:hover:not(:disabled) {
2416
+ color: var(--m-color-primary);
2417
+ background: color-mix(in srgb, var(--m-color-primary) 8%, transparent);
2418
+ }
2419
+
2420
+ .m-table__tree-toggler:focus-visible {
2421
+ box-shadow: var(--m-focus-shadow);
2422
+ outline: none;
2423
+ }
2424
+
2425
+ .m-table__tree-toggler:disabled {
2426
+ cursor: progress;
2427
+ opacity: 0.7;
2428
+ }
2429
+
2430
+ .m-table__tree-toggler-spacer {
2431
+ pointer-events: none;
2432
+ }
2433
+
2434
+ .m-table--tree-line .m-table__tree-cell {
2435
+ position: relative;
2436
+ }
2437
+
2438
+ .m-table--tree-line .m-table__tree-cell::before {
2439
+ border-left: var(--m-border-width) solid var(--m-color-border);
2440
+ bottom: 0;
2441
+ content: '';
2442
+ left: calc(var(--m-space-1) + 0.35rem);
2443
+ position: absolute;
2444
+ top: 0;
2445
+ }
2446
+
2447
+ .m-table__main--fixed-header .m-table__tfoot td {
2448
+ position: sticky;
2449
+ bottom: 0;
2450
+ z-index: 2;
2451
+ }
2452
+
2430
2453
  [data-m-motion="reduced"] .m-table__header th,
2431
2454
  [data-m-motion="reduced"] .m-table__body td,
2432
2455
  [data-m-motion="reduced"] .m-table__expand-btn,
@@ -1,10 +1,6 @@
1
1
  import '../theme/styles.css'
2
2
  import '../styles/base.css'
3
- import '../components/Checkbox/styles.css'
4
- import '../components/Icon/styles.css'
5
3
  import '../components/Loading/styles.css'
6
4
  import '../components/Pagination/styles.css'
7
- import '../components/Radio/styles.css'
8
5
  import '../components/Scrollbar/styles.css'
9
- import '../components/Tooltip/styles.css'
10
6
  import '../components/Table/styles.css'
@@ -35,9 +35,9 @@
35
35
  --m-color-contrast-active: #020617;
36
36
  --m-color-on-emphasis: #ffffff;
37
37
  --m-overlay-scrim: rgb(15 23 42 / 0.55);
38
- --m-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.25);
39
- --m-shadow-md: 0 0.75rem 2rem rgb(15 23 42 / 0.16);
40
- --m-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
38
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
39
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
40
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
41
41
  --m-shadow-raised: 0 0.25rem 0.75rem
42
42
  color-mix(in srgb, var(--m-color-text) 14%, transparent);
43
43
  --m-shadow-sticky: 4px 0 8px
@@ -132,7 +132,7 @@
132
132
  --m-slider-marks-side: 0.5rem;
133
133
  --m-stepper-connector-color: var(--m-color-border);
134
134
 
135
- /* Table (Element Plus–aligned) */
135
+ /* Table */
136
136
  --m-color-fill-light: color-mix(in srgb, var(--m-color-text) 6%, var(--m-color-surface));
137
137
  --m-color-fill-lighter: color-mix(in srgb, var(--m-color-text) 3.5%, var(--m-color-surface));
138
138
  --m-table-border-color: var(--m-color-border);
@@ -335,9 +335,9 @@
335
335
  --m-color-contrast-hover: #e2e8f0;
336
336
  --m-color-contrast-active: #cbd5e1;
337
337
  --m-overlay-scrim: rgb(2 6 23 / 0.72);
338
- --m-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
339
- --m-shadow-md: 0 0.75rem 2rem rgb(0 0 0 / 0.45);
340
- --m-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
338
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
339
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
340
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
341
341
  --m-shadow-raised: 0 0.25rem 0.75rem
342
342
  color-mix(in srgb, var(--m-color-text) 22%, transparent);
343
343
  --m-shadow-sticky: 4px 0 8px
@@ -426,7 +426,6 @@
426
426
  .m-orderlist,
427
427
  .m-picklist,
428
428
  .m-virtualscroller,
429
- .m-treetable,
430
429
  .m-megamenu,
431
430
  .m-dock,
432
431
  .m-sidebar,
@@ -938,7 +937,6 @@
938
937
  overflow-x: hidden;
939
938
  }
940
939
 
941
- .m-treetable__scrollbar > .m-scrollbar__wrap,
942
940
  .m-terminal__scrollbar > .m-scrollbar__wrap {
943
941
  height: 100%;
944
942
  overflow-x: hidden;
@@ -35,9 +35,9 @@
35
35
  --m-color-contrast-active: #020617;
36
36
  --m-color-on-emphasis: #ffffff;
37
37
  --m-overlay-scrim: rgb(15 23 42 / 0.55);
38
- --m-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.25);
39
- --m-shadow-md: 0 0.75rem 2rem rgb(15 23 42 / 0.16);
40
- --m-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
38
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
39
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
40
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
41
41
  --m-shadow-raised: 0 0.25rem 0.75rem
42
42
  color-mix(in srgb, var(--m-color-text) 14%, transparent);
43
43
  --m-shadow-sticky: 4px 0 8px
@@ -132,7 +132,7 @@
132
132
  --m-slider-marks-side: 0.5rem;
133
133
  --m-stepper-connector-color: var(--m-color-border);
134
134
 
135
- /* Table (Element Plus–aligned) */
135
+ /* Table */
136
136
  --m-color-fill-light: color-mix(in srgb, var(--m-color-text) 6%, var(--m-color-surface));
137
137
  --m-color-fill-lighter: color-mix(in srgb, var(--m-color-text) 3.5%, var(--m-color-surface));
138
138
  --m-table-border-color: var(--m-color-border);
@@ -335,9 +335,9 @@
335
335
  --m-color-contrast-hover: #e2e8f0;
336
336
  --m-color-contrast-active: #cbd5e1;
337
337
  --m-overlay-scrim: rgb(2 6 23 / 0.72);
338
- --m-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
339
- --m-shadow-md: 0 0.75rem 2rem rgb(0 0 0 / 0.45);
340
- --m-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
338
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
339
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
340
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
341
341
  --m-shadow-raised: 0 0.25rem 0.75rem
342
342
  color-mix(in srgb, var(--m-color-text) 22%, transparent);
343
343
  --m-shadow-sticky: 4px 0 8px
@@ -426,7 +426,6 @@
426
426
  .m-orderlist,
427
427
  .m-picklist,
428
428
  .m-virtualscroller,
429
- .m-treetable,
430
429
  .m-megamenu,
431
430
  .m-dock,
432
431
  .m-sidebar,
@@ -938,7 +937,6 @@
938
937
  overflow-x: hidden;
939
938
  }
940
939
 
941
- .m-treetable__scrollbar > .m-scrollbar__wrap,
942
940
  .m-terminal__scrollbar > .m-scrollbar__wrap {
943
941
  height: 100%;
944
942
  overflow-x: hidden;
@@ -35,9 +35,9 @@
35
35
  --m-color-contrast-active: #020617;
36
36
  --m-color-on-emphasis: #ffffff;
37
37
  --m-overlay-scrim: rgb(15 23 42 / 0.55);
38
- --m-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.25);
39
- --m-shadow-md: 0 0.75rem 2rem rgb(15 23 42 / 0.16);
40
- --m-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
38
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
39
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
40
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
41
41
  --m-shadow-raised: 0 0.25rem 0.75rem
42
42
  color-mix(in srgb, var(--m-color-text) 14%, transparent);
43
43
  --m-shadow-sticky: 4px 0 8px
@@ -132,7 +132,7 @@
132
132
  --m-slider-marks-side: 0.5rem;
133
133
  --m-stepper-connector-color: var(--m-color-border);
134
134
 
135
- /* Table (Element Plus–aligned) */
135
+ /* Table */
136
136
  --m-color-fill-light: color-mix(in srgb, var(--m-color-text) 6%, var(--m-color-surface));
137
137
  --m-color-fill-lighter: color-mix(in srgb, var(--m-color-text) 3.5%, var(--m-color-surface));
138
138
  --m-table-border-color: var(--m-color-border);
@@ -335,9 +335,9 @@
335
335
  --m-color-contrast-hover: #e2e8f0;
336
336
  --m-color-contrast-active: #cbd5e1;
337
337
  --m-overlay-scrim: rgb(2 6 23 / 0.72);
338
- --m-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
339
- --m-shadow-md: 0 0.75rem 2rem rgb(0 0 0 / 0.45);
340
- --m-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
338
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
339
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
340
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
341
341
  --m-shadow-raised: 0 0.25rem 0.75rem
342
342
  color-mix(in srgb, var(--m-color-text) 22%, transparent);
343
343
  --m-shadow-sticky: 4px 0 8px
@@ -426,7 +426,6 @@
426
426
  .m-orderlist,
427
427
  .m-picklist,
428
428
  .m-virtualscroller,
429
- .m-treetable,
430
429
  .m-megamenu,
431
430
  .m-dock,
432
431
  .m-sidebar,
@@ -938,7 +937,6 @@
938
937
  overflow-x: hidden;
939
938
  }
940
939
 
941
- .m-treetable__scrollbar > .m-scrollbar__wrap,
942
940
  .m-terminal__scrollbar > .m-scrollbar__wrap {
943
941
  height: 100%;
944
942
  overflow-x: hidden;
@@ -35,9 +35,9 @@
35
35
  --m-color-contrast-active: #020617;
36
36
  --m-color-on-emphasis: #ffffff;
37
37
  --m-overlay-scrim: rgb(15 23 42 / 0.55);
38
- --m-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.25);
39
- --m-shadow-md: 0 0.75rem 2rem rgb(15 23 42 / 0.16);
40
- --m-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
38
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
39
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
40
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
41
41
  --m-shadow-raised: 0 0.25rem 0.75rem
42
42
  color-mix(in srgb, var(--m-color-text) 14%, transparent);
43
43
  --m-shadow-sticky: 4px 0 8px
@@ -132,7 +132,7 @@
132
132
  --m-slider-marks-side: 0.5rem;
133
133
  --m-stepper-connector-color: var(--m-color-border);
134
134
 
135
- /* Table (Element Plus–aligned) */
135
+ /* Table */
136
136
  --m-color-fill-light: color-mix(in srgb, var(--m-color-text) 6%, var(--m-color-surface));
137
137
  --m-color-fill-lighter: color-mix(in srgb, var(--m-color-text) 3.5%, var(--m-color-surface));
138
138
  --m-table-border-color: var(--m-color-border);
@@ -335,9 +335,9 @@
335
335
  --m-color-contrast-hover: #e2e8f0;
336
336
  --m-color-contrast-active: #cbd5e1;
337
337
  --m-overlay-scrim: rgb(2 6 23 / 0.72);
338
- --m-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
339
- --m-shadow-md: 0 0.75rem 2rem rgb(0 0 0 / 0.45);
340
- --m-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
338
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
339
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
340
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
341
341
  --m-shadow-raised: 0 0.25rem 0.75rem
342
342
  color-mix(in srgb, var(--m-color-text) 22%, transparent);
343
343
  --m-shadow-sticky: 4px 0 8px
@@ -426,7 +426,6 @@
426
426
  .m-orderlist,
427
427
  .m-picklist,
428
428
  .m-virtualscroller,
429
- .m-treetable,
430
429
  .m-megamenu,
431
430
  .m-dock,
432
431
  .m-sidebar,
@@ -938,7 +937,6 @@
938
937
  overflow-x: hidden;
939
938
  }
940
939
 
941
- .m-treetable__scrollbar > .m-scrollbar__wrap,
942
940
  .m-terminal__scrollbar > .m-scrollbar__wrap {
943
941
  height: 100%;
944
942
  overflow-x: hidden;
@@ -35,9 +35,9 @@
35
35
  --m-color-contrast-active: #020617;
36
36
  --m-color-on-emphasis: #ffffff;
37
37
  --m-overlay-scrim: rgb(15 23 42 / 0.55);
38
- --m-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.25);
39
- --m-shadow-md: 0 0.75rem 2rem rgb(15 23 42 / 0.16);
40
- --m-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
38
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
39
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
40
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
41
41
  --m-shadow-raised: 0 0.25rem 0.75rem
42
42
  color-mix(in srgb, var(--m-color-text) 14%, transparent);
43
43
  --m-shadow-sticky: 4px 0 8px
@@ -132,7 +132,7 @@
132
132
  --m-slider-marks-side: 0.5rem;
133
133
  --m-stepper-connector-color: var(--m-color-border);
134
134
 
135
- /* Table (Element Plus–aligned) */
135
+ /* Table */
136
136
  --m-color-fill-light: color-mix(in srgb, var(--m-color-text) 6%, var(--m-color-surface));
137
137
  --m-color-fill-lighter: color-mix(in srgb, var(--m-color-text) 3.5%, var(--m-color-surface));
138
138
  --m-table-border-color: var(--m-color-border);
@@ -335,9 +335,9 @@
335
335
  --m-color-contrast-hover: #e2e8f0;
336
336
  --m-color-contrast-active: #cbd5e1;
337
337
  --m-overlay-scrim: rgb(2 6 23 / 0.72);
338
- --m-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.45);
339
- --m-shadow-md: 0 0.75rem 2rem rgb(0 0 0 / 0.45);
340
- --m-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
338
+ --m-shadow-sm: 0 0 6px rgba(0, 0, 0, 0.12);
339
+ --m-shadow-md: 0 0 12px rgba(0, 0, 0, 0.12);
340
+ --m-shadow-lg: 0 12px 32px 4px rgba(0, 0, 0, 0.04), 0 8px 20px rgba(0, 0, 0, 0.08);
341
341
  --m-shadow-raised: 0 0.25rem 0.75rem
342
342
  color-mix(in srgb, var(--m-color-text) 22%, transparent);
343
343
  --m-shadow-sticky: 4px 0 8px