@maple-design/ui-vue 1.1.0 → 1.1.1

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 (345) hide show
  1. package/es/_components/field-presentation/EditorPanel.vue.mjs +3 -3
  2. package/es/_components/field-presentation/editor-pending.mjs +4 -0
  3. package/es/_components/field-presentation/form-bridge.mjs +1 -1
  4. package/es/_components/field-presentation/with-field-presentation.mjs +51 -8
  5. package/es/_components/picker-field/PickerField.vue.mjs +3 -13
  6. package/es/_components/picker-field/TemporalCurrent.vue.mjs +2 -3
  7. package/es/_components/picker-field/range-labels.mjs +18 -0
  8. package/es/_components/selected-options/style/index.css +33 -15
  9. package/es/_components/selection-field/use-selection-session.mjs +1 -0
  10. package/es/_components/virtual-list-v2/VirtualList2.vue.mjs +26 -4
  11. package/es/action-sheet/ActionSheet2.vue.mjs +2 -3
  12. package/es/auto-complete/auto-complete.mjs +2 -2
  13. package/es/auto-complete/presentation.mjs +1 -0
  14. package/es/auto-complete/props.mjs +2 -0
  15. package/es/auto-complete/style/index.css +7 -2
  16. package/es/back-top/style/index.css +1 -1
  17. package/es/breadcrumb/style/index.css +1 -1
  18. package/es/button/base.mjs +7 -0
  19. package/es/button/index.mjs +9 -9
  20. package/es/button/style/index.css +1 -1
  21. package/es/card/Card.vue.mjs +55 -13
  22. package/es/carousel/style/index.css +1 -1
  23. package/es/carousel/use-carousel-locale.mjs +10 -3
  24. package/es/cascader/CascaderMenu.vue.mjs +2 -2
  25. package/es/cascader/cascader-option.mjs +15 -6
  26. package/es/cascader/field-adapter.mjs +1 -0
  27. package/es/cascader/props.mjs +2 -0
  28. package/es/cascader/style/index.css +36 -9
  29. package/es/cascader/style/index.mjs +1 -0
  30. package/es/cascader/use-cascader-focus.mjs +9 -6
  31. package/es/checkbox/CheckboxGroup.vue.mjs +2 -2
  32. package/es/checkbox/base.mjs +7 -0
  33. package/es/checkbox/index.mjs +1 -1
  34. package/es/checkbox/presentation.mjs +2 -2
  35. package/es/checkbox/style/index.css +1 -1
  36. package/es/countdown/use-countdown.mjs +9 -2
  37. package/es/date/DatePanelActions.vue.mjs +4 -4
  38. package/es/date/DateRangeQuickPanel.vue.mjs +2 -2
  39. package/es/date/DateShortcuts.vue.mjs +2 -2
  40. package/es/date/field-adapter.mjs +2 -3
  41. package/es/date/picker-panels/DayPickerPanel2.vue.mjs +4 -5
  42. package/es/date/picker-panels/MonthPickerPanel2.vue.mjs +5 -6
  43. package/es/date/picker-panels/PanelHeader2.vue.mjs +6 -7
  44. package/es/date/picker-panels/YearPickerPanel2.vue.mjs +2 -2
  45. package/es/date/presentation/CalendarContent2.vue.mjs +13 -14
  46. package/es/date/presentation/CalendarViewport.vue.mjs +2 -3
  47. package/es/date/presentation/use-date-locale.mjs +2 -3
  48. package/es/date/presentation/use-field-locale.mjs +5 -6
  49. package/es/date/presentation/use-panel-actions-locale.mjs +4 -5
  50. package/es/date-range/presentation/RangeContent2.vue.mjs +4 -5
  51. package/es/dialog/Dialog.vue.mjs +3 -3
  52. package/es/ellipsis/style/index.css +1 -1
  53. package/es/fab/Fab.mjs +4 -5
  54. package/es/form/FormItemLabel.vue.mjs +4 -3
  55. package/es/form/focus-explicit-label.mjs +52 -0
  56. package/es/input/base.mjs +7 -0
  57. package/es/input/index.mjs +19 -19
  58. package/es/locale/date-text.mjs +38 -0
  59. package/es/locale/misc-text.mjs +23 -0
  60. package/es/locale/temporal-text.mjs +22 -0
  61. package/es/locale/zh-CN.mjs +235 -131
  62. package/es/maple-vue.mjs +1 -1
  63. package/es/maple.css +273 -207
  64. package/es/maple.esm.js +19385 -18978
  65. package/es/nav-menu/style/index.css +1 -1
  66. package/es/notice-bar/NoticeBar2.vue.mjs +2 -3
  67. package/es/number-keyboard/NumberKeyboard2.vue.mjs +5 -6
  68. package/es/pagination/PageInput.vue.mjs +2 -2
  69. package/es/pagination/style/index.css +2 -2
  70. package/es/people-select/PeopleSelect.mjs +35 -54
  71. package/es/people-select/Person.vue.mjs +3 -3
  72. package/es/people-select/emits.mjs +1 -1
  73. package/es/people-select/people-select.mjs +6 -8
  74. package/es/people-select/presentation.mjs +3 -1
  75. package/es/people-select/props.mjs +9 -3
  76. package/es/people-select/selection.mjs +64 -0
  77. package/es/people-select/style/index.css +6 -0
  78. package/es/picker/Picker.vue.mjs +2 -2
  79. package/es/picker/Picker2.vue.mjs +4 -5
  80. package/es/picker/base.mjs +7 -0
  81. package/es/picker/index.mjs +5 -5
  82. package/es/progress/style/index.css +2 -2
  83. package/es/radio/style/index.css +1 -1
  84. package/es/rate/style/index.css +2 -2
  85. package/es/ripple/index.mjs +78 -0
  86. package/es/search/HistoryContent.vue.mjs +4 -4
  87. package/es/search/Search.vue.mjs +4 -4
  88. package/es/search/props.mjs +1 -2
  89. package/es/select/props.mjs +2 -0
  90. package/es/select/select.mjs +14 -4
  91. package/es/select/style/index.css +22 -12
  92. package/es/select/use-select-controller.mjs +22 -2
  93. package/es/slider/Slider.vue.mjs +43 -21
  94. package/es/slider/SliderInput.vue.mjs +14 -2
  95. package/es/slider/style/index.css +2 -2
  96. package/es/steps/style/index.css +10 -10
  97. package/es/switch/Switch.vue.mjs +12 -1
  98. package/es/switch/style/index.css +1 -1
  99. package/es/tab-bar/TabBar.vue.mjs +2 -2
  100. package/es/tab-bar/style/index.css +2 -2
  101. package/es/tabs/style/index.css +1 -1
  102. package/es/tabs/use-tabs-configuration.mjs +2 -3
  103. package/es/themes/alps-light/index.mjs +10 -11
  104. package/es/themes/create-brand-dark.mjs +18 -0
  105. package/es/themes/dark/breadcrumb-item.mjs +1 -1
  106. package/es/themes/dark/cascader.mjs +1 -1
  107. package/es/themes/dark/index.mjs +2 -2
  108. package/es/themes/firefly-light/index.mjs +12 -13
  109. package/es/themes/index.mjs +2 -2
  110. package/es/themes/maple-light/index.mjs +2 -2
  111. package/es/time/presentation/TimeFieldPanel.vue.mjs +2 -2
  112. package/es/time/presentation/TimePanelContent2.vue.mjs +8 -9
  113. package/es/time/presentation/use-field-locale.mjs +5 -6
  114. package/es/time/props.mjs +1 -1
  115. package/es/time-range/presentation/TimePanelContent2.vue.mjs +6 -7
  116. package/es/time-range/props.mjs +1 -1
  117. package/es/trigger/popup-move-focus.mjs +6 -6
  118. package/es/trigger/position.mjs +49 -3
  119. package/es/trigger/positioner.mjs +34 -5
  120. package/es/trigger/trigger.mjs +1 -1
  121. package/es/upload/Upload.vue.mjs +18 -2
  122. package/es/upload/composables/use-upload-queue.mjs +10 -1
  123. package/es/upload/composables/use-uploader.mjs +45 -11
  124. package/es/upload/use-upload-locale.mjs +16 -12
  125. package/es/utils/modal-focus.mjs +9 -2
  126. package/es/utils/modal-surface.mjs +9 -3
  127. package/highlight/web-types.en-US.json +698 -176
  128. package/highlight/web-types.zh-CN.json +699 -177
  129. package/lib/_components/field-presentation/EditorPanel.vue.js +3 -3
  130. package/lib/_components/field-presentation/editor-pending.js +4 -0
  131. package/lib/_components/field-presentation/with-field-presentation.js +50 -7
  132. package/lib/_components/picker-field/PickerField.vue.js +3 -13
  133. package/lib/_components/picker-field/TemporalCurrent.vue.js +2 -3
  134. package/lib/_components/picker-field/range-labels.js +18 -0
  135. package/lib/_components/selected-options/style/index.css +33 -15
  136. package/lib/_components/selection-field/use-selection-session.js +1 -0
  137. package/lib/_components/virtual-list-v2/VirtualList2.vue.js +25 -3
  138. package/lib/action-sheet/ActionSheet2.vue.js +2 -3
  139. package/lib/auto-complete/auto-complete.js +2 -2
  140. package/lib/auto-complete/presentation.js +1 -0
  141. package/lib/auto-complete/props.js +2 -0
  142. package/lib/auto-complete/style/index.css +7 -2
  143. package/lib/back-top/style/index.css +1 -1
  144. package/lib/breadcrumb/style/index.css +1 -1
  145. package/lib/button/base.js +7 -0
  146. package/lib/button/index.js +4 -4
  147. package/lib/button/style/index.css +1 -1
  148. package/lib/card/Card.vue.js +55 -13
  149. package/lib/carousel/style/index.css +1 -1
  150. package/lib/carousel/use-carousel-locale.js +9 -2
  151. package/lib/cascader/CascaderMenu.vue.js +2 -2
  152. package/lib/cascader/cascader-option.js +15 -6
  153. package/lib/cascader/field-adapter.js +1 -0
  154. package/lib/cascader/props.js +2 -0
  155. package/lib/cascader/style/index.css +36 -9
  156. package/lib/cascader/style/index.js +1 -0
  157. package/lib/cascader/use-cascader-focus.js +9 -6
  158. package/lib/checkbox/base.js +7 -0
  159. package/lib/checkbox/index.js +4 -4
  160. package/lib/checkbox/presentation.js +2 -2
  161. package/lib/checkbox/style/index.css +1 -1
  162. package/lib/countdown/use-countdown.js +9 -2
  163. package/lib/date/DatePanelActions.vue.js +4 -4
  164. package/lib/date/DateRangeQuickPanel.vue.js +2 -2
  165. package/lib/date/DateShortcuts.vue.js +2 -2
  166. package/lib/date/field-adapter.js +2 -3
  167. package/lib/date/picker-panels/DayPickerPanel2.vue.js +6 -7
  168. package/lib/date/picker-panels/MonthPickerPanel2.vue.js +7 -8
  169. package/lib/date/picker-panels/PanelHeader2.vue.js +6 -7
  170. package/lib/date/picker-panels/YearPickerPanel2.vue.js +2 -2
  171. package/lib/date/presentation/CalendarContent2.vue.js +13 -14
  172. package/lib/date/presentation/CalendarViewport.vue.js +2 -3
  173. package/lib/date/presentation/use-date-locale.js +2 -3
  174. package/lib/date/presentation/use-field-locale.js +5 -6
  175. package/lib/date/presentation/use-panel-actions-locale.js +4 -5
  176. package/lib/date-range/presentation/RangeContent2.vue.js +4 -5
  177. package/lib/dialog/Dialog.vue.js +3 -3
  178. package/lib/ellipsis/style/index.css +1 -1
  179. package/lib/fab/Fab.js +4 -5
  180. package/lib/form/FormItemLabel.vue.js +3 -2
  181. package/lib/form/focus-explicit-label.js +52 -0
  182. package/lib/input/base.js +7 -0
  183. package/lib/input/index.js +5 -5
  184. package/lib/locale/date-text.js +38 -0
  185. package/lib/locale/misc-text.js +23 -0
  186. package/lib/locale/temporal-text.js +22 -0
  187. package/lib/locale/zh-CN.js +234 -130
  188. package/lib/maple-vue.js +1 -1
  189. package/lib/maple.cjs.js +3637 -2963
  190. package/lib/maple.css +273 -207
  191. package/lib/nav-menu/style/index.css +1 -1
  192. package/lib/notice-bar/NoticeBar2.vue.js +2 -3
  193. package/lib/number-keyboard/NumberKeyboard2.vue.js +5 -6
  194. package/lib/pagination/PageInput.vue.js +2 -2
  195. package/lib/pagination/style/index.css +2 -2
  196. package/lib/people-select/PeopleSelect.js +34 -53
  197. package/lib/people-select/Person.vue.js +3 -3
  198. package/lib/people-select/emits.js +1 -1
  199. package/lib/people-select/people-select.js +6 -8
  200. package/lib/people-select/presentation.js +3 -1
  201. package/lib/people-select/props.js +9 -3
  202. package/lib/people-select/selection.js +64 -0
  203. package/lib/people-select/style/index.css +6 -0
  204. package/lib/picker/Picker.vue.js +2 -2
  205. package/lib/picker/Picker2.vue.js +4 -5
  206. package/lib/picker/base.js +7 -0
  207. package/lib/picker/index.js +5 -5
  208. package/lib/progress/style/index.css +2 -2
  209. package/lib/radio/style/index.css +1 -1
  210. package/lib/rate/style/index.css +2 -2
  211. package/lib/ripple/index.js +78 -0
  212. package/lib/search/HistoryContent.vue.js +4 -4
  213. package/lib/search/Search.vue.js +4 -4
  214. package/lib/search/props.js +1 -2
  215. package/lib/select/props.js +2 -0
  216. package/lib/select/select.js +14 -4
  217. package/lib/select/style/index.css +22 -12
  218. package/lib/select/use-select-controller.js +22 -2
  219. package/lib/slider/Slider.vue.js +42 -20
  220. package/lib/slider/SliderInput.vue.js +14 -2
  221. package/lib/slider/style/index.css +2 -2
  222. package/lib/steps/style/index.css +10 -10
  223. package/lib/switch/Switch.vue.js +11 -0
  224. package/lib/switch/style/index.css +1 -1
  225. package/lib/tab-bar/TabBar.vue.js +2 -2
  226. package/lib/tab-bar/style/index.css +2 -2
  227. package/lib/tabs/style/index.css +1 -1
  228. package/lib/tabs/use-tabs-configuration.js +2 -3
  229. package/lib/themes/alps-light/index.js +10 -11
  230. package/lib/themes/create-brand-dark.js +18 -0
  231. package/lib/themes/dark/breadcrumb-item.js +1 -1
  232. package/lib/themes/dark/cascader.js +1 -1
  233. package/lib/themes/dark/index.js +2 -2
  234. package/lib/themes/firefly-light/index.js +12 -13
  235. package/lib/themes/index.js +2 -2
  236. package/lib/themes/maple-light/index.js +2 -2
  237. package/lib/time/presentation/TimeFieldPanel.vue.js +2 -2
  238. package/lib/time/presentation/TimePanelContent2.vue.js +8 -9
  239. package/lib/time/presentation/use-field-locale.js +5 -6
  240. package/lib/time/props.js +1 -1
  241. package/lib/time-range/presentation/TimePanelContent2.vue.js +6 -7
  242. package/lib/time-range/props.js +1 -1
  243. package/lib/trigger/popup-move-focus.js +6 -6
  244. package/lib/trigger/position.js +48 -2
  245. package/lib/trigger/positioner.js +33 -4
  246. package/lib/trigger/trigger.js +1 -1
  247. package/lib/upload/Upload.vue.js +17 -1
  248. package/lib/upload/composables/use-upload-queue.js +10 -1
  249. package/lib/upload/composables/use-uploader.js +45 -11
  250. package/lib/upload/use-upload-locale.js +15 -11
  251. package/lib/utils/modal-focus.js +9 -2
  252. package/lib/utils/modal-surface.js +9 -3
  253. package/package.json +6 -6
  254. package/types/styleVars.d.ts +3 -0
  255. package/types-generated/_components/field-presentation/editor-pending.d.ts +3 -0
  256. package/types-generated/_components/field-presentation/with-field-presentation.d.ts +2 -0
  257. package/types-generated/_components/picker-field/range-labels.d.ts +1 -0
  258. package/types-generated/action-sheet/ActionSheet.vue.d.ts +2 -1
  259. package/types-generated/action-sheet/index.d.ts +1 -1
  260. package/types-generated/auto-complete/auto-complete.d.ts +13 -4
  261. package/types-generated/auto-complete/index.d.ts +30 -0
  262. package/types-generated/auto-complete/presentation.d.ts +9 -0
  263. package/types-generated/auto-complete/props.d.ts +5 -1
  264. package/types-generated/breadcrumb/index.d.ts +72 -2
  265. package/types-generated/button/base.d.ts +266 -0
  266. package/types-generated/button/index.d.ts +3 -1
  267. package/types-generated/cascader/Cascader.vue.d.ts +10 -1
  268. package/types-generated/cascader/CascaderPanel.vue.d.ts +1 -1
  269. package/types-generated/cascader/index.d.ts +39 -9
  270. package/types-generated/cascader/presentation.d.ts +18 -3
  271. package/types-generated/cascader/props.d.ts +5 -0
  272. package/types-generated/cascader/style/index.d.ts +1 -0
  273. package/types-generated/cascader/use-cascader-controller.d.ts +4 -0
  274. package/types-generated/checkbox/base.d.ts +361 -0
  275. package/types-generated/checkbox/index.d.ts +362 -3
  276. package/types-generated/date/picker-panels/DayPickerPanel.vue.d.ts +6 -248
  277. package/types-generated/date/picker-panels/MonthPickerPanel.vue.d.ts +8 -249
  278. package/types-generated/date/picker-panels/PanelHeader.vue.d.ts +3 -124
  279. package/types-generated/date/picker-panels/YearPickerPanel.vue.d.ts +6 -248
  280. package/types-generated/date/presentation/CalendarContent.vue.d.ts +1169 -966
  281. package/types-generated/date-range/presentation/RangeContent.vue.d.ts +2561 -1430
  282. package/types-generated/form/focus-explicit-label.d.ts +2 -0
  283. package/types-generated/index.d.ts +1 -1
  284. package/types-generated/input/base.d.ts +481 -0
  285. package/types-generated/input/index.d.ts +2 -0
  286. package/types-generated/locale/date-text.d.ts +2 -0
  287. package/types-generated/locale/misc-text.d.ts +2 -0
  288. package/types-generated/locale/temporal-text.d.ts +2 -0
  289. package/types-generated/maple-vue.d.ts +1 -1
  290. package/types-generated/menu/index.d.ts +1022 -2
  291. package/types-generated/people-select/PeopleSelect.d.ts +38 -16
  292. package/types-generated/people-select/emits.d.ts +3 -2
  293. package/types-generated/people-select/index.d.ts +135 -63
  294. package/types-generated/people-select/people-select.d.ts +47 -16
  295. package/types-generated/people-select/presentation.d.ts +46 -16
  296. package/types-generated/people-select/props.d.ts +18 -7
  297. package/types-generated/people-select/selection.d.ts +11 -0
  298. package/types-generated/people-select/types.d.ts +5 -1
  299. package/types-generated/picker/Picker.vue.d.ts +5 -125
  300. package/types-generated/picker/base.d.ts +2043 -0
  301. package/types-generated/picker/index.d.ts +1134 -206
  302. package/types-generated/radio/index.d.ts +365 -2
  303. package/types-generated/search/Search.vue.d.ts +2 -2
  304. package/types-generated/search/props.d.ts +1 -1
  305. package/types-generated/select/index.d.ts +30 -0
  306. package/types-generated/select/native-editor-owner.d.ts +1 -0
  307. package/types-generated/select/props.d.ts +6 -1
  308. package/types-generated/select/select.d.ts +9 -0
  309. package/types-generated/select/use-select-controller.d.ts +5 -0
  310. package/types-generated/slider/SliderInput.vue.d.ts +4 -0
  311. package/types-generated/themes/dark/cascader.d.ts +1 -1
  312. package/types-generated/themes/index.d.ts +2 -2
  313. package/types-generated/time/presentation/TimePanelContent.vue.d.ts +1117 -309
  314. package/types-generated/time/props.d.ts +3 -2
  315. package/types-generated/time-range/picker-props.d.ts +1 -1
  316. package/types-generated/time-range/presentation/TimePanelContent.vue.d.ts +1125 -317
  317. package/types-generated/time-range/props.d.ts +6 -5
  318. package/types-generated/trigger/position.d.ts +1 -0
  319. package/types-generated/upload/Upload.vue.d.ts +11 -11
  320. package/types-generated/upload/composables/use-upload-queue.d.ts +1 -0
  321. package/types-generated/upload/composables/use-uploader.d.ts +2 -0
  322. package/types-generated/utils/modal-focus.d.ts +1 -0
  323. package/umd/_components/selected-options/style/index.css +33 -15
  324. package/umd/auto-complete/style/index.css +7 -2
  325. package/umd/back-top/style/index.css +1 -1
  326. package/umd/breadcrumb/style/index.css +1 -1
  327. package/umd/button/style/index.css +1 -1
  328. package/umd/carousel/style/index.css +1 -1
  329. package/umd/cascader/style/index.css +36 -9
  330. package/umd/checkbox/style/index.css +1 -1
  331. package/umd/ellipsis/style/index.css +1 -1
  332. package/umd/maple.css +273 -207
  333. package/umd/maple.js +3 -3
  334. package/umd/nav-menu/style/index.css +1 -1
  335. package/umd/pagination/style/index.css +2 -2
  336. package/umd/people-select/style/index.css +6 -0
  337. package/umd/progress/style/index.css +2 -2
  338. package/umd/radio/style/index.css +1 -1
  339. package/umd/rate/style/index.css +2 -2
  340. package/umd/select/style/index.css +22 -12
  341. package/umd/slider/style/index.css +2 -2
  342. package/umd/steps/style/index.css +10 -10
  343. package/umd/switch/style/index.css +1 -1
  344. package/umd/tab-bar/style/index.css +2 -2
  345. package/umd/tabs/style/index.css +1 -1
@@ -5,7 +5,7 @@
5
5
  :where([data-mp-theme]) {
6
6
  --mp-nav-menu-background: var(--mp-sys-color-surface-overlay);
7
7
  --mp-nav-menu-color: var(--mp-sys-color-content-primary);
8
- --mp-nav-menu-active-color: var(--mp-sys-color-content-brand);
8
+ --mp-nav-menu-active-color: var(--mp-sys-color-action-primary);
9
9
  --mp-nav-menu-disabled-color: var(--mp-color-text-disabled);
10
10
  --mp-nav-menu-border-color: var(--mp-sys-color-border-default);
11
11
  --mp-nav-menu-height: 48px;
@@ -21,11 +21,11 @@
21
21
  --mp-pagination-touch-size: 44px;
22
22
  --mp-pagination-focus-width: 2px;
23
23
  --mp-pagination-focus-offset: 1px;
24
- --mp-pagination-focus-color: var(--mp-sys-color-content-brand);
24
+ --mp-pagination-focus-color: var(--mp-sys-color-action-primary);
25
25
  --mp-pagination-item-background: transparent;
26
26
  --mp-pagination-hover-background: var(--mp-color-fill-1);
27
27
  --mp-pagination-active-background: var(--mp-color-primary-light-1);
28
- --mp-pagination-active-color: var(--mp-sys-color-content-brand);
28
+ --mp-pagination-active-color: var(--mp-sys-color-action-primary);
29
29
  --mp-pagination-disabled-color: var(--mp-color-text-disabled);
30
30
  --mp-pagination-disabled-background: var(--mp-color-fill-1);
31
31
  }
@@ -30,3 +30,9 @@
30
30
  align-items: center;
31
31
  justify-content: center;
32
32
  }
33
+ .mp-people-select-people {
34
+ display: inline-flex;
35
+ flex-wrap: wrap;
36
+ align-items: center;
37
+ gap: var(--mp-people-select-content-gap);
38
+ }
@@ -6,8 +6,8 @@
6
6
  --mp-progress-font-size: var(--mp-sys-font-size-sm);
7
7
  --mp-progress-text-color: var(--mp-sys-color-content-secondary);
8
8
  --mp-progress-track-color: var(--mp-sys-color-state-hover);
9
- --mp-progress-default-color: var(--mp-sys-color-content-brand);
10
- --mp-progress-primary-color: var(--mp-sys-color-content-brand);
9
+ --mp-progress-default-color: var(--mp-sys-color-action-primary);
10
+ --mp-progress-primary-color: var(--mp-sys-color-action-primary);
11
11
  --mp-progress-secondary-color: var(--mp-sys-color-content-secondary);
12
12
  --mp-progress-tertiary-color: var(--mp-sys-color-content-tertiary);
13
13
  --mp-progress-info-color: var(--mp-sys-color-content-info);
@@ -3,7 +3,7 @@
3
3
  }
4
4
  :root,
5
5
  :where([data-mp-theme]) {
6
- --mp-radio-control-color-checked: var(--mp-sys-color-content-brand);
6
+ --mp-radio-control-color-checked: var(--mp-sys-color-action-primary);
7
7
  --mp-radio-control-color: var(--mp-sys-color-content-secondary);
8
8
  --mp-radio-control-color-disabled: var(--mp-sys-color-content-disabled);
9
9
  --mp-radio-control-color-error: var(--mp-sys-color-content-danger);
@@ -6,7 +6,7 @@
6
6
  --mp-rate-disabled-color: var(--mp-sys-color-content-disabled);
7
7
  --mp-rate-error-color: var(--mp-sys-color-content-danger);
8
8
  --mp-rate-active-scale: 1.2;
9
- --mp-rate-focus-color: var(--mp-sys-color-content-brand);
9
+ --mp-rate-focus-color: var(--mp-sys-color-action-primary);
10
10
  --mp-rate-focus-width: 2px;
11
11
  --mp-rate-focus-offset: 2px;
12
12
  --mp-rate-size: 24px;
@@ -14,7 +14,7 @@
14
14
  --mp-rate-min-height: 0px;
15
15
  --mp-rate-action-padding: 4px;
16
16
  --mp-rate-empty-color: var(--mp-color-text);
17
- --mp-rate-active-color: var(--mp-sys-color-content-brand);
17
+ --mp-rate-active-color: var(--mp-sys-color-action-primary);
18
18
  --mp-rate-transition-duration: 250ms;
19
19
  --mp-rate-scale-duration: 250ms;
20
20
  --mp-rate-transition-timing-function: ease;
@@ -7,28 +7,31 @@
7
7
  * Popup Box
8
8
  **********************************************/
9
9
  --mp-select-popup-max-height: 200px;
10
- --mp-select-popup-border-radius: var(--mp-sys-radius-md);
10
+ --mp-select-popup-border-radius: var(--mp-sys-radius-lg);
11
11
  --mp-select-popup-padding-vertical: var(--mp-sys-space-2);
12
12
  --mp-select-popup-font-size: var(--mp-sys-font-size-md);
13
13
  --mp-select-popup-bg: var(--mp-sys-color-surface-overlay);
14
- --mp-select-popup-border-color: var(--mp-sys-color-border-default);
15
- --mp-select-popup-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
14
+ --mp-select-popup-border-color: var(--mp-sys-color-border-subtle);
15
+ --mp-select-popup-box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
16
16
  /**********************************************
17
17
  * Popup Options
18
18
  * status: default / disabled / selected / hover
19
19
  **********************************************/
20
20
  --mp-select-popup-option-height: 36px;
21
21
  --mp-select-popup-option-font-weight-selected: var(--mp-sys-font-weight-medium);
22
- --mp-select-popup-option-padding-horizontal: var(--mp-sys-space-5);
23
- --mp-select-popup-option-bg: var(--mp-sys-color-surface-overlay);
22
+ --mp-select-popup-option-padding-horizontal: var(--mp-sys-space-4);
23
+ --mp-select-popup-padding-horizontal: var(--mp-sys-space-3);
24
+ --mp-select-popup-option-border-radius: var(--mp-sys-radius-lg);
25
+ --mp-select-popup-option-bg: transparent;
24
26
  --mp-select-popup-option-bg-hover: var(--mp-sys-color-state-hover);
25
- --mp-select-popup-option-bg-selected: var(--mp-sys-color-surface-overlay);
26
- --mp-select-popup-option-bg-disabled: var(--mp-sys-color-surface-overlay);
27
+ --mp-select-popup-option-bg-selected: transparent;
28
+ --mp-select-popup-option-bg-selected-hover: var(--mp-select-popup-option-bg-hover);
29
+ --mp-select-popup-option-bg-disabled: transparent;
27
30
  --mp-select-popup-option-text-color: var(--mp-sys-color-content-primary);
28
31
  --mp-select-popup-option-text-color-hover: var(--mp-sys-color-content-primary);
29
- --mp-select-popup-option-text-color-selected: var(--mp-sys-color-content-primary);
32
+ --mp-select-popup-option-text-color-selected: var(--mp-sys-color-action-primary);
30
33
  --mp-select-popup-option-text-color-disabled: var(--mp-sys-color-content-disabled);
31
- --mp-select-popup-option-check-color: var(--mp-sys-color-content-primary);
34
+ --mp-select-popup-option-check-color: var(--mp-sys-color-action-primary);
32
35
  --mp-select-popup-option-check-size: var(--mp-sys-font-size-md);
33
36
  --mp-select-popup-option-check-gap: var(--mp-sys-space-4);
34
37
  --mp-select-popup-group-title-height: 20px;
@@ -69,6 +72,8 @@
69
72
  list-style: none;
70
73
  }
71
74
  .mp-select-dropdown-list-wrapper {
75
+ box-sizing: border-box;
76
+ padding-inline: var(--mp-select-popup-padding-horizontal);
72
77
  max-height: var(--mp-select-popup-max-height);
73
78
  overflow-y: auto;
74
79
  }
@@ -80,6 +85,8 @@
80
85
  box-sizing: border-box;
81
86
  width: 100%;
82
87
  padding: 0 var(--mp-select-popup-option-padding-horizontal);
88
+ border-radius: var(--mp-select-popup-option-border-radius);
89
+ transition: background-color var(--mp-sys-motion-duration-fast) var(--mp-sys-motion-easing-standard), color var(--mp-sys-motion-duration-fast) var(--mp-sys-motion-easing-standard);
83
90
  color: var(--mp-select-popup-option-text-color);
84
91
  font-size: var(--mp-select-popup-font-size);
85
92
  line-height: var(--mp-select-popup-option-height);
@@ -119,11 +126,14 @@
119
126
  font-weight: var(--mp-select-popup-option-font-weight-selected);
120
127
  background-color: var(--mp-select-popup-option-bg-selected);
121
128
  }
122
- .mp-select-dropdown .mp-select-option-active,
123
- .mp-select-dropdown .mp-select-option:not(.mp-select-dropdown .mp-select-option-disabled):hover {
129
+ .mp-select-dropdown .mp-select-option-active:not(.mp-select-option-selected):not(.mp-select-option-disabled),
130
+ .mp-select-dropdown .mp-select-option:not(.mp-select-option-selected):not(.mp-select-option-disabled):hover {
124
131
  color: var(--mp-select-popup-option-text-color-hover);
125
132
  background-color: var(--mp-select-popup-option-bg-hover);
126
- transition: all var(--mp-sys-motion-duration-fast) var(--mp-sys-motion-easing-standard);
133
+ }
134
+ .mp-select-dropdown .mp-select-option-selected:not(.mp-select-option-disabled):hover,
135
+ .mp-select-dropdown .mp-select-option-selected.mp-select-option-active:not(.mp-select-option-disabled) {
136
+ background-color: var(--mp-select-popup-option-bg-selected-hover);
127
137
  }
128
138
  .mp-select-dropdown .mp-select-option-disabled {
129
139
  color: var(--mp-select-popup-option-text-color-disabled);
@@ -3,10 +3,10 @@
3
3
  }
4
4
  :root,
5
5
  :where([data-mp-theme]) {
6
- --mp-slider-active-color: var(--mp-sys-color-content-brand);
6
+ --mp-slider-active-color: var(--mp-sys-color-action-primary);
7
7
  --mp-slider-track-color: var(--mp-sys-color-state-hover);
8
8
  --mp-slider-thumb-color: var(--mp-sys-color-surface-default);
9
- --mp-slider-thumb-border-color: var(--mp-sys-color-content-brand);
9
+ --mp-slider-thumb-border-color: var(--mp-sys-color-action-primary);
10
10
  --mp-slider-text-color: var(--mp-sys-color-content-secondary);
11
11
  --mp-slider-tooltip-background: var(--mp-sys-color-surface-tooltip);
12
12
  --mp-slider-tooltip-color: var(--mp-sys-color-content-on-dark);
@@ -27,15 +27,15 @@
27
27
  --mp-steps-circle-item-tail-color-wait: var(--mp-sys-color-border-default);
28
28
  --mp-steps-circle-item-title-color-wait: var(--mp-sys-color-content-secondary);
29
29
  --mp-steps-circle-item-description-color-wait: var(--mp-sys-color-content-secondary);
30
- --mp-steps-circle-item-bg-process: var(--mp-sys-color-content-brand);
30
+ --mp-steps-circle-item-bg-process: var(--mp-sys-color-action-primary);
31
31
  --mp-steps-circle-item-border-color-process: transparent;
32
32
  --mp-steps-circle-item-icon-text-color-process: var(--mp-sys-color-surface-default);
33
- --mp-steps-circle-item-tail-color-process: var(--mp-sys-color-content-brand);
33
+ --mp-steps-circle-item-tail-color-process: var(--mp-sys-color-action-primary);
34
34
  --mp-steps-circle-item-title-color-process: var(--mp-sys-color-content-primary);
35
35
  --mp-steps-circle-item-description-color-process: var(--mp-sys-color-content-secondary);
36
36
  --mp-steps-circle-item-bg-finish: var(--mp-sys-color-state-selected);
37
37
  --mp-steps-circle-item-border-color-finish: transparent;
38
- --mp-steps-circle-item-icon-text-color-finish: var(--mp-sys-color-content-brand);
38
+ --mp-steps-circle-item-icon-text-color-finish: var(--mp-sys-color-action-primary);
39
39
  --mp-steps-circle-item-title-color-finish: var(--mp-sys-color-content-primary);
40
40
  --mp-steps-circle-item-description-color-finish: var(--mp-sys-color-content-secondary);
41
41
  --mp-steps-circle-item-bg-error: var(--mp-sys-color-content-danger);
@@ -61,13 +61,13 @@
61
61
  --mp-steps-dot-item-tail-color-wait: var(--mp-sys-color-border-default);
62
62
  --mp-steps-dot-item-title-color-wait: var(--mp-sys-color-content-secondary);
63
63
  --mp-steps-dot-item-description-color-wait: var(--mp-sys-color-content-secondary);
64
- --mp-steps-dot-item-bg-process: var(--mp-sys-color-content-brand);
65
- --mp-steps-dot-item-border-color-process: var(--mp-sys-color-content-brand);
66
- --mp-steps-dot-item-tail-color-process: var(--mp-sys-color-content-brand);
64
+ --mp-steps-dot-item-bg-process: var(--mp-sys-color-action-primary);
65
+ --mp-steps-dot-item-border-color-process: var(--mp-sys-color-action-primary);
66
+ --mp-steps-dot-item-tail-color-process: var(--mp-sys-color-action-primary);
67
67
  --mp-steps-dot-item-title-color-process: var(--mp-sys-color-content-primary);
68
68
  --mp-steps-dot-item-description-color-process: var(--mp-sys-color-content-secondary);
69
- --mp-steps-dot-item-bg-finish: var(--mp-sys-color-content-brand);
70
- --mp-steps-dot-item-border-color-finish: var(--mp-sys-color-content-brand);
69
+ --mp-steps-dot-item-bg-finish: var(--mp-sys-color-action-primary);
70
+ --mp-steps-dot-item-border-color-finish: var(--mp-sys-color-action-primary);
71
71
  --mp-steps-dot-item-title-color-finish: var(--mp-sys-color-content-primary);
72
72
  --mp-steps-dot-item-description-color-finish: var(--mp-sys-color-content-secondary);
73
73
  --mp-steps-dot-item-bg-error: var(--mp-sys-color-content-danger);
@@ -86,7 +86,7 @@
86
86
  --mp-steps-arrow-item-bg-wait: var(--mp-sys-color-surface-muted);
87
87
  --mp-steps-arrow-item-title-color-wait: var(--mp-sys-color-content-secondary);
88
88
  --mp-steps-arrow-item-description-color-wait: var(--mp-sys-color-content-secondary);
89
- --mp-steps-arrow-item-bg-process: var(--mp-sys-color-content-brand);
89
+ --mp-steps-arrow-item-bg-process: var(--mp-sys-color-action-primary);
90
90
  --mp-steps-arrow-item-title-color-process: var(--mp-sys-color-surface-default);
91
91
  --mp-steps-arrow-item-description-color-process: var(--mp-sys-color-surface-default);
92
92
  --mp-steps-arrow-item-bg-finish: var(--mp-sys-color-state-selected);
@@ -104,7 +104,7 @@
104
104
  --mp-steps-navigation-arrow-spacing-right: 10px;
105
105
  --mp-steps-navigation-ink-spacing-left: 0;
106
106
  --mp-steps-navigation-ink-spacing-right: 30px;
107
- --mp-steps-navigation-ink-bg: var(--mp-sys-color-content-brand);
107
+ --mp-steps-navigation-ink-bg: var(--mp-sys-color-action-primary);
108
108
  --mp-steps-changeable-hover-text-color: var(--mp-sys-color-content-brand);
109
109
  --mp-steps-node-font-weight: 500;
110
110
  --mp-steps-transition-duration-1: 0.1s;
@@ -12,7 +12,7 @@
12
12
  --mp-switch-size-lg-scale: 1.2;
13
13
  --mp-switch-hit-area: 0px;
14
14
  --mp-switch-track-background: var(--mp-sys-color-content-secondary);
15
- --mp-switch-track-active-background: var(--mp-sys-color-content-brand);
15
+ --mp-switch-track-active-background: var(--mp-sys-color-action-primary);
16
16
  --mp-switch-track-error-background: var(--mp-sys-color-content-danger);
17
17
  --mp-switch-handle-background: var(--mp-sys-color-surface-default);
18
18
  --mp-switch-handle-color: var(--mp-sys-color-content-brand);
@@ -8,10 +8,10 @@
8
8
  --mp-tab-bar-item-focus-color: currentColor;
9
9
  --mp-tab-bar-item-font-size: var(--mp-font-size-sm);
10
10
  --mp-tab-bar-item-inactive-color: var(--mp-color-text-2);
11
- --mp-tab-bar-item-active-color: var(--mp-sys-color-content-brand);
11
+ --mp-tab-bar-item-active-color: var(--mp-sys-color-action-primary);
12
12
  --mp-tab-bar-item-active-background-color: transparent;
13
13
  --mp-tab-bar-item-variant-active-background-color: color-mix(in srgb, var(--mp-color-primary) 14%, var(--mp-tab-bar-background-color));
14
- --mp-tab-bar-item-variant-active-color: var(--mp-sys-color-content-brand);
14
+ --mp-tab-bar-item-variant-active-color: var(--mp-sys-color-action-primary);
15
15
  --mp-tab-bar-item-line-height: 1;
16
16
  --mp-tab-bar-item-icon-size: 22px;
17
17
  --mp-tab-bar-item-icon-margin-bottom: 5px;
@@ -5,7 +5,7 @@
5
5
  :where([data-mp-theme]) {
6
6
  --mp-tabs-background: var(--mp-sys-color-surface-default);
7
7
  --mp-tabs-title-text-color: var(--mp-sys-color-content-secondary);
8
- --mp-tabs-title-text-color-active: var(--mp-sys-color-content-brand);
8
+ --mp-tabs-title-text-color-active: var(--mp-sys-color-action-primary);
9
9
  --mp-tabs-title-text-color-disabled: var(--mp-sys-color-content-disabled);
10
10
  --mp-tabs-muted-background: var(--mp-sys-color-surface-muted);
11
11
  --mp-tabs-border-color: var(--mp-sys-color-border-default);