morya-ui 0.3.1 → 0.3.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 (228) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/dist/Button-dMqRmoYa.js +222 -0
  3. package/dist/{Card-Dsmnzong.js → Card-B1CB9Trm.js} +3 -5
  4. package/dist/Empty-C5tndBOm.js +147 -0
  5. package/dist/Pagination-CqpC5EAs.js +166 -0
  6. package/dist/Select-CKGrSoaC.js +572 -0
  7. package/dist/Skeleton-DCYdXAH2.js +59 -0
  8. package/dist/accordion/style.css +16 -71
  9. package/dist/auto-complete/index.js +117 -119
  10. package/dist/auto-complete/style.css +6 -82
  11. package/dist/avatar/style.css +6 -67
  12. package/dist/badge/style.css +6 -68
  13. package/dist/block-ui/style.css +6 -68
  14. package/dist/breadcrumb/style.css +6 -61
  15. package/dist/button/index.js +1 -1
  16. package/dist/button/style.css +68 -78
  17. package/dist/card/index.js +1 -1
  18. package/dist/card/style.css +26 -67
  19. package/dist/carousel/style.css +6 -73
  20. package/dist/cascade-select/style.css +6 -75
  21. package/dist/checkbox/style.css +6 -61
  22. package/dist/chip/style.css +6 -67
  23. package/dist/command-menu/index.js +36 -38
  24. package/dist/command-menu/style.css +6 -75
  25. package/dist/components/Accordion/styles.css +10 -10
  26. package/dist/components/AutoComplete/AutoComplete.vue.d.ts.map +1 -1
  27. package/dist/components/AutoComplete/styles.css +0 -7
  28. package/dist/components/Badge/styles.css +0 -7
  29. package/dist/components/BlockUI/styles.css +0 -7
  30. package/dist/components/Button/Button.vue.d.ts +2 -0
  31. package/dist/components/Button/Button.vue.d.ts.map +1 -1
  32. package/dist/components/Button/styles.css +62 -11
  33. package/dist/components/Button/types.d.ts +4 -0
  34. package/dist/components/Button/types.d.ts.map +1 -1
  35. package/dist/components/Card/Card.vue.d.ts +2 -2
  36. package/dist/components/Card/Card.vue.d.ts.map +1 -1
  37. package/dist/components/Card/index.d.ts +1 -1
  38. package/dist/components/Card/index.d.ts.map +1 -1
  39. package/dist/components/Card/styles.css +20 -6
  40. package/dist/components/Card/types.d.ts +4 -2
  41. package/dist/components/Card/types.d.ts.map +1 -1
  42. package/dist/components/Carousel/styles.css +0 -6
  43. package/dist/components/CommandMenu/CommandMenu.vue.d.ts.map +1 -1
  44. package/dist/components/ConfigProvider/ConfigProvider.vue.d.ts +2 -2
  45. package/dist/components/Dialog/styles.css +3 -46
  46. package/dist/components/Dock/styles.css +0 -10
  47. package/dist/components/Drawer/styles.css +2 -51
  48. package/dist/components/Fieldset/styles.css +0 -7
  49. package/dist/components/FileUpload/FileUpload.vue.d.ts.map +1 -1
  50. package/dist/components/FileUpload/fileUtils.d.ts +8 -0
  51. package/dist/components/FileUpload/fileUtils.d.ts.map +1 -0
  52. package/dist/components/Gallery/styles.css +0 -8
  53. package/dist/components/Icon/styles.css +0 -6
  54. package/dist/components/Knob/styles.css +0 -6
  55. package/dist/components/Layout/styles.css +0 -12
  56. package/dist/components/Listbox/Listbox.vue.d.ts.map +1 -1
  57. package/dist/components/Loading/styles.css +0 -16
  58. package/dist/components/Menu/Menu.vue.d.ts.map +1 -1
  59. package/dist/components/Menu/styles.css +0 -7
  60. package/dist/components/Message/styles.css +0 -13
  61. package/dist/components/Page/PageContent.vue.d.ts +2 -1
  62. package/dist/components/Page/PageContent.vue.d.ts.map +1 -1
  63. package/dist/components/Page/PageFilterChips.vue.d.ts +16 -0
  64. package/dist/components/Page/PageFilterChips.vue.d.ts.map +1 -0
  65. package/dist/components/Page/PageFilters.vue.d.ts +15 -3
  66. package/dist/components/Page/PageFilters.vue.d.ts.map +1 -1
  67. package/dist/components/Page/PageHeader.vue.d.ts +8 -4
  68. package/dist/components/Page/PageHeader.vue.d.ts.map +1 -1
  69. package/dist/components/Page/PagePlaceholder.vue.d.ts +6 -2
  70. package/dist/components/Page/PagePlaceholder.vue.d.ts.map +1 -1
  71. package/dist/components/Page/PageSection.vue.d.ts +8 -2
  72. package/dist/components/Page/PageSection.vue.d.ts.map +1 -1
  73. package/dist/components/Page/PageStat.vue.d.ts +8 -3
  74. package/dist/components/Page/PageStat.vue.d.ts.map +1 -1
  75. package/dist/components/Page/index.d.ts +2 -1
  76. package/dist/components/Page/index.d.ts.map +1 -1
  77. package/dist/components/Page/styles.css +239 -44
  78. package/dist/components/Page/types.d.ts +40 -0
  79. package/dist/components/Page/types.d.ts.map +1 -1
  80. package/dist/components/Pagination/Pagination.vue.d.ts.map +1 -1
  81. package/dist/components/Pagination/styles.css +7 -10
  82. package/dist/components/Pagination/types.d.ts +1 -1
  83. package/dist/components/Pagination/types.d.ts.map +1 -1
  84. package/dist/components/Panel/styles.css +0 -7
  85. package/dist/components/Popover/styles.css +20 -17
  86. package/dist/components/ProgressBar/styles.css +0 -9
  87. package/dist/components/ProgressSpinner/styles.css +0 -7
  88. package/dist/components/ScrollTop/styles.css +0 -7
  89. package/dist/components/Scrollbar/styles.css +0 -8
  90. package/dist/components/Select/Select.vue.d.ts +1 -3
  91. package/dist/components/Select/Select.vue.d.ts.map +1 -1
  92. package/dist/components/Select/selectOptions.d.ts +46 -0
  93. package/dist/components/Select/selectOptions.d.ts.map +1 -0
  94. package/dist/components/Select/styles.css +5 -7
  95. package/dist/components/Sidebar/styles.css +0 -6
  96. package/dist/components/Skeleton/styles.css +0 -6
  97. package/dist/components/Status/styles.css +0 -7
  98. package/dist/components/Switch/styles.css +0 -7
  99. package/dist/components/Table/hooks/useExpandableRow.d.ts.map +1 -1
  100. package/dist/components/Table/hooks/useTotalItems.d.ts.map +1 -1
  101. package/dist/components/Table/styles.css +7 -10
  102. package/dist/components/Table/tableQuery.d.ts +30 -0
  103. package/dist/components/Table/tableQuery.d.ts.map +1 -0
  104. package/dist/components/Tree/Tree.vue.d.ts.map +1 -1
  105. package/dist/components/Tree/treeQuery.d.ts +31 -0
  106. package/dist/components/Tree/treeQuery.d.ts.map +1 -0
  107. package/dist/components/TreeSelect/TreeSelect.vue.d.ts.map +1 -1
  108. package/dist/config-provider/index.js +1 -1
  109. package/dist/config-provider/style.css +68 -72
  110. package/dist/confirm-dialog/index.js +1 -1
  111. package/dist/confirm-dialog/style.css +71 -124
  112. package/dist/confirm-popup/index.js +1 -1
  113. package/dist/confirm-popup/style.css +68 -78
  114. package/dist/context-menu/style.css +6 -75
  115. package/dist/data-view/index.js +1 -1
  116. package/dist/data-view/style.css +13 -87
  117. package/dist/date-picker/style.css +6 -67
  118. package/dist/dialog/index.js +1 -1
  119. package/dist/dialog/style.css +71 -124
  120. package/dist/divider/style.css +6 -61
  121. package/dist/dock/style.css +6 -77
  122. package/dist/drawer/style.css +8 -118
  123. package/dist/dropdown/style.css +6 -75
  124. package/dist/empty/index.js +5 -150
  125. package/dist/empty/style.css +6 -67
  126. package/dist/fieldset/style.css +6 -74
  127. package/dist/file-upload/index.js +147 -145
  128. package/dist/file-upload/style.css +6 -67
  129. package/dist/filterByQuery-Bczaxzih.js +17 -0
  130. package/dist/flex/style.css +6 -61
  131. package/dist/float-label/style.css +6 -61
  132. package/dist/fluid/style.css +6 -61
  133. package/dist/form/style.css +6 -61
  134. package/dist/gallery/style.css +6 -83
  135. package/dist/grid/style.css +6 -61
  136. package/dist/icon/style.css +6 -67
  137. package/dist/icon-field/style.css +6 -61
  138. package/dist/index.d.ts +3 -2
  139. package/dist/index.d.ts.map +1 -1
  140. package/dist/index.js +9017 -8694
  141. package/dist/inplace/style.css +6 -61
  142. package/dist/input/style.css +6 -67
  143. package/dist/input-color/style.css +6 -61
  144. package/dist/input-group/style.css +6 -61
  145. package/dist/input-number/style.css +6 -67
  146. package/dist/input-otp/style.css +6 -61
  147. package/dist/input-password/style.css +6 -67
  148. package/dist/input-tags/style.css +6 -67
  149. package/dist/knob/style.css +6 -67
  150. package/dist/label/style.css +6 -61
  151. package/dist/layout/style.css +6 -87
  152. package/dist/listbox/index.js +30 -32
  153. package/dist/listbox/style.css +6 -69
  154. package/dist/loading/style.css +6 -77
  155. package/dist/mega-menu/style.css +6 -67
  156. package/dist/menu/index.js +263 -253
  157. package/dist/menu/style.css +26 -99
  158. package/dist/menubar/style.css +6 -75
  159. package/dist/message/style.css +6 -80
  160. package/dist/meter-group/style.css +6 -61
  161. package/dist/order-list/style.css +6 -67
  162. package/dist/page/index.js +228 -69
  163. package/dist/page/style.css +1182 -113
  164. package/dist/page/style.js +3 -0
  165. package/dist/pagination/index.js +1 -1
  166. package/dist/pagination/style.css +206 -77
  167. package/dist/pagination/style.js +1 -0
  168. package/dist/panel/style.css +6 -74
  169. package/dist/pick-list/style.css +6 -67
  170. package/dist/popover/style.css +26 -78
  171. package/dist/progress-bar/style.css +6 -70
  172. package/dist/progress-spinner/style.css +6 -68
  173. package/dist/radio/style.css +6 -61
  174. package/dist/rating/style.css +6 -67
  175. package/dist/resolver-map.d.ts.map +1 -1
  176. package/dist/resolver.js +1 -0
  177. package/dist/result/style.css +6 -67
  178. package/dist/scroll-top/style.css +6 -82
  179. package/dist/scrollbar/style.css +6 -69
  180. package/dist/select/index.js +2 -545
  181. package/dist/select/style.css +11 -82
  182. package/dist/select-button/style.css +6 -61
  183. package/dist/shared/config.d.ts +2 -2
  184. package/dist/shared/filterByQuery.d.ts +14 -0
  185. package/dist/shared/filterByQuery.d.ts.map +1 -0
  186. package/dist/shared/menu/expand.d.ts +38 -0
  187. package/dist/shared/menu/expand.d.ts.map +1 -0
  188. package/dist/shared/menu/index.d.ts +2 -0
  189. package/dist/shared/menu/index.d.ts.map +1 -1
  190. package/dist/sidebar/style.css +6 -73
  191. package/dist/skeleton/index.js +2 -59
  192. package/dist/skeleton/style.css +6 -67
  193. package/dist/slider/style.css +6 -61
  194. package/dist/space/style.css +6 -61
  195. package/dist/speed-dial/style.css +6 -67
  196. package/dist/split-button/style.css +68 -78
  197. package/dist/splitter/style.css +6 -61
  198. package/dist/status/style.css +6 -74
  199. package/dist/stepper/style.css +6 -67
  200. package/dist/styles/base.css +1 -50
  201. package/dist/styles.css +1 -1
  202. package/dist/switch/style.css +6 -68
  203. package/dist/table/index.js +341 -311
  204. package/dist/table/style.css +20 -111
  205. package/dist/tabs/style.css +6 -75
  206. package/dist/tag/style.css +6 -67
  207. package/dist/terminal/style.css +6 -61
  208. package/dist/textarea/style.css +6 -67
  209. package/dist/theme/styles.css +5 -11
  210. package/dist/theme/useMotion.d.ts +5 -1
  211. package/dist/theme/useMotion.d.ts.map +1 -1
  212. package/dist/tiered-menu/style.css +6 -75
  213. package/dist/timeline/style.css +6 -75
  214. package/dist/toast/style.css +6 -67
  215. package/dist/toggle-button/style.css +6 -67
  216. package/dist/toolbar/style.css +6 -61
  217. package/dist/tooltip/style.css +6 -61
  218. package/dist/tree/index.js +158 -172
  219. package/dist/tree/style.css +6 -67
  220. package/dist/tree-select/index.js +198 -212
  221. package/dist/tree-select/style.css +6 -75
  222. package/dist/tree-table/style.css +6 -67
  223. package/dist/treeQuery-CnHkyYOA.js +107 -0
  224. package/dist/virtual-scroller/style.css +6 -69
  225. package/package.json +1 -1
  226. package/dist/Button-smoDleh0.js +0 -156
  227. package/dist/Pagination-DrXmzcEy.js +0 -158
  228. package/dist/checkStrategy-CZzuUKDI.js +0 -63
@@ -1,5 +1,8 @@
1
1
  import '../theme/styles.css'
2
2
  import '../styles/base.css'
3
+ import '../components/Button/styles.css'
3
4
  import '../components/Card/styles.css'
5
+ import '../components/Empty/styles.css'
4
6
  import '../components/Icon/styles.css'
7
+ import '../components/Skeleton/styles.css'
5
8
  import '../components/Page/styles.css'
@@ -1,3 +1,3 @@
1
- import { t as e } from "../Pagination-DrXmzcEy.js";
1
+ import { t as e } from "../Pagination-CqpC5EAs.js";
2
2
  import "./style.js";
3
3
  export { e as MPagination };
@@ -50,6 +50,10 @@
50
50
  --m-font-size-sm: 0.8125rem;
51
51
  --m-font-size-md: 0.875rem;
52
52
  --m-font-size-lg: 1.125rem;
53
+ /* Display scale (page titles, KPI figures) */
54
+ --m-font-size-xl: 1.25rem;
55
+ --m-font-size-2xl: 1.5rem;
56
+ --m-font-size-3xl: 1.75rem;
53
57
  --m-opacity-disabled: 0.55;
54
58
  /* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
55
59
  --m-z-base: 1000;
@@ -192,20 +196,10 @@
192
196
 
193
197
  /*
194
198
  * Global motion policy (complements per-component rules):
195
- * - `reduced` / OS prefers-reduced-motion: keep short paint transitions; stop loops
199
+ * - `reduced`: keep short paint transitions; stop loops
196
200
  * and layout/transform size animation.
197
201
  * - `none`: zero all transition/animation durations.
198
202
  */
199
- @media (prefers-reduced-motion: reduce) {
200
- html:not([data-m-ignore-reduced-motion]) *,
201
- html:not([data-m-ignore-reduced-motion]) *::before,
202
- html:not([data-m-ignore-reduced-motion]) *::after {
203
- animation-duration: 0.01ms !important;
204
- animation-iteration-count: 1 !important;
205
- transition-property: background-color, border-color, color, opacity, box-shadow,
206
- outline, fill, stroke, stroke-dashoffset !important;
207
- }
208
- }
209
203
 
210
204
  [data-m-motion="reduced"] *,
211
205
  [data-m-motion="reduced"] *::before,
@@ -615,7 +609,7 @@
615
609
  .m-zoom-enter-from,
616
610
  .m-zoom-leave-to {
617
611
  opacity: 0;
618
- transform: scale(0.9);
612
+ transform: scale(0.95);
619
613
  }
620
614
 
621
615
  .m-slide-up-enter-active,
@@ -660,44 +654,6 @@
660
654
  transform: translateX(calc(var(--m-motion-distance) * -1));
661
655
  }
662
656
 
663
- @media (prefers-reduced-motion: reduce) {
664
- html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
665
- html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
666
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
667
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
668
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
669
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
670
- html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
671
- html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
672
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
673
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
674
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
675
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
676
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
677
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
678
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
679
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
680
- transition: none;
681
- }
682
-
683
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
684
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
685
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
686
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
687
- html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
688
- html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
689
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
690
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
691
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
692
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
693
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
694
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
695
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
696
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
697
- transform: none;
698
- }
699
- }
700
-
701
657
  [data-m-motion="reduced"] .m-fade-enter-active,
702
658
  [data-m-motion="reduced"] .m-fade-leave-active,
703
659
  [data-m-motion="reduced"] .m-scale-fade-enter-active,
@@ -1192,17 +1148,6 @@
1192
1148
  animation: none !important;
1193
1149
  }
1194
1150
 
1195
- @media (prefers-reduced-motion: reduce) {
1196
- html:not([data-m-ignore-reduced-motion]) *,
1197
- html:not([data-m-ignore-reduced-motion]) *::before,
1198
- html:not([data-m-ignore-reduced-motion]) *::after {
1199
- animation-duration: 0.01ms !important;
1200
- animation-iteration-count: 1 !important;
1201
- scroll-behavior: auto !important;
1202
- transition-duration: 0.01ms !important;
1203
- }
1204
- }
1205
-
1206
1151
  .m-icon {
1207
1152
  color: currentColor;
1208
1153
  display: inline-flex;
@@ -1247,20 +1192,207 @@
1247
1192
  }
1248
1193
  }
1249
1194
 
1250
- @media (prefers-reduced-motion: reduce) {
1251
- html:not([data-m-ignore-reduced-motion]) .m-icon--spin svg {
1252
- animation: none;
1253
- }
1254
- }
1255
-
1256
1195
  :root[data-m-motion='none'] .m-icon--spin svg,
1257
1196
  :root[data-m-motion='reduced'] .m-icon--spin svg {
1258
1197
  animation: none;
1259
1198
  }
1260
1199
 
1200
+ .m-select__control {
1201
+ position: relative;
1202
+ width: 100%;
1203
+ }
1204
+
1205
+ .m-select {
1206
+ align-items: center;
1207
+ cursor: pointer;
1208
+ display: flex;
1209
+ font-family: var(--m-font-sans);
1210
+ font-size: var(--m-control-font-medium);
1211
+ min-height: var(--m-control-height-medium);
1212
+ padding: 0 var(--m-control-padding-x-medium);
1213
+ padding-right: var(--m-control-end-padding);
1214
+ position: relative;
1215
+ text-align: left;
1216
+ }
1217
+
1218
+ .m-select--small,
1219
+ .m-select--sm {
1220
+ font-size: var(--m-control-font-small);
1221
+ min-height: var(--m-control-height-small);
1222
+ padding-left: var(--m-control-padding-x-small);
1223
+ padding-right: var(--m-control-end-padding);
1224
+ }
1225
+
1226
+ .m-select--normal {
1227
+ font-size: var(--m-control-font-medium);
1228
+ min-height: var(--m-control-height-medium);
1229
+ }
1230
+
1231
+ .m-select--large,
1232
+ .m-select--lg {
1233
+ font-size: var(--m-control-font-large);
1234
+ min-height: var(--m-control-height-large);
1235
+ padding-left: var(--m-control-padding-x-large);
1236
+ padding-right: var(--m-control-end-padding);
1237
+ }
1238
+
1239
+ .m-select--multiple {
1240
+ align-items: center;
1241
+ gap: var(--m-space-1);
1242
+ padding-bottom: var(--m-space-1);
1243
+ padding-top: var(--m-space-1);
1244
+ }
1245
+
1246
+ .m-select__tags {
1247
+ display: flex;
1248
+ flex: 1 1 auto;
1249
+ flex-wrap: wrap;
1250
+ gap: var(--m-space-1);
1251
+ min-width: 0;
1252
+ }
1253
+
1254
+ .m-select__spinner {
1255
+ --m-select-spinner-size: 0.85rem;
1256
+ border: var(--m-border-width) solid
1257
+ color-mix(in srgb, var(--m-color-text-muted) 35%, transparent);
1258
+ border-radius: 50%;
1259
+ border-top-color: var(--m-color-primary);
1260
+ flex: 0 0 auto;
1261
+ height: var(--m-select-spinner-size);
1262
+ width: var(--m-select-spinner-size);
1263
+ animation: m-progress-spinner-rotate var(--m-motion-spin-medium) linear infinite;
1264
+ }
1265
+
1266
+ [data-m-motion="reduced"] .m-select__spinner {
1267
+ animation: none;
1268
+ border-top-color: var(--m-color-text-muted);
1269
+ }
1270
+
1271
+ .m-select:hover:not(:disabled):not(.m-select--disabled):not(
1272
+ .m-select--open
1273
+ ) {
1274
+ border-color: var(--m-color-primary-hover);
1275
+ }
1276
+
1277
+ .m-select--open,
1278
+ .m-select:focus-visible {
1279
+ border-color: var(--m-color-primary-hover);
1280
+ box-shadow: var(--m-focus-shadow);
1281
+ outline: none;
1282
+ }
1283
+
1284
+ .m-select--placeholder .m-select__value {
1285
+ color: var(--m-color-text-muted);
1286
+ }
1287
+
1288
+ .m-select__value {
1289
+ flex: 1 1 auto;
1290
+ min-width: 0;
1291
+ overflow: hidden;
1292
+ text-overflow: ellipsis;
1293
+ white-space: nowrap;
1294
+ }
1295
+
1296
+ .m-select__menu {
1297
+ --m-select-menu-max-height: min(18rem, 45vh);
1298
+ --m-select-list-max-height: var(--m-select-menu-max-height);
1299
+ display: flex;
1300
+ flex-direction: column;
1301
+ max-height: var(--m-select-menu-max-height);
1302
+ min-width: 100%;
1303
+ overscroll-behavior: contain;
1304
+ padding: var(--m-space-1);
1305
+ position: absolute;
1306
+ transform-origin: top center;
1307
+ width: max-content;
1308
+ }
1309
+
1310
+ .m-select__menu:has(.m-select__filter) {
1311
+ --m-select-list-max-height: calc(
1312
+ var(--m-select-menu-max-height) - var(--m-control-height-small) - var(--m-space-6)
1313
+ );
1314
+ }
1315
+
1316
+ .m-select__list {
1317
+ max-height: var(--m-select-list-max-height);
1318
+ min-height: 0;
1319
+ overscroll-behavior: contain;
1320
+ }
1321
+
1322
+ .m-select__menu--bottom-start {
1323
+ left: 0;
1324
+ transform-origin: top left;
1325
+ }
1326
+
1327
+ .m-select__menu--bottom-end {
1328
+ right: 0;
1329
+ transform-origin: top right;
1330
+ }
1331
+
1332
+ .m-select__required-input {
1333
+ clip: rect(0, 0, 0, 0);
1334
+ clip-path: inset(50%);
1335
+ height: 1px;
1336
+ margin: -1px;
1337
+ overflow: hidden;
1338
+ opacity: 0;
1339
+ pointer-events: none;
1340
+ position: absolute;
1341
+ white-space: nowrap;
1342
+ width: 1px;
1343
+ }
1344
+
1345
+ .m-select--invalid {
1346
+ border-color: var(--m-color-danger);
1347
+ }
1348
+
1349
+ .m-select__option--create {
1350
+ color: var(--m-color-primary);
1351
+ font-style: italic;
1352
+ }
1353
+
1354
+ .m-select__list--virtual .m-virtualscroller__item {
1355
+ display: flex;
1356
+ }
1357
+
1358
+ .m-select__list--virtual .m-select__option {
1359
+ height: 100%;
1360
+ min-height: 0;
1361
+ width: 100%;
1362
+ }
1363
+
1364
+ .m-select__group-label {
1365
+ color: var(--m-color-text-muted);
1366
+ font-size: var(--m-font-size-xs);
1367
+ padding: var(--m-space-2) var(--m-control-padding-x-medium) var(--m-space-1);
1368
+ }
1369
+
1370
+ /* Virtual rows are fixed-height: center the group label like an option row. */
1371
+ .m-select__list--virtual .m-select__group-label {
1372
+ align-items: center;
1373
+ box-sizing: border-box;
1374
+ display: flex;
1375
+ height: 100%;
1376
+ padding-bottom: 0;
1377
+ padding-top: 0;
1378
+ }
1379
+
1380
+ .m-select__header,
1381
+ .m-select__footer {
1382
+ flex: 0 0 auto;
1383
+ padding: var(--m-space-2) var(--m-control-padding-x-medium);
1384
+ }
1385
+
1386
+ /* Header/footer live outside the scroll list; let the menu grow past the list
1387
+ cap so the panel's overflow:hidden does not clip them. */
1388
+ .m-select__menu:has(.m-select__header),
1389
+ .m-select__menu:has(.m-select__footer) {
1390
+ max-height: none;
1391
+ }
1392
+
1261
1393
  .m-pagination {
1262
1394
  --m-pagination-simple-width: 3.5rem;
1263
- --m-pagination-jumper-width: 3.5rem;
1395
+ --m-pagination-jumper-width: 5.5rem;
1264
1396
  align-items: center;
1265
1397
  display: flex;
1266
1398
  font-family: var(--m-font-sans);
@@ -1329,8 +1461,7 @@
1329
1461
  margin-left: var(--m-space-2);
1330
1462
  }
1331
1463
 
1332
- .m-pagination__select,
1333
- .m-pagination__input {
1464
+ .m-pagination__select {
1334
1465
  background: var(--m-color-surface);
1335
1466
  border: var(--m-border-width) solid var(--m-color-border);
1336
1467
  border-radius: var(--m-radius-control);
@@ -1345,24 +1476,22 @@
1345
1476
  opacity var(--m-motion-fast) var(--m-motion-ease);
1346
1477
  }
1347
1478
 
1348
- .m-pagination__select:hover:not(:disabled),
1349
- .m-pagination__input:hover:not(:disabled):not(:focus) {
1479
+ .m-pagination__select:hover:not(:disabled) {
1350
1480
  border-color: var(--m-color-primary-hover);
1351
1481
  }
1352
1482
 
1353
- .m-pagination__select:focus-visible,
1354
- .m-pagination__input:focus-visible {
1483
+ .m-pagination__select:focus-visible {
1355
1484
  border-color: var(--m-color-primary-hover);
1356
1485
  box-shadow: var(--m-focus-shadow);
1357
1486
  outline: none;
1358
1487
  }
1359
1488
 
1360
- .m-pagination__select:disabled,
1361
- .m-pagination__input:disabled {
1489
+ .m-pagination__select:disabled {
1362
1490
  cursor: not-allowed;
1363
1491
  opacity: var(--m-opacity-disabled);
1364
1492
  }
1365
1493
 
1366
- .m-pagination__input {
1494
+ .m-pagination__jumper-select {
1495
+ min-width: var(--m-pagination-jumper-width);
1367
1496
  width: var(--m-pagination-jumper-width);
1368
1497
  }
@@ -1,4 +1,5 @@
1
1
  import '../theme/styles.css'
2
2
  import '../styles/base.css'
3
3
  import '../components/Icon/styles.css'
4
+ import '../components/Select/styles.css'
4
5
  import '../components/Pagination/styles.css'
@@ -50,6 +50,10 @@
50
50
  --m-font-size-sm: 0.8125rem;
51
51
  --m-font-size-md: 0.875rem;
52
52
  --m-font-size-lg: 1.125rem;
53
+ /* Display scale (page titles, KPI figures) */
54
+ --m-font-size-xl: 1.25rem;
55
+ --m-font-size-2xl: 1.5rem;
56
+ --m-font-size-3xl: 1.75rem;
53
57
  --m-opacity-disabled: 0.55;
54
58
  /* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
55
59
  --m-z-base: 1000;
@@ -192,20 +196,10 @@
192
196
 
193
197
  /*
194
198
  * Global motion policy (complements per-component rules):
195
- * - `reduced` / OS prefers-reduced-motion: keep short paint transitions; stop loops
199
+ * - `reduced`: keep short paint transitions; stop loops
196
200
  * and layout/transform size animation.
197
201
  * - `none`: zero all transition/animation durations.
198
202
  */
199
- @media (prefers-reduced-motion: reduce) {
200
- html:not([data-m-ignore-reduced-motion]) *,
201
- html:not([data-m-ignore-reduced-motion]) *::before,
202
- html:not([data-m-ignore-reduced-motion]) *::after {
203
- animation-duration: 0.01ms !important;
204
- animation-iteration-count: 1 !important;
205
- transition-property: background-color, border-color, color, opacity, box-shadow,
206
- outline, fill, stroke, stroke-dashoffset !important;
207
- }
208
- }
209
203
 
210
204
  [data-m-motion="reduced"] *,
211
205
  [data-m-motion="reduced"] *::before,
@@ -615,7 +609,7 @@
615
609
  .m-zoom-enter-from,
616
610
  .m-zoom-leave-to {
617
611
  opacity: 0;
618
- transform: scale(0.9);
612
+ transform: scale(0.95);
619
613
  }
620
614
 
621
615
  .m-slide-up-enter-active,
@@ -660,44 +654,6 @@
660
654
  transform: translateX(calc(var(--m-motion-distance) * -1));
661
655
  }
662
656
 
663
- @media (prefers-reduced-motion: reduce) {
664
- html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
665
- html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
666
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
667
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
668
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
669
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
670
- html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
671
- html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
672
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
673
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
674
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
675
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
676
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
677
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
678
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
679
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
680
- transition: none;
681
- }
682
-
683
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
684
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
685
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
686
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
687
- html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
688
- html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
689
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
690
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
691
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
692
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
693
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
694
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
695
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
696
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
697
- transform: none;
698
- }
699
- }
700
-
701
657
  [data-m-motion="reduced"] .m-fade-enter-active,
702
658
  [data-m-motion="reduced"] .m-fade-leave-active,
703
659
  [data-m-motion="reduced"] .m-scale-fade-enter-active,
@@ -1192,17 +1148,6 @@
1192
1148
  animation: none !important;
1193
1149
  }
1194
1150
 
1195
- @media (prefers-reduced-motion: reduce) {
1196
- html:not([data-m-ignore-reduced-motion]) *,
1197
- html:not([data-m-ignore-reduced-motion]) *::before,
1198
- html:not([data-m-ignore-reduced-motion]) *::after {
1199
- animation-duration: 0.01ms !important;
1200
- animation-iteration-count: 1 !important;
1201
- scroll-behavior: auto !important;
1202
- transition-duration: 0.01ms !important;
1203
- }
1204
- }
1205
-
1206
1151
  .m-icon {
1207
1152
  color: currentColor;
1208
1153
  display: inline-flex;
@@ -1247,12 +1192,6 @@
1247
1192
  }
1248
1193
  }
1249
1194
 
1250
- @media (prefers-reduced-motion: reduce) {
1251
- html:not([data-m-ignore-reduced-motion]) .m-icon--spin svg {
1252
- animation: none;
1253
- }
1254
- }
1255
-
1256
1195
  :root[data-m-motion='none'] .m-icon--spin svg,
1257
1196
  :root[data-m-motion='reduced'] .m-icon--spin svg {
1258
1197
  animation: none;
@@ -1337,13 +1276,6 @@
1337
1276
  opacity: 0;
1338
1277
  }
1339
1278
 
1340
- @media (prefers-reduced-motion: reduce) {
1341
- html:not([data-m-ignore-reduced-motion]) .m-panel-collapse-enter-active,
1342
- html:not([data-m-ignore-reduced-motion]) .m-panel-collapse-leave-active {
1343
- transition: none;
1344
- }
1345
- }
1346
-
1347
1279
  [data-m-motion="reduced"] .m-panel-collapse-enter-active,
1348
1280
  [data-m-motion="reduced"] .m-panel-collapse-leave-active,
1349
1281
  [data-m-motion="none"] .m-panel-collapse-enter-active,
@@ -50,6 +50,10 @@
50
50
  --m-font-size-sm: 0.8125rem;
51
51
  --m-font-size-md: 0.875rem;
52
52
  --m-font-size-lg: 1.125rem;
53
+ /* Display scale (page titles, KPI figures) */
54
+ --m-font-size-xl: 1.25rem;
55
+ --m-font-size-2xl: 1.5rem;
56
+ --m-font-size-3xl: 1.75rem;
53
57
  --m-opacity-disabled: 0.55;
54
58
  /* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
55
59
  --m-z-base: 1000;
@@ -192,20 +196,10 @@
192
196
 
193
197
  /*
194
198
  * Global motion policy (complements per-component rules):
195
- * - `reduced` / OS prefers-reduced-motion: keep short paint transitions; stop loops
199
+ * - `reduced`: keep short paint transitions; stop loops
196
200
  * and layout/transform size animation.
197
201
  * - `none`: zero all transition/animation durations.
198
202
  */
199
- @media (prefers-reduced-motion: reduce) {
200
- html:not([data-m-ignore-reduced-motion]) *,
201
- html:not([data-m-ignore-reduced-motion]) *::before,
202
- html:not([data-m-ignore-reduced-motion]) *::after {
203
- animation-duration: 0.01ms !important;
204
- animation-iteration-count: 1 !important;
205
- transition-property: background-color, border-color, color, opacity, box-shadow,
206
- outline, fill, stroke, stroke-dashoffset !important;
207
- }
208
- }
209
203
 
210
204
  [data-m-motion="reduced"] *,
211
205
  [data-m-motion="reduced"] *::before,
@@ -615,7 +609,7 @@
615
609
  .m-zoom-enter-from,
616
610
  .m-zoom-leave-to {
617
611
  opacity: 0;
618
- transform: scale(0.9);
612
+ transform: scale(0.95);
619
613
  }
620
614
 
621
615
  .m-slide-up-enter-active,
@@ -660,44 +654,6 @@
660
654
  transform: translateX(calc(var(--m-motion-distance) * -1));
661
655
  }
662
656
 
663
- @media (prefers-reduced-motion: reduce) {
664
- html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
665
- html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
666
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
667
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
668
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
669
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
670
- html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
671
- html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
672
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
673
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
674
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
675
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
676
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
677
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
678
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
679
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
680
- transition: none;
681
- }
682
-
683
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
684
- html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
685
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
686
- html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
687
- html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
688
- html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
689
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
690
- html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
691
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
692
- html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
693
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
694
- html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
695
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
696
- html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
697
- transform: none;
698
- }
699
- }
700
-
701
657
  [data-m-motion="reduced"] .m-fade-enter-active,
702
658
  [data-m-motion="reduced"] .m-fade-leave-active,
703
659
  [data-m-motion="reduced"] .m-scale-fade-enter-active,
@@ -1192,17 +1148,6 @@
1192
1148
  animation: none !important;
1193
1149
  }
1194
1150
 
1195
- @media (prefers-reduced-motion: reduce) {
1196
- html:not([data-m-ignore-reduced-motion]) *,
1197
- html:not([data-m-ignore-reduced-motion]) *::before,
1198
- html:not([data-m-ignore-reduced-motion]) *::after {
1199
- animation-duration: 0.01ms !important;
1200
- animation-iteration-count: 1 !important;
1201
- scroll-behavior: auto !important;
1202
- transition-duration: 0.01ms !important;
1203
- }
1204
- }
1205
-
1206
1151
  .m-icon {
1207
1152
  color: currentColor;
1208
1153
  display: inline-flex;
@@ -1247,12 +1192,6 @@
1247
1192
  }
1248
1193
  }
1249
1194
 
1250
- @media (prefers-reduced-motion: reduce) {
1251
- html:not([data-m-ignore-reduced-motion]) .m-icon--spin svg {
1252
- animation: none;
1253
- }
1254
- }
1255
-
1256
1195
  :root[data-m-motion='none'] .m-icon--spin svg,
1257
1196
  :root[data-m-motion='reduced'] .m-icon--spin svg {
1258
1197
  animation: none;