morya-ui 0.4.0 → 0.4.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 (326) hide show
  1. package/CHANGELOG.md +70 -2
  2. package/dist/Button-BaYLh91a.js +326 -0
  3. package/dist/{Checkbox-BKt8hdhV.js → Checkbox-LxCFF19I.js} +1 -1
  4. package/dist/{DatePicker-CSoMFEvh.js → DatePicker-DGPNukEW.js} +3 -3
  5. package/dist/{Empty-iNcc0G-q.js → Empty-2_f_FgyK.js} +1 -1
  6. package/dist/{FlyoutSubmenu-C1RfFRzH.js → FlyoutSubmenu-Da6AcoM4.js} +1 -1
  7. package/dist/{Input-DQHYqvNk.js → Input-NspPDc2R.js} +2 -2
  8. package/dist/{Loading-BPpR-jGa.js → Loading-BK4dQPCS.js} +10 -10
  9. package/dist/{Pagination-BkPBWEQq.js → Pagination-tdrlaZ3u.js} +2 -2
  10. package/dist/{Popover-B_2c9NWs.js → Popover-BumMfUpV.js} +2 -2
  11. package/dist/{ProgressSpinner-B_OJG_0l.js → ProgressSpinner-BQ1tLioO.js} +1 -1
  12. package/dist/{Radio-Bxd806ys.js → Radio-BCn2OVCF.js} +1 -1
  13. package/dist/{Segmented-BRMSmXCl.js → Segmented-ppmDmku5.js} +1 -1
  14. package/dist/{Select-DzfyO0FE.js → Select-CN1tM76U.js} +8 -6
  15. package/dist/{Textarea-BBvpgIQL.js → Textarea-Ch1KCXEv.js} +2 -2
  16. package/dist/{Tooltip-BJp-ZMqQ.js → Tooltip-DKsXxU_B.js} +2 -2
  17. package/dist/accordion/style.css +39 -20
  18. package/dist/affix/style.css +39 -20
  19. package/dist/alert/index.js +2 -2
  20. package/dist/alert/style.css +39 -20
  21. package/dist/anchor/style.css +39 -20
  22. package/dist/auto-complete/index.js +3 -3
  23. package/dist/auto-complete/style.css +42 -21
  24. package/dist/avatar/style.css +39 -20
  25. package/dist/badge/index.js +29 -28
  26. package/dist/badge/style.css +39 -20
  27. package/dist/block-ui/index.js +1 -1
  28. package/dist/block-ui/style.css +39 -20
  29. package/dist/breadcrumb/index.js +1 -1
  30. package/dist/breadcrumb/style.css +39 -20
  31. package/dist/button/index.js +9 -9
  32. package/dist/button/style.css +503 -795
  33. package/dist/button/style.js +1 -0
  34. package/dist/calendar/index.js +3 -3
  35. package/dist/calendar/style.css +49 -24
  36. package/dist/card/style.css +40 -21
  37. package/dist/carousel/index.js +311 -119
  38. package/dist/carousel/style.css +987 -117
  39. package/dist/carousel/style.js +1 -1
  40. package/dist/cascade-select/index.js +4 -4
  41. package/dist/cascade-select/style.css +54 -22
  42. package/dist/checkbox/index.js +1 -1
  43. package/dist/checkbox/style.css +41 -21
  44. package/dist/chip/index.js +39 -36
  45. package/dist/chip/style.css +39 -20
  46. package/dist/command-menu/index.js +3 -3
  47. package/dist/command-menu/style.css +39 -20
  48. package/dist/component-registry.d.ts.map +1 -1
  49. package/dist/components/Badge/Badge.vue.d.ts.map +1 -1
  50. package/dist/components/Badge/types.d.ts +3 -0
  51. package/dist/components/Badge/types.d.ts.map +1 -1
  52. package/dist/components/Button/Button.vue.d.ts +15 -22
  53. package/dist/components/Button/Button.vue.d.ts.map +1 -1
  54. package/dist/components/Button/ButtonGroup.vue.d.ts +1 -1
  55. package/dist/components/Button/ButtonGroup.vue.d.ts.map +1 -1
  56. package/dist/components/Button/buttonHelpers.d.ts +25 -0
  57. package/dist/components/Button/buttonHelpers.d.ts.map +1 -0
  58. package/dist/components/Button/index.d.ts +2 -1
  59. package/dist/components/Button/index.d.ts.map +1 -1
  60. package/dist/components/Button/styles.css +463 -781
  61. package/dist/components/Button/types.d.ts +67 -61
  62. package/dist/components/Button/types.d.ts.map +1 -1
  63. package/dist/components/Card/styles.css +1 -1
  64. package/dist/components/Carousel/Carousel.vue.d.ts +41 -11
  65. package/dist/components/Carousel/Carousel.vue.d.ts.map +1 -1
  66. package/dist/components/Carousel/CarouselItem.vue.d.ts +16 -0
  67. package/dist/components/Carousel/CarouselItem.vue.d.ts.map +1 -0
  68. package/dist/components/Carousel/context.d.ts +10 -0
  69. package/dist/components/Carousel/context.d.ts.map +1 -0
  70. package/dist/components/Carousel/index.d.ts +2 -1
  71. package/dist/components/Carousel/index.d.ts.map +1 -1
  72. package/dist/components/Carousel/styles.css +250 -49
  73. package/dist/components/Carousel/types.d.ts +64 -9
  74. package/dist/components/Carousel/types.d.ts.map +1 -1
  75. package/dist/components/CascadeSelect/styles.css +12 -1
  76. package/dist/components/Checkbox/styles.css +2 -1
  77. package/dist/components/Chip/Chip.vue.d.ts.map +1 -1
  78. package/dist/components/Chip/types.d.ts +3 -0
  79. package/dist/components/Chip/types.d.ts.map +1 -1
  80. package/dist/components/ConfirmDialog/ConfirmDialog.vue.d.ts +2 -2
  81. package/dist/components/ConfirmDialog/ConfirmDialog.vue.d.ts.map +1 -1
  82. package/dist/components/ConfirmDialog/types.d.ts +2 -2
  83. package/dist/components/ConfirmDialog/types.d.ts.map +1 -1
  84. package/dist/components/ConfirmDialog/useConfirm.d.ts +1 -1
  85. package/dist/components/ConfirmDialog/useConfirm.d.ts.map +1 -1
  86. package/dist/components/ConfirmPopup/ConfirmPopup.vue.d.ts.map +1 -1
  87. package/dist/components/ConfirmPopup/types.d.ts +3 -3
  88. package/dist/components/ConfirmPopup/types.d.ts.map +1 -1
  89. package/dist/components/DatePicker/styles.css +2 -1
  90. package/dist/components/Dialog/Dialog.vue.d.ts.map +1 -1
  91. package/dist/components/Dialog/types.d.ts +3 -3
  92. package/dist/components/Dialog/types.d.ts.map +1 -1
  93. package/dist/components/Dialog/useModal.d.ts +2 -2
  94. package/dist/components/Dialog/useModal.d.ts.map +1 -1
  95. package/dist/components/Divider/Divider.vue.d.ts +1 -1
  96. package/dist/components/Divider/Divider.vue.d.ts.map +1 -1
  97. package/dist/components/Divider/types.d.ts +3 -0
  98. package/dist/components/Divider/types.d.ts.map +1 -1
  99. package/dist/components/IconField/styles.css +1 -1
  100. package/dist/components/Input/styles.css +20 -8
  101. package/dist/components/InputColor/styles.css +10 -0
  102. package/dist/components/InputNumber/styles.css +2 -1
  103. package/dist/components/InputOtp/styles.css +8 -0
  104. package/dist/components/InputPassword/styles.css +1 -1
  105. package/dist/components/InputTags/styles.css +9 -0
  106. package/dist/components/Layout/styles.css +1 -1
  107. package/dist/components/Listbox/styles.css +3 -0
  108. package/dist/components/Mentions/Mentions.vue.d.ts +1 -1
  109. package/dist/components/Mentions/styles.css +13 -4
  110. package/dist/components/Message/styles.css +4 -2
  111. package/dist/components/Page/PageFilters.vue.d.ts.map +1 -1
  112. package/dist/components/Pagination/styles.css +3 -2
  113. package/dist/components/ProgressBar/ProgressBar.vue.d.ts.map +1 -1
  114. package/dist/components/ProgressBar/types.d.ts +3 -0
  115. package/dist/components/ProgressBar/types.d.ts.map +1 -1
  116. package/dist/components/QRCode/QRCode.vue.d.ts.map +1 -1
  117. package/dist/components/Radio/styles.css +2 -1
  118. package/dist/components/Result/styles.css +1 -1
  119. package/dist/components/Select/Select.vue.d.ts +1 -1
  120. package/dist/components/Select/Select.vue.d.ts.map +1 -1
  121. package/dist/components/Select/styles.css +8 -3
  122. package/dist/components/SelectButton/styles.css +2 -0
  123. package/dist/components/SplitButton/SplitButton.vue.d.ts +0 -1
  124. package/dist/components/SplitButton/SplitButton.vue.d.ts.map +1 -1
  125. package/dist/components/SplitButton/types.d.ts +3 -3
  126. package/dist/components/SplitButton/types.d.ts.map +1 -1
  127. package/dist/components/Table/Table.vue.d.ts +4 -4
  128. package/dist/components/Table/Table.vue.d.ts.map +1 -1
  129. package/dist/components/Table/render/TableThead.vue.d.ts +2 -0
  130. package/dist/components/Table/render/TableThead.vue.d.ts.map +1 -1
  131. package/dist/components/Table/state/internal.d.ts +1 -0
  132. package/dist/components/Table/state/internal.d.ts.map +1 -1
  133. package/dist/components/Table/styles.css +9 -0
  134. package/dist/components/Tag/Tag.vue.d.ts +1 -1
  135. package/dist/components/Tag/Tag.vue.d.ts.map +1 -1
  136. package/dist/components/Tag/styles.css +10 -8
  137. package/dist/components/Tag/types.d.ts +3 -0
  138. package/dist/components/Tag/types.d.ts.map +1 -1
  139. package/dist/components/Terminal/styles.css +1 -0
  140. package/dist/components/Textarea/styles.css +18 -7
  141. package/dist/components/ToggleButton/styles.css +2 -1
  142. package/dist/components/Tour/Tour.vue.d.ts.map +1 -1
  143. package/dist/components/Tree/Tree.vue.d.ts +1 -1
  144. package/dist/components/TreeSelect/styles.css +12 -1
  145. package/dist/{config-COgrsSV2.js → config-CB_TiIvg.js} +11 -4
  146. package/dist/config-provider/index.js +141 -120
  147. package/dist/config-provider/style.css +514 -801
  148. package/dist/confirm-dialog/index.js +45 -39
  149. package/dist/confirm-dialog/style.css +496 -795
  150. package/dist/confirm-popup/index.js +17 -14
  151. package/dist/confirm-popup/style.css +496 -795
  152. package/dist/context-menu/index.js +3 -3
  153. package/dist/context-menu/style.css +39 -20
  154. package/dist/data-view/index.js +3 -3
  155. package/dist/data-view/style.css +42 -22
  156. package/dist/date-picker/index.js +1 -1
  157. package/dist/date-picker/style.css +41 -21
  158. package/dist/descriptions/index.js +1 -1
  159. package/dist/descriptions/style.css +39 -20
  160. package/dist/dialog/index.js +68 -55
  161. package/dist/dialog/style.css +496 -795
  162. package/dist/divider/index.js +25 -22
  163. package/dist/divider/style.css +39 -20
  164. package/dist/dock/style.css +39 -20
  165. package/dist/drawer/index.js +3 -3
  166. package/dist/drawer/style.css +39 -20
  167. package/dist/dropdown/index.js +4 -4
  168. package/dist/dropdown/style.css +39 -20
  169. package/dist/empty/index.js +1 -1
  170. package/dist/empty/style.css +39 -20
  171. package/dist/fieldset/style.css +39 -20
  172. package/dist/file-upload/index.js +1 -1
  173. package/dist/file-upload/style.css +39 -20
  174. package/dist/flex/index.js +8 -8
  175. package/dist/flex/style.css +39 -20
  176. package/dist/float-label/style.css +39 -20
  177. package/dist/fluid/style.css +39 -20
  178. package/dist/form/index.js +1 -1
  179. package/dist/form/style.css +39 -20
  180. package/dist/gallery/index.js +1 -1
  181. package/dist/gallery/style.css +39 -20
  182. package/dist/grid/index.js +5 -5
  183. package/dist/grid/style.css +39 -20
  184. package/dist/icon/style.css +39 -20
  185. package/dist/icon-field/style.css +60 -29
  186. package/dist/image/index.js +1 -1
  187. package/dist/image/style.css +39 -20
  188. package/dist/index.d.ts +3 -2
  189. package/dist/index.d.ts.map +1 -1
  190. package/dist/index.js +6500 -6163
  191. package/dist/inplace/style.css +39 -20
  192. package/dist/input/index.js +1 -1
  193. package/dist/input/style.css +59 -28
  194. package/dist/input-color/index.js +2 -2
  195. package/dist/input-color/style.css +49 -20
  196. package/dist/input-group/style.css +39 -20
  197. package/dist/input-number/index.js +2 -2
  198. package/dist/input-number/style.css +41 -21
  199. package/dist/input-otp/index.js +2 -2
  200. package/dist/input-otp/style.css +47 -20
  201. package/dist/input-password/index.js +2 -2
  202. package/dist/input-password/style.css +40 -21
  203. package/dist/input-tags/index.js +2 -2
  204. package/dist/input-tags/style.css +48 -20
  205. package/dist/knob/style.css +39 -20
  206. package/dist/label/style.css +39 -20
  207. package/dist/layout/index.js +1 -1
  208. package/dist/layout/style.css +40 -21
  209. package/dist/list/index.js +4 -4
  210. package/dist/list/style.css +42 -22
  211. package/dist/listbox/index.js +2 -2
  212. package/dist/listbox/style.css +42 -20
  213. package/dist/loading/index.js +1 -1
  214. package/dist/loading/style.css +39 -20
  215. package/dist/locale-CR2PIaxt.js +21 -0
  216. package/dist/mega-menu/index.js +3 -3
  217. package/dist/mega-menu/style.css +39 -20
  218. package/dist/mentions/index.js +3 -3
  219. package/dist/mentions/style.css +52 -24
  220. package/dist/menu/index.js +4 -4
  221. package/dist/menu/style.css +39 -20
  222. package/dist/menubar/index.js +3 -3
  223. package/dist/menubar/style.css +39 -20
  224. package/dist/message/index.js +3 -3
  225. package/dist/message/style.css +43 -22
  226. package/dist/meter-group/style.css +39 -20
  227. package/dist/order-list/index.js +1 -1
  228. package/dist/order-list/style.css +39 -20
  229. package/dist/page/index.js +4 -7
  230. package/dist/page/style.css +497 -796
  231. package/dist/pagination/index.js +1 -1
  232. package/dist/pagination/style.css +50 -25
  233. package/dist/panel/index.js +1 -1
  234. package/dist/panel/style.css +39 -20
  235. package/dist/pick-list/index.js +1 -1
  236. package/dist/pick-list/style.css +39 -20
  237. package/dist/popover/index.js +1 -1
  238. package/dist/popover/style.css +39 -20
  239. package/dist/progress-bar/index.js +38 -35
  240. package/dist/progress-bar/style.css +39 -20
  241. package/dist/progress-spinner/index.js +1 -1
  242. package/dist/progress-spinner/style.css +39 -20
  243. package/dist/qr-code/index.js +3 -3
  244. package/dist/qr-code/style.css +496 -795
  245. package/dist/radio/index.js +1 -1
  246. package/dist/radio/style.css +41 -21
  247. package/dist/rating/index.js +2 -2
  248. package/dist/rating/style.css +39 -20
  249. package/dist/resolver-map.d.ts.map +1 -1
  250. package/dist/resolver.js +1 -0
  251. package/dist/result/index.js +1 -1
  252. package/dist/result/style.css +40 -21
  253. package/dist/scroll-top/index.js +2 -2
  254. package/dist/scroll-top/style.css +39 -20
  255. package/dist/scrollbar/style.css +39 -20
  256. package/dist/segmented/index.js +1 -1
  257. package/dist/segmented/style.css +39 -20
  258. package/dist/select/index.js +1 -1
  259. package/dist/select/style.css +50 -24
  260. package/dist/select-button/index.js +1 -1
  261. package/dist/select-button/style.css +41 -20
  262. package/dist/shared/componentDefaults.d.ts +6 -0
  263. package/dist/shared/componentDefaults.d.ts.map +1 -1
  264. package/dist/shared/styles/select-overlay.css +3 -1
  265. package/dist/sidebar/index.js +1 -1
  266. package/dist/sidebar/style.css +39 -20
  267. package/dist/skeleton/style.css +39 -20
  268. package/dist/slider/index.js +2 -2
  269. package/dist/slider/style.css +39 -20
  270. package/dist/space/index.js +8 -8
  271. package/dist/space/style.css +39 -20
  272. package/dist/speed-dial/index.js +3 -3
  273. package/dist/speed-dial/style.css +39 -20
  274. package/dist/split-button/index.js +7 -10
  275. package/dist/split-button/style.css +502 -801
  276. package/dist/splitter/index.js +1 -1
  277. package/dist/splitter/style.css +39 -20
  278. package/dist/statistic/style.css +39 -20
  279. package/dist/status/index.js +1 -1
  280. package/dist/status/style.css +39 -20
  281. package/dist/stepper/style.css +39 -20
  282. package/dist/styles/base.css +19 -7
  283. package/dist/styles.css +1 -1
  284. package/dist/switch/index.js +1 -1
  285. package/dist/switch/style.css +39 -20
  286. package/dist/table/index.js +1628 -1622
  287. package/dist/table/style.css +51 -22
  288. package/dist/tabs/index.js +1 -1
  289. package/dist/tabs/style.css +39 -20
  290. package/dist/tag/index.js +57 -54
  291. package/dist/tag/style.css +49 -28
  292. package/dist/terminal/index.js +1 -1
  293. package/dist/terminal/style.css +40 -20
  294. package/dist/textarea/index.js +1 -1
  295. package/dist/textarea/style.css +57 -27
  296. package/dist/theme/color.d.ts +5 -0
  297. package/dist/theme/color.d.ts.map +1 -1
  298. package/dist/theme/derive.d.ts.map +1 -1
  299. package/dist/theme/seed.d.ts +2 -2
  300. package/dist/theme/styles.css +20 -13
  301. package/dist/tiered-menu/index.js +3 -3
  302. package/dist/tiered-menu/style.css +39 -20
  303. package/dist/time-picker/index.js +1 -1
  304. package/dist/time-picker/style.css +41 -21
  305. package/dist/timeline/style.css +39 -20
  306. package/dist/toast/index.js +3 -3
  307. package/dist/toast/style.css +496 -795
  308. package/dist/toggle-button/index.js +1 -1
  309. package/dist/toggle-button/style.css +41 -21
  310. package/dist/toolbar/style.css +39 -20
  311. package/dist/tooltip/index.js +1 -1
  312. package/dist/tooltip/style.css +39 -20
  313. package/dist/tour/index.js +7 -8
  314. package/dist/tour/style.css +496 -795
  315. package/dist/tree/index.js +2 -2
  316. package/dist/tree/style.css +41 -21
  317. package/dist/tree-select/index.js +4 -4
  318. package/dist/tree-select/style.css +56 -23
  319. package/dist/typography/index.js +2 -2
  320. package/dist/typography/style.css +57 -27
  321. package/dist/{useMotionTransition-S2rlviyZ.js → useMotionTransition-D8JOR3ih.js} +1 -1
  322. package/dist/virtual-scroller/style.css +39 -20
  323. package/dist/watermark/style.css +39 -20
  324. package/package.json +1 -1
  325. package/dist/Button-TaJ0LKtP.js +0 -234
  326. package/dist/locale-Dnk0UIie.js +0 -21
package/dist/input-number/style.css CHANGED
@@ -9,6 +9,10 @@
9
9
  --m-color-border: #d9d9d9;
10
10
  --m-color-split: #f0f0f0;
11
11
  --m-color-focus-ring: #1677ff;
12
+ /* Soft translucent control-outline ring (primary bg composited over container) */
13
+ --m-color-control-outline: rgba(5, 145, 255, 0.1);
14
+ --m-color-control-outline-danger: rgba(255, 38, 5, 0.06);
15
+ --m-color-control-outline-warning: rgba(255, 215, 5, 0.1);
12
16
  /* Control sizing: medium control height 32px */
13
17
  --m-control-height-small: 24px;
14
18
  --m-control-height-medium: 32px;
@@ -22,12 +26,12 @@
22
26
 
23
27
  --m-radius-control: 6px;
24
28
  --m-border-width: 1px;
25
- --m-focus-shadow: 0 0 0 2px
26
- color-mix(in srgb, var(--m-color-primary) 45%, transparent);
27
- --m-focus-shadow-danger: 0 0 0 2px
28
- color-mix(in srgb, var(--m-color-danger) 45%, transparent);
29
- --m-focus-shadow-warning: 0 0 0 2px
30
- color-mix(in srgb, var(--m-color-warning) 45%, transparent);
29
+ --m-focus-outline-width: 2px;
30
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
31
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
32
+ var(--m-color-control-outline-danger);
33
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
34
+ var(--m-color-control-outline-warning);
31
35
  --m-color-success: #52c41a;
32
36
  --m-color-info: #1677ff;
33
37
  --m-color-warning: #faad14;
@@ -253,7 +257,7 @@
253
257
  animation-play-state: paused !important;
254
258
  }
255
259
 
256
- /* Global density: scales spacing + control heights (Vuetify-inspired, WD tokens) */
260
+ /* Global density: scales spacing + control heights (WD tokens) */
257
261
  :root,
258
262
  [data-m-density="comfortable"] {
259
263
  --m-density-scale: 1;
@@ -348,12 +352,15 @@
348
352
  --m-color-border: #424242;
349
353
  --m-color-split: #303030;
350
354
  --m-color-focus-ring: #3c89e8;
351
- --m-focus-shadow: 0 0 0 2px
352
- color-mix(in srgb, var(--m-color-primary) 50%, transparent);
353
- --m-focus-shadow-danger: 0 0 0 2px
354
- color-mix(in srgb, var(--m-color-danger) 50%, transparent);
355
- --m-focus-shadow-warning: 0 0 0 2px
356
- color-mix(in srgb, var(--m-color-warning) 50%, transparent);
355
+ /* Dark: getAlphaColor(color*Bg, colorBgContainer) */
356
+ --m-color-control-outline: rgba(23, 117, 249, 0.31);
357
+ --m-color-control-outline-danger: rgba(249, 75, 78, 0.31);
358
+ --m-color-control-outline-warning: rgba(250, 173, 20, 0.3);
359
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
360
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
361
+ var(--m-color-control-outline-danger);
362
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
363
+ var(--m-color-control-outline-warning);
357
364
  /* Mid solids: keep ≥~4.5:1 with --m-color-on-emphasis on dark surfaces */
358
365
  --m-color-success: #49aa19;
359
366
  --m-color-info: #1668dc;
@@ -893,8 +900,10 @@
893
900
  width: 100%;
894
901
  }
895
902
 
903
+ .m-textarea--invalid:focus,
896
904
  .m-textarea--invalid:focus-visible,
897
905
  .m-select--invalid.m-select--open,
906
+ .m-select--invalid:focus,
898
907
  .m-select--invalid:focus-visible {
899
908
  border-color: var(--m-color-danger);
900
909
  box-shadow: var(--m-focus-shadow-danger);
@@ -1103,20 +1112,28 @@
1103
1112
  opacity: var(--m-opacity-disabled);
1104
1113
  }
1105
1114
 
1106
- /* Shared Naive-like hover/focus for remaining form triggers */
1115
+ /* Shared hover/focus for remaining form triggers */
1107
1116
  .m-inputotp__input:hover:not(:disabled):not(:focus),
1108
- .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
1109
- .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
1117
+ .m-cascadeselect:not(.m-cascadeselect--open)
1118
+ .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1119
+ .m-treeselect:not(.m-treeselect--open)
1120
+ .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1110
1121
  .m-inputcolor__text:hover:not(:disabled):not(:focus),
1111
- .m-inputtags:hover:not(.m-inputtags--disabled),
1112
- .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked),
1113
- .m-inplace__display:hover {
1122
+ .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
1123
+ .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
1124
+ .m-inplace__display:hover:not(:focus-visible) {
1114
1125
  border-color: var(--m-color-primary-hover);
1115
1126
  }
1116
1127
 
1128
+ .m-inputotp__input:focus,
1117
1129
  .m-inputotp__input:focus-visible,
1130
+ .m-cascadeselect--open .m-cascadeselect__trigger,
1131
+ .m-cascadeselect__trigger:focus,
1118
1132
  .m-cascadeselect__trigger:focus-visible,
1133
+ .m-treeselect--open .m-treeselect__trigger,
1134
+ .m-treeselect__trigger:focus,
1119
1135
  .m-treeselect__trigger:focus-visible,
1136
+ .m-inputcolor__text:focus,
1120
1137
  .m-inputcolor__text:focus-visible,
1121
1138
  .m-inputtags:focus-within,
1122
1139
  .m-togglebutton:focus-visible,
@@ -1125,13 +1142,15 @@
1125
1142
  .m-splitbutton__trigger:focus-visible,
1126
1143
  .m-inplace__display:focus-visible,
1127
1144
  .m-pagination__button:focus-visible {
1128
- border-color: var(--m-color-primary-hover);
1145
+ border-color: var(--m-color-primary);
1129
1146
  box-shadow: var(--m-focus-shadow);
1130
1147
  outline: none;
1131
1148
  }
1132
1149
 
1150
+ .m-inputotp--invalid .m-inputotp__input:focus,
1133
1151
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
1134
1152
  .m-inputtags--invalid:focus-within,
1153
+ .m-inputcolor--invalid .m-inputcolor__text:focus,
1135
1154
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
1136
1155
  border-color: var(--m-color-danger);
1137
1156
  box-shadow: var(--m-focus-shadow-danger);
@@ -1302,7 +1321,7 @@
1302
1321
  }
1303
1322
 
1304
1323
  .m-inputnumber__input-wrap:focus-within {
1305
- border-color: var(--m-color-primary-hover);
1324
+ border-color: var(--m-color-primary);
1306
1325
  box-shadow: var(--m-focus-shadow);
1307
1326
  }
1308
1327
 
@@ -1311,6 +1330,7 @@
1311
1330
  }
1312
1331
 
1313
1332
  .m-inputnumber--invalid .m-inputnumber__input-wrap:focus-within {
1333
+ border-color: var(--m-color-danger);
1314
1334
  box-shadow: var(--m-focus-shadow-danger);
1315
1335
  }
1316
1336
 
package/dist/input-otp/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { a as e } from "../useComponentAttrs-e-5QAjdw.js";
2
- import { o as t } from "../config-COgrsSV2.js";
3
- import { n, t as r } from "../locale-Dnk0UIie.js";
2
+ import { o as t } from "../config-CB_TiIvg.js";
3
+ import { n, t as r } from "../locale-CR2PIaxt.js";
4
4
  import "./style.js";
5
5
  import { Fragment as i, computed as a, createElementBlock as o, defineComponent as s, mergeProps as c, nextTick as l, openBlock as u, ref as d, renderList as f, unref as p, useAttrs as m, watch as h } from "vue";
6
6
  //#region src/components/InputOtp/InputOtp.vue?vue&type=script&setup=true&lang.ts
package/dist/input-otp/style.css CHANGED
@@ -9,6 +9,10 @@
9
9
  --m-color-border: #d9d9d9;
10
10
  --m-color-split: #f0f0f0;
11
11
  --m-color-focus-ring: #1677ff;
12
+ /* Soft translucent control-outline ring (primary bg composited over container) */
13
+ --m-color-control-outline: rgba(5, 145, 255, 0.1);
14
+ --m-color-control-outline-danger: rgba(255, 38, 5, 0.06);
15
+ --m-color-control-outline-warning: rgba(255, 215, 5, 0.1);
12
16
  /* Control sizing: medium control height 32px */
13
17
  --m-control-height-small: 24px;
14
18
  --m-control-height-medium: 32px;
@@ -22,12 +26,12 @@
22
26
 
23
27
  --m-radius-control: 6px;
24
28
  --m-border-width: 1px;
25
- --m-focus-shadow: 0 0 0 2px
26
- color-mix(in srgb, var(--m-color-primary) 45%, transparent);
27
- --m-focus-shadow-danger: 0 0 0 2px
28
- color-mix(in srgb, var(--m-color-danger) 45%, transparent);
29
- --m-focus-shadow-warning: 0 0 0 2px
30
- color-mix(in srgb, var(--m-color-warning) 45%, transparent);
29
+ --m-focus-outline-width: 2px;
30
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
31
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
32
+ var(--m-color-control-outline-danger);
33
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
34
+ var(--m-color-control-outline-warning);
31
35
  --m-color-success: #52c41a;
32
36
  --m-color-info: #1677ff;
33
37
  --m-color-warning: #faad14;
@@ -253,7 +257,7 @@
253
257
  animation-play-state: paused !important;
254
258
  }
255
259
 
256
- /* Global density: scales spacing + control heights (Vuetify-inspired, WD tokens) */
260
+ /* Global density: scales spacing + control heights (WD tokens) */
257
261
  :root,
258
262
  [data-m-density="comfortable"] {
259
263
  --m-density-scale: 1;
@@ -348,12 +352,15 @@
348
352
  --m-color-border: #424242;
349
353
  --m-color-split: #303030;
350
354
  --m-color-focus-ring: #3c89e8;
351
- --m-focus-shadow: 0 0 0 2px
352
- color-mix(in srgb, var(--m-color-primary) 50%, transparent);
353
- --m-focus-shadow-danger: 0 0 0 2px
354
- color-mix(in srgb, var(--m-color-danger) 50%, transparent);
355
- --m-focus-shadow-warning: 0 0 0 2px
356
- color-mix(in srgb, var(--m-color-warning) 50%, transparent);
355
+ /* Dark: getAlphaColor(color*Bg, colorBgContainer) */
356
+ --m-color-control-outline: rgba(23, 117, 249, 0.31);
357
+ --m-color-control-outline-danger: rgba(249, 75, 78, 0.31);
358
+ --m-color-control-outline-warning: rgba(250, 173, 20, 0.3);
359
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
360
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
361
+ var(--m-color-control-outline-danger);
362
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
363
+ var(--m-color-control-outline-warning);
357
364
  /* Mid solids: keep ≥~4.5:1 with --m-color-on-emphasis on dark surfaces */
358
365
  --m-color-success: #49aa19;
359
366
  --m-color-info: #1668dc;
@@ -893,8 +900,10 @@
893
900
  width: 100%;
894
901
  }
895
902
 
903
+ .m-textarea--invalid:focus,
896
904
  .m-textarea--invalid:focus-visible,
897
905
  .m-select--invalid.m-select--open,
906
+ .m-select--invalid:focus,
898
907
  .m-select--invalid:focus-visible {
899
908
  border-color: var(--m-color-danger);
900
909
  box-shadow: var(--m-focus-shadow-danger);
@@ -1103,20 +1112,28 @@
1103
1112
  opacity: var(--m-opacity-disabled);
1104
1113
  }
1105
1114
 
1106
- /* Shared Naive-like hover/focus for remaining form triggers */
1115
+ /* Shared hover/focus for remaining form triggers */
1107
1116
  .m-inputotp__input:hover:not(:disabled):not(:focus),
1108
- .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
1109
- .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
1117
+ .m-cascadeselect:not(.m-cascadeselect--open)
1118
+ .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1119
+ .m-treeselect:not(.m-treeselect--open)
1120
+ .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1110
1121
  .m-inputcolor__text:hover:not(:disabled):not(:focus),
1111
- .m-inputtags:hover:not(.m-inputtags--disabled),
1112
- .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked),
1113
- .m-inplace__display:hover {
1122
+ .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
1123
+ .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
1124
+ .m-inplace__display:hover:not(:focus-visible) {
1114
1125
  border-color: var(--m-color-primary-hover);
1115
1126
  }
1116
1127
 
1128
+ .m-inputotp__input:focus,
1117
1129
  .m-inputotp__input:focus-visible,
1130
+ .m-cascadeselect--open .m-cascadeselect__trigger,
1131
+ .m-cascadeselect__trigger:focus,
1118
1132
  .m-cascadeselect__trigger:focus-visible,
1133
+ .m-treeselect--open .m-treeselect__trigger,
1134
+ .m-treeselect__trigger:focus,
1119
1135
  .m-treeselect__trigger:focus-visible,
1136
+ .m-inputcolor__text:focus,
1120
1137
  .m-inputcolor__text:focus-visible,
1121
1138
  .m-inputtags:focus-within,
1122
1139
  .m-togglebutton:focus-visible,
@@ -1125,13 +1142,15 @@
1125
1142
  .m-splitbutton__trigger:focus-visible,
1126
1143
  .m-inplace__display:focus-visible,
1127
1144
  .m-pagination__button:focus-visible {
1128
- border-color: var(--m-color-primary-hover);
1145
+ border-color: var(--m-color-primary);
1129
1146
  box-shadow: var(--m-focus-shadow);
1130
1147
  outline: none;
1131
1148
  }
1132
1149
 
1150
+ .m-inputotp--invalid .m-inputotp__input:focus,
1133
1151
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
1134
1152
  .m-inputtags--invalid:focus-within,
1153
+ .m-inputcolor--invalid .m-inputcolor__text:focus,
1135
1154
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
1136
1155
  border-color: var(--m-color-danger);
1137
1156
  box-shadow: var(--m-focus-shadow-danger);
@@ -1232,6 +1251,14 @@
1232
1251
  border-color: var(--m-color-danger);
1233
1252
  }
1234
1253
 
1254
+ .m-inputotp__input:focus,
1255
+ .m-inputotp__input:focus-visible {
1256
+ border-color: var(--m-color-primary);
1257
+ box-shadow: var(--m-focus-shadow);
1258
+ outline: none;
1259
+ }
1260
+
1261
+ .m-inputotp--invalid .m-inputotp__input:focus,
1235
1262
  .m-inputotp--invalid .m-inputotp__input:focus-visible {
1236
1263
  border-color: var(--m-color-danger);
1237
1264
  box-shadow: var(--m-focus-shadow-danger);
package/dist/input-password/index.js CHANGED
@@ -3,8 +3,8 @@ import { t } from "../useMId-BXFYayPP.js";
3
3
  import { r as ee } from "../types-DGuu4Eg4.js";
4
4
  import { t as n } from "../Icon-od9Ob-Ay.js";
5
5
  import { n as r } from "../context-CIx8fy-I.js";
6
- import { i, o as a, s as o } from "../config-COgrsSV2.js";
7
- import { n as s, t as te } from "../locale-Dnk0UIie.js";
6
+ import { i, o as a, s as o } from "../config-CB_TiIvg.js";
7
+ import { n as s, t as te } from "../locale-CR2PIaxt.js";
8
8
  import "./style.js";
9
9
  import { computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createVNode as p, defineComponent as m, inject as ne, mergeProps as h, normalizeClass as g, onBeforeUnmount as re, openBlock as _, ref as v, renderSlot as y, resolveDynamicComponent as b, toDisplayString as x, unref as S, useAttrs as C } from "vue";
10
10
  //#region src/components/InputPassword/InputPassword.vue?vue&type=script&setup=true&lang.ts
package/dist/input-password/style.css CHANGED
@@ -9,6 +9,10 @@
9
9
  --m-color-border: #d9d9d9;
10
10
  --m-color-split: #f0f0f0;
11
11
  --m-color-focus-ring: #1677ff;
12
+ /* Soft translucent control-outline ring (primary bg composited over container) */
13
+ --m-color-control-outline: rgba(5, 145, 255, 0.1);
14
+ --m-color-control-outline-danger: rgba(255, 38, 5, 0.06);
15
+ --m-color-control-outline-warning: rgba(255, 215, 5, 0.1);
12
16
  /* Control sizing: medium control height 32px */
13
17
  --m-control-height-small: 24px;
14
18
  --m-control-height-medium: 32px;
@@ -22,12 +26,12 @@
22
26
 
23
27
  --m-radius-control: 6px;
24
28
  --m-border-width: 1px;
25
- --m-focus-shadow: 0 0 0 2px
26
- color-mix(in srgb, var(--m-color-primary) 45%, transparent);
27
- --m-focus-shadow-danger: 0 0 0 2px
28
- color-mix(in srgb, var(--m-color-danger) 45%, transparent);
29
- --m-focus-shadow-warning: 0 0 0 2px
30
- color-mix(in srgb, var(--m-color-warning) 45%, transparent);
29
+ --m-focus-outline-width: 2px;
30
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
31
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
32
+ var(--m-color-control-outline-danger);
33
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
34
+ var(--m-color-control-outline-warning);
31
35
  --m-color-success: #52c41a;
32
36
  --m-color-info: #1677ff;
33
37
  --m-color-warning: #faad14;
@@ -253,7 +257,7 @@
253
257
  animation-play-state: paused !important;
254
258
  }
255
259
 
256
- /* Global density: scales spacing + control heights (Vuetify-inspired, WD tokens) */
260
+ /* Global density: scales spacing + control heights (WD tokens) */
257
261
  :root,
258
262
  [data-m-density="comfortable"] {
259
263
  --m-density-scale: 1;
@@ -348,12 +352,15 @@
348
352
  --m-color-border: #424242;
349
353
  --m-color-split: #303030;
350
354
  --m-color-focus-ring: #3c89e8;
351
- --m-focus-shadow: 0 0 0 2px
352
- color-mix(in srgb, var(--m-color-primary) 50%, transparent);
353
- --m-focus-shadow-danger: 0 0 0 2px
354
- color-mix(in srgb, var(--m-color-danger) 50%, transparent);
355
- --m-focus-shadow-warning: 0 0 0 2px
356
- color-mix(in srgb, var(--m-color-warning) 50%, transparent);
355
+ /* Dark: getAlphaColor(color*Bg, colorBgContainer) */
356
+ --m-color-control-outline: rgba(23, 117, 249, 0.31);
357
+ --m-color-control-outline-danger: rgba(249, 75, 78, 0.31);
358
+ --m-color-control-outline-warning: rgba(250, 173, 20, 0.3);
359
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
360
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
361
+ var(--m-color-control-outline-danger);
362
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
363
+ var(--m-color-control-outline-warning);
357
364
  /* Mid solids: keep ≥~4.5:1 with --m-color-on-emphasis on dark surfaces */
358
365
  --m-color-success: #49aa19;
359
366
  --m-color-info: #1668dc;
@@ -893,8 +900,10 @@
893
900
  width: 100%;
894
901
  }
895
902
 
903
+ .m-textarea--invalid:focus,
896
904
  .m-textarea--invalid:focus-visible,
897
905
  .m-select--invalid.m-select--open,
906
+ .m-select--invalid:focus,
898
907
  .m-select--invalid:focus-visible {
899
908
  border-color: var(--m-color-danger);
900
909
  box-shadow: var(--m-focus-shadow-danger);
@@ -1103,20 +1112,28 @@
1103
1112
  opacity: var(--m-opacity-disabled);
1104
1113
  }
1105
1114
 
1106
- /* Shared Naive-like hover/focus for remaining form triggers */
1115
+ /* Shared hover/focus for remaining form triggers */
1107
1116
  .m-inputotp__input:hover:not(:disabled):not(:focus),
1108
- .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
1109
- .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
1117
+ .m-cascadeselect:not(.m-cascadeselect--open)
1118
+ .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1119
+ .m-treeselect:not(.m-treeselect--open)
1120
+ .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1110
1121
  .m-inputcolor__text:hover:not(:disabled):not(:focus),
1111
- .m-inputtags:hover:not(.m-inputtags--disabled),
1112
- .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked),
1113
- .m-inplace__display:hover {
1122
+ .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
1123
+ .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
1124
+ .m-inplace__display:hover:not(:focus-visible) {
1114
1125
  border-color: var(--m-color-primary-hover);
1115
1126
  }
1116
1127
 
1128
+ .m-inputotp__input:focus,
1117
1129
  .m-inputotp__input:focus-visible,
1130
+ .m-cascadeselect--open .m-cascadeselect__trigger,
1131
+ .m-cascadeselect__trigger:focus,
1118
1132
  .m-cascadeselect__trigger:focus-visible,
1133
+ .m-treeselect--open .m-treeselect__trigger,
1134
+ .m-treeselect__trigger:focus,
1119
1135
  .m-treeselect__trigger:focus-visible,
1136
+ .m-inputcolor__text:focus,
1120
1137
  .m-inputcolor__text:focus-visible,
1121
1138
  .m-inputtags:focus-within,
1122
1139
  .m-togglebutton:focus-visible,
@@ -1125,13 +1142,15 @@
1125
1142
  .m-splitbutton__trigger:focus-visible,
1126
1143
  .m-inplace__display:focus-visible,
1127
1144
  .m-pagination__button:focus-visible {
1128
- border-color: var(--m-color-primary-hover);
1145
+ border-color: var(--m-color-primary);
1129
1146
  box-shadow: var(--m-focus-shadow);
1130
1147
  outline: none;
1131
1148
  }
1132
1149
 
1150
+ .m-inputotp--invalid .m-inputotp__input:focus,
1133
1151
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
1134
1152
  .m-inputtags--invalid:focus-within,
1153
+ .m-inputcolor--invalid .m-inputcolor__text:focus,
1135
1154
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
1136
1155
  border-color: var(--m-color-danger);
1137
1156
  box-shadow: var(--m-focus-shadow-danger);
@@ -1430,7 +1449,7 @@
1430
1449
  }
1431
1450
 
1432
1451
  .m-password:focus-within {
1433
- border-color: var(--m-color-primary-hover);
1452
+ border-color: var(--m-color-primary);
1434
1453
  box-shadow: var(--m-focus-shadow);
1435
1454
  }
1436
1455
 
package/dist/input-tags/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { i as e } from "../useComponentAttrs-e-5QAjdw.js";
2
2
  import { t } from "../useMId-BXFYayPP.js";
3
3
  import { t as n } from "../Icon-od9Ob-Ay.js";
4
- import { o as r } from "../config-COgrsSV2.js";
5
- import { n as i } from "../locale-Dnk0UIie.js";
4
+ import { o as r } from "../config-CB_TiIvg.js";
5
+ import { n as i } from "../locale-CR2PIaxt.js";
6
6
  import "./style.js";
7
7
  import { Fragment as a, computed as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeProps as p, normalizeClass as m, openBlock as h, ref as g, renderList as _, renderSlot as v, toDisplayString as y, unref as b, useAttrs as x } from "vue";
8
8
  //#region src/components/InputTags/InputTags.vue?vue&type=script&setup=true&lang.ts
package/dist/input-tags/style.css CHANGED
@@ -9,6 +9,10 @@
9
9
  --m-color-border: #d9d9d9;
10
10
  --m-color-split: #f0f0f0;
11
11
  --m-color-focus-ring: #1677ff;
12
+ /* Soft translucent control-outline ring (primary bg composited over container) */
13
+ --m-color-control-outline: rgba(5, 145, 255, 0.1);
14
+ --m-color-control-outline-danger: rgba(255, 38, 5, 0.06);
15
+ --m-color-control-outline-warning: rgba(255, 215, 5, 0.1);
12
16
  /* Control sizing: medium control height 32px */
13
17
  --m-control-height-small: 24px;
14
18
  --m-control-height-medium: 32px;
@@ -22,12 +26,12 @@
22
26
 
23
27
  --m-radius-control: 6px;
24
28
  --m-border-width: 1px;
25
- --m-focus-shadow: 0 0 0 2px
26
- color-mix(in srgb, var(--m-color-primary) 45%, transparent);
27
- --m-focus-shadow-danger: 0 0 0 2px
28
- color-mix(in srgb, var(--m-color-danger) 45%, transparent);
29
- --m-focus-shadow-warning: 0 0 0 2px
30
- color-mix(in srgb, var(--m-color-warning) 45%, transparent);
29
+ --m-focus-outline-width: 2px;
30
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
31
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
32
+ var(--m-color-control-outline-danger);
33
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
34
+ var(--m-color-control-outline-warning);
31
35
  --m-color-success: #52c41a;
32
36
  --m-color-info: #1677ff;
33
37
  --m-color-warning: #faad14;
@@ -253,7 +257,7 @@
253
257
  animation-play-state: paused !important;
254
258
  }
255
259
 
256
- /* Global density: scales spacing + control heights (Vuetify-inspired, WD tokens) */
260
+ /* Global density: scales spacing + control heights (WD tokens) */
257
261
  :root,
258
262
  [data-m-density="comfortable"] {
259
263
  --m-density-scale: 1;
@@ -348,12 +352,15 @@
348
352
  --m-color-border: #424242;
349
353
  --m-color-split: #303030;
350
354
  --m-color-focus-ring: #3c89e8;
351
- --m-focus-shadow: 0 0 0 2px
352
- color-mix(in srgb, var(--m-color-primary) 50%, transparent);
353
- --m-focus-shadow-danger: 0 0 0 2px
354
- color-mix(in srgb, var(--m-color-danger) 50%, transparent);
355
- --m-focus-shadow-warning: 0 0 0 2px
356
- color-mix(in srgb, var(--m-color-warning) 50%, transparent);
355
+ /* Dark: getAlphaColor(color*Bg, colorBgContainer) */
356
+ --m-color-control-outline: rgba(23, 117, 249, 0.31);
357
+ --m-color-control-outline-danger: rgba(249, 75, 78, 0.31);
358
+ --m-color-control-outline-warning: rgba(250, 173, 20, 0.3);
359
+ --m-focus-shadow: 0 0 0 var(--m-focus-outline-width) var(--m-color-control-outline);
360
+ --m-focus-shadow-danger: 0 0 0 var(--m-focus-outline-width)
361
+ var(--m-color-control-outline-danger);
362
+ --m-focus-shadow-warning: 0 0 0 var(--m-focus-outline-width)
363
+ var(--m-color-control-outline-warning);
357
364
  /* Mid solids: keep ≥~4.5:1 with --m-color-on-emphasis on dark surfaces */
358
365
  --m-color-success: #49aa19;
359
366
  --m-color-info: #1668dc;
@@ -893,8 +900,10 @@
893
900
  width: 100%;
894
901
  }
895
902
 
903
+ .m-textarea--invalid:focus,
896
904
  .m-textarea--invalid:focus-visible,
897
905
  .m-select--invalid.m-select--open,
906
+ .m-select--invalid:focus,
898
907
  .m-select--invalid:focus-visible {
899
908
  border-color: var(--m-color-danger);
900
909
  box-shadow: var(--m-focus-shadow-danger);
@@ -1103,20 +1112,28 @@
1103
1112
  opacity: var(--m-opacity-disabled);
1104
1113
  }
1105
1114
 
1106
- /* Shared Naive-like hover/focus for remaining form triggers */
1115
+ /* Shared hover/focus for remaining form triggers */
1107
1116
  .m-inputotp__input:hover:not(:disabled):not(:focus),
1108
- .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
1109
- .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
1117
+ .m-cascadeselect:not(.m-cascadeselect--open)
1118
+ .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1119
+ .m-treeselect:not(.m-treeselect--open)
1120
+ .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
1110
1121
  .m-inputcolor__text:hover:not(:disabled):not(:focus),
1111
- .m-inputtags:hover:not(.m-inputtags--disabled),
1112
- .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked),
1113
- .m-inplace__display:hover {
1122
+ .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
1123
+ .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
1124
+ .m-inplace__display:hover:not(:focus-visible) {
1114
1125
  border-color: var(--m-color-primary-hover);
1115
1126
  }
1116
1127
 
1128
+ .m-inputotp__input:focus,
1117
1129
  .m-inputotp__input:focus-visible,
1130
+ .m-cascadeselect--open .m-cascadeselect__trigger,
1131
+ .m-cascadeselect__trigger:focus,
1118
1132
  .m-cascadeselect__trigger:focus-visible,
1133
+ .m-treeselect--open .m-treeselect__trigger,
1134
+ .m-treeselect__trigger:focus,
1119
1135
  .m-treeselect__trigger:focus-visible,
1136
+ .m-inputcolor__text:focus,
1120
1137
  .m-inputcolor__text:focus-visible,
1121
1138
  .m-inputtags:focus-within,
1122
1139
  .m-togglebutton:focus-visible,
@@ -1125,13 +1142,15 @@
1125
1142
  .m-splitbutton__trigger:focus-visible,
1126
1143
  .m-inplace__display:focus-visible,
1127
1144
  .m-pagination__button:focus-visible {
1128
- border-color: var(--m-color-primary-hover);
1145
+ border-color: var(--m-color-primary);
1129
1146
  box-shadow: var(--m-focus-shadow);
1130
1147
  outline: none;
1131
1148
  }
1132
1149
 
1150
+ .m-inputotp--invalid .m-inputotp__input:focus,
1133
1151
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
1134
1152
  .m-inputtags--invalid:focus-within,
1153
+ .m-inputcolor--invalid .m-inputcolor__text:focus,
1135
1154
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
1136
1155
  border-color: var(--m-color-danger);
1137
1156
  box-shadow: var(--m-focus-shadow-danger);
@@ -1285,6 +1304,15 @@
1285
1304
  padding-inline: var(--m-control-padding-x-large);
1286
1305
  }
1287
1306
 
1307
+ .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within) {
1308
+ border-color: var(--m-color-primary-hover);
1309
+ }
1310
+
1311
+ .m-inputtags:focus-within {
1312
+ border-color: var(--m-color-primary);
1313
+ box-shadow: var(--m-focus-shadow);
1314
+ }
1315
+
1288
1316
  .m-inputtags--invalid {
1289
1317
  border-color: var(--m-color-danger);
1290
1318
  }