morya-ui 0.2.8 → 0.2.9

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 (196) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/README.md +1 -0
  3. package/README.zh-CN.md +1 -0
  4. package/dist/{Button--RkQybU-.js → Button-DO5oukfg.js} +1 -1
  5. package/dist/Icon-B6IBrJ5S.js +606 -0
  6. package/dist/{Pagination-BKvR-RUW.js → Pagination-CUwCtWhz.js} +1 -1
  7. package/dist/accordion/style.css +26 -23
  8. package/dist/auto-complete/index.js +1 -1
  9. package/dist/auto-complete/style.css +64 -40
  10. package/dist/avatar/index.js +1 -1
  11. package/dist/avatar/style.css +26 -23
  12. package/dist/badge/style.css +26 -23
  13. package/dist/block-ui/style.css +26 -23
  14. package/dist/breadcrumb/style.css +26 -23
  15. package/dist/button/index.js +1 -1
  16. package/dist/button/style.css +26 -23
  17. package/dist/card/style.css +26 -23
  18. package/dist/carousel/index.js +1 -1
  19. package/dist/carousel/style.css +26 -23
  20. package/dist/cascade-select/index.js +1 -1
  21. package/dist/cascade-select/style.css +27 -24
  22. package/dist/checkbox/style.css +26 -23
  23. package/dist/chip/index.js +1 -1
  24. package/dist/chip/style.css +26 -23
  25. package/dist/command-menu/index.js +2 -2
  26. package/dist/command-menu/style.css +26 -23
  27. package/dist/components/AutoComplete/styles.css +38 -17
  28. package/dist/components/DatePicker/styles.css +65 -21
  29. package/dist/components/Icon/icon-categories.d.ts +21 -0
  30. package/dist/components/Icon/icon-categories.d.ts.map +1 -0
  31. package/dist/components/Icon/icons-tabler.d.ts +77 -0
  32. package/dist/components/Icon/icons-tabler.d.ts.map +1 -0
  33. package/dist/components/Icon/icons-types.d.ts +36 -0
  34. package/dist/components/Icon/icons-types.d.ts.map +1 -0
  35. package/dist/components/Icon/icons.d.ts +75 -32
  36. package/dist/components/Icon/icons.d.ts.map +1 -1
  37. package/dist/components/Icon/index.d.ts +2 -0
  38. package/dist/components/Icon/index.d.ts.map +1 -1
  39. package/dist/components/IconField/IconField.vue.d.ts +3 -1
  40. package/dist/components/IconField/IconField.vue.d.ts.map +1 -1
  41. package/dist/components/IconField/styles.css +306 -31
  42. package/dist/components/Input/Input.vue.d.ts.map +1 -1
  43. package/dist/components/Input/styles.css +172 -33
  44. package/dist/components/InputNumber/styles.css +103 -40
  45. package/dist/components/InputPassword/InputPassword.vue.d.ts.map +1 -1
  46. package/dist/components/InputPassword/styles.css +79 -79
  47. package/dist/components/Layout/LayoutContent.vue.d.ts +4 -8
  48. package/dist/components/Layout/LayoutContent.vue.d.ts.map +1 -1
  49. package/dist/components/Layout/LayoutSider.vue.d.ts +4 -6
  50. package/dist/components/Layout/LayoutSider.vue.d.ts.map +1 -1
  51. package/dist/components/Layout/composables/useLayoutRegionStyle.d.ts +2 -0
  52. package/dist/components/Layout/composables/useLayoutRegionStyle.d.ts.map +1 -1
  53. package/dist/components/Layout/styles.css +7 -42
  54. package/dist/components/Layout/types.d.ts +4 -7
  55. package/dist/components/Layout/types.d.ts.map +1 -1
  56. package/dist/components/Menu/styles.css +4 -1
  57. package/dist/components/Textarea/styles.css +15 -1
  58. package/dist/config-provider/style.css +198 -56
  59. package/dist/confirm-dialog/index.js +2 -2
  60. package/dist/confirm-dialog/style.css +26 -23
  61. package/dist/confirm-popup/index.js +2 -2
  62. package/dist/confirm-popup/style.css +26 -23
  63. package/dist/context-menu/index.js +2 -2
  64. package/dist/context-menu/style.css +26 -23
  65. package/dist/data-view/index.js +1 -1
  66. package/dist/data-view/style.css +26 -23
  67. package/dist/date-picker/index.js +1 -1
  68. package/dist/date-picker/style.css +91 -44
  69. package/dist/dialog/index.js +2 -2
  70. package/dist/dialog/style.css +26 -23
  71. package/dist/divider/style.css +26 -23
  72. package/dist/dock/index.js +2 -2
  73. package/dist/dock/style.css +26 -23
  74. package/dist/drawer/index.js +1 -1
  75. package/dist/drawer/style.css +26 -23
  76. package/dist/dropdown/index.js +2 -2
  77. package/dist/dropdown/style.css +26 -23
  78. package/dist/empty/index.js +1 -1
  79. package/dist/empty/style.css +26 -23
  80. package/dist/fieldset/index.js +1 -1
  81. package/dist/fieldset/style.css +26 -23
  82. package/dist/file-upload/index.js +1 -1
  83. package/dist/file-upload/style.css +26 -23
  84. package/dist/flex/style.css +26 -23
  85. package/dist/float-label/style.css +26 -23
  86. package/dist/fluid/style.css +26 -23
  87. package/dist/form/style.css +26 -23
  88. package/dist/gallery/index.js +1 -1
  89. package/dist/gallery/style.css +26 -23
  90. package/dist/grid/style.css +26 -23
  91. package/dist/icon/index.js +212 -2
  92. package/dist/icon/style.css +26 -23
  93. package/dist/icon-field/index.js +41 -7
  94. package/dist/icon-field/style.css +672 -54
  95. package/dist/icon-field/style.js +1 -0
  96. package/dist/{icon-xUOyawgJ.js → icon-iOBeyIRp.js} +1 -1
  97. package/dist/index.d.ts +2 -0
  98. package/dist/index.d.ts.map +1 -1
  99. package/dist/index.js +3126 -2821
  100. package/dist/inplace/style.css +26 -23
  101. package/dist/input/index.js +78 -80
  102. package/dist/input/style.css +198 -56
  103. package/dist/input-color/style.css +26 -23
  104. package/dist/input-group/style.css +26 -23
  105. package/dist/input-number/index.js +1 -1
  106. package/dist/input-number/style.css +129 -63
  107. package/dist/input-otp/style.css +26 -23
  108. package/dist/input-password/index.js +83 -82
  109. package/dist/input-password/style.css +105 -102
  110. package/dist/input-tags/index.js +1 -1
  111. package/dist/input-tags/style.css +26 -23
  112. package/dist/knob/style.css +26 -23
  113. package/dist/label/style.css +26 -23
  114. package/dist/layout/index.js +60 -83
  115. package/dist/layout/style.css +33 -65
  116. package/dist/listbox/style.css +26 -23
  117. package/dist/loading/style.css +26 -23
  118. package/dist/mega-menu/index.js +2 -2
  119. package/dist/mega-menu/style.css +26 -23
  120. package/dist/menu/index.js +2 -2
  121. package/dist/menu/style.css +30 -24
  122. package/dist/menubar/index.js +2 -2
  123. package/dist/menubar/style.css +26 -23
  124. package/dist/message/index.js +1 -1
  125. package/dist/message/style.css +26 -23
  126. package/dist/meter-group/style.css +26 -23
  127. package/dist/order-list/index.js +1 -1
  128. package/dist/order-list/style.css +26 -23
  129. package/dist/page/index.js +1 -1
  130. package/dist/page/style.css +26 -23
  131. package/dist/pagination/index.js +1 -1
  132. package/dist/pagination/style.css +26 -23
  133. package/dist/panel/index.js +1 -1
  134. package/dist/panel/style.css +26 -23
  135. package/dist/pick-list/index.js +1 -1
  136. package/dist/pick-list/style.css +26 -23
  137. package/dist/popover/style.css +26 -23
  138. package/dist/progress-bar/style.css +26 -23
  139. package/dist/progress-spinner/style.css +26 -23
  140. package/dist/radio/style.css +26 -23
  141. package/dist/rating/index.js +1 -1
  142. package/dist/rating/style.css +26 -23
  143. package/dist/result/index.js +1 -1
  144. package/dist/result/style.css +26 -23
  145. package/dist/scroll-top/index.js +1 -1
  146. package/dist/scroll-top/style.css +26 -23
  147. package/dist/scrollbar/style.css +26 -23
  148. package/dist/select/index.js +1 -1
  149. package/dist/select/style.css +27 -24
  150. package/dist/select-button/style.css +26 -23
  151. package/dist/shared/styles/control-suffix.css +1 -1
  152. package/dist/sidebar/index.js +2 -2
  153. package/dist/sidebar/style.css +26 -23
  154. package/dist/skeleton/style.css +26 -23
  155. package/dist/slider/style.css +26 -23
  156. package/dist/space/style.css +26 -23
  157. package/dist/speed-dial/index.js +2 -2
  158. package/dist/speed-dial/style.css +26 -23
  159. package/dist/split-button/index.js +1 -1
  160. package/dist/split-button/style.css +26 -23
  161. package/dist/splitter/style.css +26 -23
  162. package/dist/status/index.js +1 -1
  163. package/dist/status/style.css +26 -23
  164. package/dist/stepper/index.js +1 -1
  165. package/dist/stepper/style.css +26 -23
  166. package/dist/styles/base.css +26 -23
  167. package/dist/styles.css +1 -1
  168. package/dist/switch/style.css +26 -23
  169. package/dist/table/index.js +2 -2
  170. package/dist/table/style.css +26 -23
  171. package/dist/tabs/index.js +1 -1
  172. package/dist/tabs/style.css +26 -23
  173. package/dist/tag/index.js +1 -1
  174. package/dist/tag/style.css +26 -23
  175. package/dist/terminal/style.css +26 -23
  176. package/dist/textarea/index.js +1 -1
  177. package/dist/textarea/style.css +41 -24
  178. package/dist/tiered-menu/index.js +1 -1
  179. package/dist/tiered-menu/style.css +26 -23
  180. package/dist/timeline/index.js +1 -1
  181. package/dist/timeline/style.css +26 -23
  182. package/dist/toast/index.js +1 -1
  183. package/dist/toast/style.css +26 -23
  184. package/dist/toggle-button/index.js +2 -2
  185. package/dist/toggle-button/style.css +26 -23
  186. package/dist/toolbar/style.css +26 -23
  187. package/dist/tooltip/style.css +26 -23
  188. package/dist/tree/index.js +1 -1
  189. package/dist/tree/style.css +26 -23
  190. package/dist/tree-select/index.js +1 -1
  191. package/dist/tree-select/style.css +27 -24
  192. package/dist/tree-table/index.js +1 -1
  193. package/dist/tree-table/style.css +26 -23
  194. package/dist/virtual-scroller/style.css +26 -23
  195. package/package.json +1 -1
  196. package/dist/Icon-DfpIfo2L.js +0 -521
@@ -373,6 +373,17 @@
373
373
  opacity: var(--m-opacity-disabled);
374
374
  }
375
375
 
376
+ .m-input-field__control--prefixed .m-input:disabled,
377
+ .m-input-field__control--suffixed .m-input:disabled,
378
+ .m-input-field__control--clearable .m-input:disabled,
379
+ .m-password--disabled .m-password__input,
380
+ .m-inputnumber--disabled .m-inputnumber__input,
381
+ .m-datepicker--disabled .m-datepicker__input,
382
+ .m-icon-field--anchored .m-input:disabled,
383
+ .m-icon-field--anchored .m-textarea:disabled {
384
+ opacity: 1;
385
+ }
386
+
376
387
  .m-input::placeholder,
377
388
  .m-textarea::placeholder,
378
389
  .m-password__input::placeholder,
@@ -692,14 +703,6 @@
692
703
  opacity: var(--m-opacity-disabled);
693
704
  }
694
705
 
695
- .m-icon-field--left :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
696
- padding-left: var(--m-control-affix-padding);
697
- }
698
-
699
- .m-icon-field--right :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
700
- padding-right: var(--m-control-affix-padding);
701
- }
702
-
703
706
  .m-inputgroup > .m-input,
704
707
  .m-inputgroup > .m-input-field,
705
708
  .m-inputgroup > .m-password-field,
@@ -718,16 +721,22 @@
718
721
 
719
722
  .m-inputgroup > .m-input,
720
723
  .m-inputgroup .m-input,
721
- .m-inputgroup .m-password__input,
722
- .m-inputgroup .m-inputnumber__input {
724
+ .m-inputgroup .m-password,
725
+ .m-inputgroup .m-inputnumber__input-wrap,
726
+ .m-inputgroup .m-input-field__control--prefixed,
727
+ .m-inputgroup .m-input-field__control--suffixed,
728
+ .m-inputgroup .m-input-field__control--clearable {
723
729
  border-radius: 0;
724
730
  width: 100%;
725
731
  }
726
732
 
727
733
  .m-inputgroup > :first-child.m-input,
728
734
  .m-inputgroup > :first-child .m-input,
729
- .m-inputgroup > :first-child .m-password__input,
730
- .m-inputgroup > :first-child .m-inputnumber__input,
735
+ .m-inputgroup > :first-child .m-password,
736
+ .m-inputgroup > :first-child .m-inputnumber__input-wrap,
737
+ .m-inputgroup > :first-child .m-input-field__control--prefixed,
738
+ .m-inputgroup > :first-child .m-input-field__control--suffixed,
739
+ .m-inputgroup > :first-child .m-input-field__control--clearable,
731
740
  .m-inputgroup > :first-child.m-inputgroup-addon {
732
741
  border-bottom-left-radius: var(--m-radius-control);
733
742
  border-top-left-radius: var(--m-radius-control);
@@ -735,8 +744,11 @@
735
744
 
736
745
  .m-inputgroup > :last-child.m-input,
737
746
  .m-inputgroup > :last-child .m-input,
738
- .m-inputgroup > :last-child .m-password__input,
739
- .m-inputgroup > :last-child .m-inputnumber__input,
747
+ .m-inputgroup > :last-child .m-password,
748
+ .m-inputgroup > :last-child .m-inputnumber__input-wrap,
749
+ .m-inputgroup > :last-child .m-input-field__control--prefixed,
750
+ .m-inputgroup > :last-child .m-input-field__control--suffixed,
751
+ .m-inputgroup > :last-child .m-input-field__control--clearable,
740
752
  .m-inputgroup > :last-child.m-inputgroup-addon {
741
753
  border-bottom-right-radius: var(--m-radius-control);
742
754
  border-top-right-radius: var(--m-radius-control);
@@ -887,9 +899,6 @@
887
899
  }
888
900
 
889
901
  /* Shared Naive-like hover/focus for remaining form triggers */
890
- .m-inputnumber__input:hover:not(:disabled):not(:focus),
891
- .m-password__input:hover:not(:disabled):not(:focus),
892
- .m-datepicker__input:hover:not(:disabled):not(:focus),
893
902
  .m-inputotp__input:hover:not(:disabled):not(:focus),
894
903
  .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
895
904
  .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
@@ -900,9 +909,6 @@
900
909
  border-color: var(--m-color-primary-hover);
901
910
  }
902
911
 
903
- .m-inputnumber__input:focus-visible,
904
- .m-password__input:focus-visible,
905
- .m-datepicker__input:focus-visible,
906
912
  .m-inputotp__input:focus-visible,
907
913
  .m-cascadeselect__trigger:focus-visible,
908
914
  .m-treeselect__trigger:focus-visible,
@@ -919,9 +925,6 @@
919
925
  outline: none;
920
926
  }
921
927
 
922
- .m-inputnumber--invalid .m-inputnumber__input:focus-visible,
923
- .m-password--invalid .m-password__input:focus-visible,
924
- .m-datepicker--invalid .m-datepicker__input:focus-visible,
925
928
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
926
929
  .m-inputtags--invalid:focus-within,
927
930
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
@@ -1712,16 +1715,156 @@
1712
1715
  position: relative;
1713
1716
  }
1714
1717
 
1718
+ /*
1719
+ * Affix/clear shell: prefix/suffix participate in flex flow so long slot
1720
+ * content reserves real width instead of fighting fixed input padding.
1721
+ */
1715
1722
  .m-input-field__control--prefixed,
1716
- .m-input-field__control--suffixed {
1723
+ .m-input-field__control--suffixed,
1724
+ .m-input-field__control--clearable {
1717
1725
  align-items: center;
1726
+ background: var(--m-color-surface);
1727
+ border: var(--m-border-width) solid var(--m-color-border);
1728
+ border-radius: var(--m-radius-control);
1729
+ box-sizing: border-box;
1718
1730
  display: flex;
1731
+ max-width: 100%;
1732
+ min-height: var(--m-control-height-medium);
1733
+ transition:
1734
+ border-color var(--m-motion-fast) var(--m-motion-ease),
1735
+ box-shadow var(--m-motion-fast) var(--m-motion-ease),
1736
+ background-color var(--m-motion-fast) var(--m-motion-ease);
1737
+ }
1738
+
1739
+ .m-input-field--fluid .m-input-field__control--prefixed,
1740
+ .m-input-field--fluid .m-input-field__control--suffixed,
1741
+ .m-input-field--fluid .m-input-field__control--clearable {
1742
+ width: 100%;
1743
+ }
1744
+
1745
+ .m-input-field__control--prefixed:has(.m-input--small),
1746
+ .m-input-field__control--suffixed:has(.m-input--small),
1747
+ .m-input-field__control--clearable:has(.m-input--small),
1748
+ .m-input-field__control--prefixed:has(.m-input--sm),
1749
+ .m-input-field__control--suffixed:has(.m-input--sm),
1750
+ .m-input-field__control--clearable:has(.m-input--sm) {
1751
+ min-height: var(--m-control-height-small);
1752
+ }
1753
+
1754
+ .m-input-field__control--prefixed:has(.m-input--large),
1755
+ .m-input-field__control--suffixed:has(.m-input--large),
1756
+ .m-input-field__control--clearable:has(.m-input--large),
1757
+ .m-input-field__control--prefixed:has(.m-input--lg),
1758
+ .m-input-field__control--suffixed:has(.m-input--lg),
1759
+ .m-input-field__control--clearable:has(.m-input--lg) {
1760
+ min-height: var(--m-control-height-large);
1761
+ }
1762
+
1763
+ .m-input-field__control--prefixed:has(.m-input--filled),
1764
+ .m-input-field__control--suffixed:has(.m-input--filled),
1765
+ .m-input-field__control--clearable:has(.m-input--filled) {
1766
+ background: color-mix(
1767
+ in srgb,
1768
+ var(--m-color-text-muted) 12%,
1769
+ var(--m-color-surface)
1770
+ );
1771
+ border-color: transparent;
1772
+ }
1773
+
1774
+ .m-input-field__control--prefixed:has(.m-input--invalid),
1775
+ .m-input-field__control--suffixed:has(.m-input--invalid),
1776
+ .m-input-field__control--clearable:has(.m-input--invalid) {
1777
+ border-color: var(--m-color-danger);
1778
+ }
1779
+
1780
+ .m-input-field__control--prefixed:hover:not(:focus-within):has(
1781
+ .m-input:not(:disabled)
1782
+ ),
1783
+ .m-input-field__control--suffixed:hover:not(:focus-within):has(
1784
+ .m-input:not(:disabled)
1785
+ ),
1786
+ .m-input-field__control--clearable:hover:not(:focus-within):has(
1787
+ .m-input:not(:disabled)
1788
+ ) {
1789
+ border-color: var(--m-color-primary-hover);
1790
+ }
1791
+
1792
+ .m-input-field__control--prefixed:focus-within,
1793
+ .m-input-field__control--suffixed:focus-within,
1794
+ .m-input-field__control--clearable:focus-within {
1795
+ border-color: var(--m-color-primary-hover);
1796
+ box-shadow: var(--m-focus-shadow);
1797
+ }
1798
+
1799
+ .m-input-field__control--prefixed:has(.m-input--invalid):focus-within,
1800
+ .m-input-field__control--suffixed:has(.m-input--invalid):focus-within,
1801
+ .m-input-field__control--clearable:has(.m-input--invalid):focus-within {
1802
+ border-color: var(--m-color-danger);
1803
+ box-shadow: var(--m-focus-shadow-danger);
1804
+ }
1805
+
1806
+ .m-input-field__control--prefixed:has(.m-input:disabled),
1807
+ .m-input-field__control--suffixed:has(.m-input:disabled),
1808
+ .m-input-field__control--clearable:has(.m-input:disabled) {
1809
+ cursor: not-allowed;
1810
+ opacity: var(--m-opacity-disabled);
1719
1811
  }
1720
1812
 
1721
1813
  .m-input-field__control--prefixed .m-input,
1722
- .m-input-field__control--suffixed .m-input {
1814
+ .m-input-field__control--suffixed .m-input,
1815
+ .m-input-field__control--clearable .m-input {
1816
+ background: transparent;
1817
+ border: 0;
1818
+ border-radius: 0;
1819
+ box-shadow: none;
1723
1820
  flex: 1 1 auto;
1821
+ height: calc(var(--m-control-height-medium) - 2 * var(--m-border-width));
1822
+ line-height: calc(var(--m-control-height-medium) - 2 * var(--m-border-width));
1823
+ min-height: 0;
1724
1824
  min-width: 0;
1825
+ width: auto;
1826
+ }
1827
+
1828
+ .m-input-field__control--prefixed:has(.m-input--small) .m-input,
1829
+ .m-input-field__control--suffixed:has(.m-input--small) .m-input,
1830
+ .m-input-field__control--clearable:has(.m-input--small) .m-input,
1831
+ .m-input-field__control--prefixed:has(.m-input--sm) .m-input,
1832
+ .m-input-field__control--suffixed:has(.m-input--sm) .m-input,
1833
+ .m-input-field__control--clearable:has(.m-input--sm) .m-input {
1834
+ height: calc(var(--m-control-height-small) - 2 * var(--m-border-width));
1835
+ line-height: calc(var(--m-control-height-small) - 2 * var(--m-border-width));
1836
+ }
1837
+
1838
+ .m-input-field__control--prefixed:has(.m-input--large) .m-input,
1839
+ .m-input-field__control--suffixed:has(.m-input--large) .m-input,
1840
+ .m-input-field__control--clearable:has(.m-input--large) .m-input,
1841
+ .m-input-field__control--prefixed:has(.m-input--lg) .m-input,
1842
+ .m-input-field__control--suffixed:has(.m-input--lg) .m-input,
1843
+ .m-input-field__control--clearable:has(.m-input--lg) .m-input {
1844
+ height: calc(var(--m-control-height-large) - 2 * var(--m-border-width));
1845
+ line-height: calc(var(--m-control-height-large) - 2 * var(--m-border-width));
1846
+ }
1847
+
1848
+ .m-input-field__control--prefixed .m-input:hover:not(:disabled):not(:focus),
1849
+ .m-input-field__control--suffixed .m-input:hover:not(:disabled):not(:focus),
1850
+ .m-input-field__control--clearable .m-input:hover:not(:disabled):not(:focus),
1851
+ .m-input-field__control--prefixed .m-input:focus-visible,
1852
+ .m-input-field__control--suffixed .m-input:focus-visible,
1853
+ .m-input-field__control--clearable .m-input:focus-visible,
1854
+ .m-input-field__control--prefixed .m-input--invalid:focus-visible,
1855
+ .m-input-field__control--suffixed .m-input--invalid:focus-visible,
1856
+ .m-input-field__control--clearable .m-input--invalid:focus-visible {
1857
+ border-color: transparent;
1858
+ box-shadow: none;
1859
+ }
1860
+
1861
+ .m-input-field__control--prefixed .m-input {
1862
+ padding-left: 0;
1863
+ }
1864
+
1865
+ .m-input-field__control--suffixed .m-input,
1866
+ .m-input-field__control--clearable.m-input-field__control--suffixed .m-input {
1867
+ padding-right: 0;
1725
1868
  }
1726
1869
 
1727
1870
  .m-input__prefix,
@@ -1730,41 +1873,33 @@
1730
1873
  color: var(--m-color-text-muted);
1731
1874
  display: inline-flex;
1732
1875
  flex: 0 0 auto;
1733
- font-size: var(--m-font-size-md);
1876
+ font-size: inherit;
1734
1877
  gap: var(--m-space-1);
1735
1878
  line-height: 1;
1879
+ padding-inline: var(--m-space-2);
1736
1880
  pointer-events: none;
1737
- position: absolute;
1738
- top: 50%;
1739
- transform: translateY(-50%);
1740
- z-index: 1;
1741
- }
1742
-
1743
- .m-input__prefix {
1744
- left: var(--m-control-padding-x-medium);
1745
- }
1746
-
1747
- .m-input__suffix {
1748
- right: var(--m-control-padding-x-medium);
1749
- }
1750
-
1751
- .m-input-field__control--clearable .m-input__suffix {
1752
- right: var(--m-control-affix-gap);
1881
+ white-space: nowrap;
1753
1882
  }
1754
1883
 
1755
- .m-input--has-prefix {
1756
- padding-left: var(--m-control-affix-gap);
1884
+ .m-input-field__control--prefixed .m-input__prefix,
1885
+ .m-input-field__control--suffixed .m-input__suffix {
1886
+ font-size: var(--m-control-font-medium);
1757
1887
  }
1758
1888
 
1759
- .m-input--has-suffix {
1760
- padding-right: var(--m-control-affix-gap);
1889
+ .m-input-field__control:has(.m-input--small) .m-input__prefix,
1890
+ .m-input-field__control:has(.m-input--small) .m-input__suffix,
1891
+ .m-input-field__control:has(.m-input--sm) .m-input__prefix,
1892
+ .m-input-field__control:has(.m-input--sm) .m-input__suffix {
1893
+ font-size: var(--m-control-font-small);
1894
+ padding-inline: var(--m-space-2);
1761
1895
  }
1762
1896
 
1763
- .m-input-field__control--clearable.m-input-field__control--suffixed
1764
- .m-input--has-suffix {
1765
- padding-right: calc(
1766
- var(--m-control-affix-padding) + var(--m-control-affix-gap)
1767
- );
1897
+ .m-input-field__control:has(.m-input--large) .m-input__prefix,
1898
+ .m-input-field__control:has(.m-input--large) .m-input__suffix,
1899
+ .m-input-field__control:has(.m-input--lg) .m-input__prefix,
1900
+ .m-input-field__control:has(.m-input--lg) .m-input__suffix {
1901
+ font-size: var(--m-control-font-large);
1902
+ padding-inline: var(--m-space-3);
1768
1903
  }
1769
1904
 
1770
1905
  .m-input__prefix button,
@@ -1781,6 +1916,7 @@
1781
1916
  color: var(--m-color-text);
1782
1917
  font-family: var(--m-font-sans);
1783
1918
  font-size: var(--m-control-font-medium);
1919
+ line-height: calc(var(--m-control-height-medium) - 2 * var(--m-border-width));
1784
1920
  min-height: var(--m-control-height-medium);
1785
1921
  padding: 0 var(--m-control-padding-x-medium);
1786
1922
  transition:
@@ -1810,12 +1946,14 @@
1810
1946
  .m-input--small,
1811
1947
  .m-input--sm {
1812
1948
  font-size: var(--m-control-font-small);
1949
+ line-height: calc(var(--m-control-height-small) - 2 * var(--m-border-width));
1813
1950
  min-height: var(--m-control-height-small);
1814
1951
  padding: 0 var(--m-control-padding-x-small);
1815
1952
  }
1816
1953
 
1817
1954
  .m-input--normal {
1818
1955
  font-size: var(--m-control-font-medium);
1956
+ line-height: calc(var(--m-control-height-medium) - 2 * var(--m-border-width));
1819
1957
  min-height: var(--m-control-height-medium);
1820
1958
  padding: 0 var(--m-control-padding-x-medium);
1821
1959
  }
@@ -1823,6 +1961,7 @@
1823
1961
  .m-input--large,
1824
1962
  .m-input--lg {
1825
1963
  font-size: var(--m-control-font-large);
1964
+ line-height: calc(var(--m-control-height-large) - 2 * var(--m-border-width));
1826
1965
  min-height: var(--m-control-height-large);
1827
1966
  padding: 0 var(--m-control-padding-x-large);
1828
1967
  }
@@ -1831,24 +1970,27 @@
1831
1970
  width: 100%;
1832
1971
  }
1833
1972
 
1973
+ .m-input-field__control--prefixed .m-input,
1974
+ .m-input-field__control--suffixed .m-input,
1975
+ .m-input-field__control--clearable .m-input {
1976
+ width: auto;
1977
+ }
1978
+
1834
1979
  .m-input__clear {
1835
1980
  align-items: center;
1981
+ align-self: center;
1836
1982
  background: transparent;
1837
1983
  border: 0;
1838
1984
  border-radius: var(--m-radius-sm);
1839
1985
  color: var(--m-color-text-muted);
1840
1986
  cursor: pointer;
1841
1987
  display: flex;
1988
+ flex: 0 0 auto;
1842
1989
  font-size: var(--m-font-size-lg);
1843
1990
  height: var(--m-control-affix-size);
1844
1991
  justify-content: center;
1845
1992
  padding: 0;
1846
- position: absolute;
1847
- right: var(--m-space-1);
1848
- top: 50%;
1849
- transform: translateY(-50%);
1850
1993
  width: var(--m-control-affix-size);
1851
- z-index: 1;
1852
1994
  }
1853
1995
 
1854
1996
  .m-input__clear:hover:not(:disabled) {
@@ -1,6 +1,6 @@
1
1
  import { r as e } from "../useComponentAttrs-BTYEe61P.js";
2
- import { t } from "../Icon-DfpIfo2L.js";
3
- import { t as n } from "../Button--RkQybU-.js";
2
+ import { t } from "../Icon-B6IBrJ5S.js";
3
+ import { t as n } from "../Button-DO5oukfg.js";
4
4
  import { n as r } from "../overlay-oR-5MDuE.js";
5
5
  import { t as i } from "../useModalOverlay-Beo3CEAt.js";
6
6
  import { t as a } from "../asyncGuard-CPGT_TKu.js";
@@ -373,6 +373,17 @@
373
373
  opacity: var(--m-opacity-disabled);
374
374
  }
375
375
 
376
+ .m-input-field__control--prefixed .m-input:disabled,
377
+ .m-input-field__control--suffixed .m-input:disabled,
378
+ .m-input-field__control--clearable .m-input:disabled,
379
+ .m-password--disabled .m-password__input,
380
+ .m-inputnumber--disabled .m-inputnumber__input,
381
+ .m-datepicker--disabled .m-datepicker__input,
382
+ .m-icon-field--anchored .m-input:disabled,
383
+ .m-icon-field--anchored .m-textarea:disabled {
384
+ opacity: 1;
385
+ }
386
+
376
387
  .m-input::placeholder,
377
388
  .m-textarea::placeholder,
378
389
  .m-password__input::placeholder,
@@ -692,14 +703,6 @@
692
703
  opacity: var(--m-opacity-disabled);
693
704
  }
694
705
 
695
- .m-icon-field--left :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
696
- padding-left: var(--m-control-affix-padding);
697
- }
698
-
699
- .m-icon-field--right :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
700
- padding-right: var(--m-control-affix-padding);
701
- }
702
-
703
706
  .m-inputgroup > .m-input,
704
707
  .m-inputgroup > .m-input-field,
705
708
  .m-inputgroup > .m-password-field,
@@ -718,16 +721,22 @@
718
721
 
719
722
  .m-inputgroup > .m-input,
720
723
  .m-inputgroup .m-input,
721
- .m-inputgroup .m-password__input,
722
- .m-inputgroup .m-inputnumber__input {
724
+ .m-inputgroup .m-password,
725
+ .m-inputgroup .m-inputnumber__input-wrap,
726
+ .m-inputgroup .m-input-field__control--prefixed,
727
+ .m-inputgroup .m-input-field__control--suffixed,
728
+ .m-inputgroup .m-input-field__control--clearable {
723
729
  border-radius: 0;
724
730
  width: 100%;
725
731
  }
726
732
 
727
733
  .m-inputgroup > :first-child.m-input,
728
734
  .m-inputgroup > :first-child .m-input,
729
- .m-inputgroup > :first-child .m-password__input,
730
- .m-inputgroup > :first-child .m-inputnumber__input,
735
+ .m-inputgroup > :first-child .m-password,
736
+ .m-inputgroup > :first-child .m-inputnumber__input-wrap,
737
+ .m-inputgroup > :first-child .m-input-field__control--prefixed,
738
+ .m-inputgroup > :first-child .m-input-field__control--suffixed,
739
+ .m-inputgroup > :first-child .m-input-field__control--clearable,
731
740
  .m-inputgroup > :first-child.m-inputgroup-addon {
732
741
  border-bottom-left-radius: var(--m-radius-control);
733
742
  border-top-left-radius: var(--m-radius-control);
@@ -735,8 +744,11 @@
735
744
 
736
745
  .m-inputgroup > :last-child.m-input,
737
746
  .m-inputgroup > :last-child .m-input,
738
- .m-inputgroup > :last-child .m-password__input,
739
- .m-inputgroup > :last-child .m-inputnumber__input,
747
+ .m-inputgroup > :last-child .m-password,
748
+ .m-inputgroup > :last-child .m-inputnumber__input-wrap,
749
+ .m-inputgroup > :last-child .m-input-field__control--prefixed,
750
+ .m-inputgroup > :last-child .m-input-field__control--suffixed,
751
+ .m-inputgroup > :last-child .m-input-field__control--clearable,
740
752
  .m-inputgroup > :last-child.m-inputgroup-addon {
741
753
  border-bottom-right-radius: var(--m-radius-control);
742
754
  border-top-right-radius: var(--m-radius-control);
@@ -887,9 +899,6 @@
887
899
  }
888
900
 
889
901
  /* Shared Naive-like hover/focus for remaining form triggers */
890
- .m-inputnumber__input:hover:not(:disabled):not(:focus),
891
- .m-password__input:hover:not(:disabled):not(:focus),
892
- .m-datepicker__input:hover:not(:disabled):not(:focus),
893
902
  .m-inputotp__input:hover:not(:disabled):not(:focus),
894
903
  .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
895
904
  .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
@@ -900,9 +909,6 @@
900
909
  border-color: var(--m-color-primary-hover);
901
910
  }
902
911
 
903
- .m-inputnumber__input:focus-visible,
904
- .m-password__input:focus-visible,
905
- .m-datepicker__input:focus-visible,
906
912
  .m-inputotp__input:focus-visible,
907
913
  .m-cascadeselect__trigger:focus-visible,
908
914
  .m-treeselect__trigger:focus-visible,
@@ -919,9 +925,6 @@
919
925
  outline: none;
920
926
  }
921
927
 
922
- .m-inputnumber--invalid .m-inputnumber__input:focus-visible,
923
- .m-password--invalid .m-password__input:focus-visible,
924
- .m-datepicker--invalid .m-datepicker__input:focus-visible,
925
928
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
926
929
  .m-inputtags--invalid:focus-within,
927
930
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
@@ -1,6 +1,6 @@
1
1
  import { r as e } from "../useComponentAttrs-BTYEe61P.js";
2
- import { t } from "../Icon-DfpIfo2L.js";
3
- import { t as n } from "../Button--RkQybU-.js";
2
+ import { t } from "../Icon-B6IBrJ5S.js";
3
+ import { t as n } from "../Button-DO5oukfg.js";
4
4
  import { n as r, t as i } from "../overlay-oR-5MDuE.js";
5
5
  import { t as a } from "../overlayPlacement-Cd20JTD_.js";
6
6
  import { t as o } from "../asyncGuard-CPGT_TKu.js";
@@ -373,6 +373,17 @@
373
373
  opacity: var(--m-opacity-disabled);
374
374
  }
375
375
 
376
+ .m-input-field__control--prefixed .m-input:disabled,
377
+ .m-input-field__control--suffixed .m-input:disabled,
378
+ .m-input-field__control--clearable .m-input:disabled,
379
+ .m-password--disabled .m-password__input,
380
+ .m-inputnumber--disabled .m-inputnumber__input,
381
+ .m-datepicker--disabled .m-datepicker__input,
382
+ .m-icon-field--anchored .m-input:disabled,
383
+ .m-icon-field--anchored .m-textarea:disabled {
384
+ opacity: 1;
385
+ }
386
+
376
387
  .m-input::placeholder,
377
388
  .m-textarea::placeholder,
378
389
  .m-password__input::placeholder,
@@ -692,14 +703,6 @@
692
703
  opacity: var(--m-opacity-disabled);
693
704
  }
694
705
 
695
- .m-icon-field--left :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
696
- padding-left: var(--m-control-affix-padding);
697
- }
698
-
699
- .m-icon-field--right :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
700
- padding-right: var(--m-control-affix-padding);
701
- }
702
-
703
706
  .m-inputgroup > .m-input,
704
707
  .m-inputgroup > .m-input-field,
705
708
  .m-inputgroup > .m-password-field,
@@ -718,16 +721,22 @@
718
721
 
719
722
  .m-inputgroup > .m-input,
720
723
  .m-inputgroup .m-input,
721
- .m-inputgroup .m-password__input,
722
- .m-inputgroup .m-inputnumber__input {
724
+ .m-inputgroup .m-password,
725
+ .m-inputgroup .m-inputnumber__input-wrap,
726
+ .m-inputgroup .m-input-field__control--prefixed,
727
+ .m-inputgroup .m-input-field__control--suffixed,
728
+ .m-inputgroup .m-input-field__control--clearable {
723
729
  border-radius: 0;
724
730
  width: 100%;
725
731
  }
726
732
 
727
733
  .m-inputgroup > :first-child.m-input,
728
734
  .m-inputgroup > :first-child .m-input,
729
- .m-inputgroup > :first-child .m-password__input,
730
- .m-inputgroup > :first-child .m-inputnumber__input,
735
+ .m-inputgroup > :first-child .m-password,
736
+ .m-inputgroup > :first-child .m-inputnumber__input-wrap,
737
+ .m-inputgroup > :first-child .m-input-field__control--prefixed,
738
+ .m-inputgroup > :first-child .m-input-field__control--suffixed,
739
+ .m-inputgroup > :first-child .m-input-field__control--clearable,
731
740
  .m-inputgroup > :first-child.m-inputgroup-addon {
732
741
  border-bottom-left-radius: var(--m-radius-control);
733
742
  border-top-left-radius: var(--m-radius-control);
@@ -735,8 +744,11 @@
735
744
 
736
745
  .m-inputgroup > :last-child.m-input,
737
746
  .m-inputgroup > :last-child .m-input,
738
- .m-inputgroup > :last-child .m-password__input,
739
- .m-inputgroup > :last-child .m-inputnumber__input,
747
+ .m-inputgroup > :last-child .m-password,
748
+ .m-inputgroup > :last-child .m-inputnumber__input-wrap,
749
+ .m-inputgroup > :last-child .m-input-field__control--prefixed,
750
+ .m-inputgroup > :last-child .m-input-field__control--suffixed,
751
+ .m-inputgroup > :last-child .m-input-field__control--clearable,
740
752
  .m-inputgroup > :last-child.m-inputgroup-addon {
741
753
  border-bottom-right-radius: var(--m-radius-control);
742
754
  border-top-right-radius: var(--m-radius-control);
@@ -887,9 +899,6 @@
887
899
  }
888
900
 
889
901
  /* Shared Naive-like hover/focus for remaining form triggers */
890
- .m-inputnumber__input:hover:not(:disabled):not(:focus),
891
- .m-password__input:hover:not(:disabled):not(:focus),
892
- .m-datepicker__input:hover:not(:disabled):not(:focus),
893
902
  .m-inputotp__input:hover:not(:disabled):not(:focus),
894
903
  .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
895
904
  .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
@@ -900,9 +909,6 @@
900
909
  border-color: var(--m-color-primary-hover);
901
910
  }
902
911
 
903
- .m-inputnumber__input:focus-visible,
904
- .m-password__input:focus-visible,
905
- .m-datepicker__input:focus-visible,
906
912
  .m-inputotp__input:focus-visible,
907
913
  .m-cascadeselect__trigger:focus-visible,
908
914
  .m-treeselect__trigger:focus-visible,
@@ -919,9 +925,6 @@
919
925
  outline: none;
920
926
  }
921
927
 
922
- .m-inputnumber--invalid .m-inputnumber__input:focus-visible,
923
- .m-password--invalid .m-password__input:focus-visible,
924
- .m-datepicker--invalid .m-datepicker__input:focus-visible,
925
928
  .m-inputotp--invalid .m-inputotp__input:focus-visible,
926
929
  .m-inputtags--invalid:focus-within,
927
930
  .m-inputcolor--invalid .m-inputcolor__text:focus-visible {
@@ -1,8 +1,8 @@
1
1
  import { r as e } from "../useComponentAttrs-BTYEe61P.js";
2
- import { t } from "../Icon-DfpIfo2L.js";
2
+ import { t } from "../Icon-B6IBrJ5S.js";
3
3
  import { n, t as r } from "../overlay-oR-5MDuE.js";
4
4
  import { t as i } from "../Scrollbar-BYnCO8fv.js";
5
- import { t as a } from "../icon-xUOyawgJ.js";
5
+ import { t as a } from "../icon-iOBeyIRp.js";
6
6
  import { t as o } from "../key-CaQYVkjh.js";
7
7
  import { t as s } from "../FlyoutSubmenu-B_bkgKag.js";
8
8
  import { c } from "../config-BdK5ccNT.js";