igniteui-webcomponents 4.3.0 → 4.4.0

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 (702) hide show
  1. package/CHANGELOG.md +69 -0
  2. package/animations/presets/fade/index.d.ts +2 -2
  3. package/animations/presets/fade/index.js +4 -6
  4. package/animations/presets/fade/index.js.map +1 -1
  5. package/animations/presets/grow/index.d.ts +2 -2
  6. package/animations/presets/grow/index.js +8 -10
  7. package/animations/presets/grow/index.js.map +1 -1
  8. package/animations/presets/index.d.ts +1 -0
  9. package/animations/presets/index.js +1 -0
  10. package/animations/presets/index.js.map +1 -1
  11. package/animations/presets/slide/index.d.ts +3 -0
  12. package/animations/presets/slide/index.js +16 -0
  13. package/animations/presets/slide/index.js.map +1 -0
  14. package/components/accordion/themes/accordion.base.css.js +1 -4
  15. package/components/accordion/themes/accordion.base.css.js.map +1 -1
  16. package/components/avatar/avatar.js +5 -2
  17. package/components/avatar/avatar.js.map +1 -1
  18. package/components/avatar/themes/avatar.base.css.js +97 -0
  19. package/components/avatar/themes/avatar.base.css.js.map +1 -0
  20. package/components/avatar/themes/dark/avatar.bootstrap.css.js +3 -0
  21. package/components/avatar/themes/dark/avatar.bootstrap.css.js.map +1 -0
  22. package/components/avatar/themes/dark/avatar.fluent.css.js +3 -0
  23. package/components/avatar/themes/dark/avatar.fluent.css.js.map +1 -0
  24. package/components/avatar/themes/dark/avatar.indigo.css.js +3 -0
  25. package/components/avatar/themes/dark/avatar.indigo.css.js.map +1 -0
  26. package/components/avatar/themes/dark/avatar.material.css.js +3 -0
  27. package/components/avatar/themes/dark/avatar.material.css.js.map +1 -0
  28. package/components/avatar/themes/light/avatar.bootstrap.css.js +19 -18
  29. package/components/avatar/themes/light/avatar.bootstrap.css.js.map +1 -1
  30. package/components/avatar/themes/light/avatar.fluent.css.js +27 -0
  31. package/components/avatar/themes/light/avatar.fluent.css.js.map +1 -0
  32. package/components/avatar/themes/light/avatar.indigo.css.js +27 -0
  33. package/components/avatar/themes/light/avatar.indigo.css.js.map +1 -0
  34. package/components/avatar/themes/light/avatar.material.css.js +27 -0
  35. package/components/avatar/themes/light/avatar.material.css.js.map +1 -0
  36. package/components/badge/themes/light/badge.base.css.js +1 -2
  37. package/components/badge/themes/light/badge.base.css.js.map +1 -1
  38. package/components/badge/themes/light/badge.bootstrap.css.js +1 -2
  39. package/components/badge/themes/light/badge.bootstrap.css.js.map +1 -1
  40. package/components/button/button-base.d.ts +14 -6
  41. package/components/button/button-base.js +51 -18
  42. package/components/button/button-base.js.map +1 -1
  43. package/components/button/themes/button/dark/button.bootstrap.css.js +1 -13
  44. package/components/button/themes/button/dark/button.bootstrap.css.js.map +1 -1
  45. package/components/button/themes/button/dark/button.fluent.css.js +1 -13
  46. package/components/button/themes/button/dark/button.fluent.css.js.map +1 -1
  47. package/components/button/themes/button/dark/button.indigo.css.js +1 -13
  48. package/components/button/themes/button/dark/button.indigo.css.js.map +1 -1
  49. package/components/button/themes/button/dark/button.material.css.js +1 -13
  50. package/components/button/themes/button/dark/button.material.css.js.map +1 -1
  51. package/components/button/themes/button/light/button.base.css.js +5 -6
  52. package/components/button/themes/button/light/button.base.css.js.map +1 -1
  53. package/components/button/themes/button/light/button.bootstrap.css.js +80 -62
  54. package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
  55. package/components/button/themes/button/light/button.fluent.css.js +97 -72
  56. package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
  57. package/components/button/themes/button/light/button.indigo.css.js +100 -73
  58. package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
  59. package/components/button/themes/button/light/button.material.css.js +103 -69
  60. package/components/button/themes/button/light/button.material.css.js.map +1 -1
  61. package/components/button/themes/icon-button/dark/icon-button.fluent.css.js +1 -1
  62. package/components/button/themes/icon-button/dark/icon-button.fluent.css.js.map +1 -1
  63. package/components/button/themes/icon-button/light/icon-button.base.css.js +3 -6
  64. package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
  65. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +42 -11
  66. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
  67. package/components/button/themes/icon-button/light/icon-button.fluent.css.js +44 -24
  68. package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
  69. package/components/button/themes/icon-button/light/icon-button.indigo.css.js +36 -7
  70. package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
  71. package/components/button/themes/icon-button/light/icon-button.material.css.js +37 -7
  72. package/components/button/themes/icon-button/light/icon-button.material.css.js.map +1 -1
  73. package/components/calendar/calendar.d.ts +2 -5
  74. package/components/calendar/calendar.js +31 -35
  75. package/components/calendar/calendar.js.map +1 -1
  76. package/components/calendar/days-view/days-view.js +6 -6
  77. package/components/calendar/days-view/days-view.js.map +1 -1
  78. package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js +60 -6
  79. package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js.map +1 -1
  80. package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js +53 -3
  81. package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js.map +1 -1
  82. package/components/calendar/themes/bootstrap/year-month-view.bootstrap.css.js +50 -3
  83. package/components/calendar/themes/bootstrap/year-month-view.bootstrap.css.js.map +1 -1
  84. package/components/calendar/themes/calendar.base.css.js +66 -6
  85. package/components/calendar/themes/calendar.base.css.js.map +1 -1
  86. package/components/calendar/themes/days-view.base.css.js +6 -8
  87. package/components/calendar/themes/days-view.base.css.js.map +1 -1
  88. package/components/calendar/themes/fluent/calendar.fluent.css.js +123 -9
  89. package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
  90. package/components/calendar/themes/fluent/days-view.fluent.css.js +2 -3
  91. package/components/calendar/themes/fluent/days-view.fluent.css.js.map +1 -1
  92. package/components/calendar/themes/fluent/year-month-view.fluent.css.js +1 -2
  93. package/components/calendar/themes/fluent/year-month-view.fluent.css.js.map +1 -1
  94. package/components/calendar/themes/indigo/calendar.indigo.css.js +67 -0
  95. package/components/calendar/themes/indigo/calendar.indigo.css.js.map +1 -0
  96. package/components/calendar/themes/year-month-view.base.css.js +1 -2
  97. package/components/calendar/themes/year-month-view.base.css.js.map +1 -1
  98. package/components/card/card.js +2 -0
  99. package/components/card/card.js.map +1 -1
  100. package/components/card/themes/light/card.actions.bootstrap.css.js +1 -2
  101. package/components/card/themes/light/card.actions.bootstrap.css.js.map +1 -1
  102. package/components/card/themes/light/card.actions.material.css.js +1 -2
  103. package/components/card/themes/light/card.actions.material.css.js.map +1 -1
  104. package/components/card/themes/light/card.bootstrap.css.js +11 -3
  105. package/components/card/themes/light/card.bootstrap.css.js.map +1 -1
  106. package/components/card/themes/light/card.content.bootstrap.css.js +1 -2
  107. package/components/card/themes/light/card.content.bootstrap.css.js.map +1 -1
  108. package/components/card/themes/light/card.content.indigo.css.js +1 -2
  109. package/components/card/themes/light/card.content.indigo.css.js.map +1 -1
  110. package/components/card/themes/light/card.content.material.css.js +1 -2
  111. package/components/card/themes/light/card.content.material.css.js.map +1 -1
  112. package/components/card/themes/light/card.fluent.css.js +11 -4
  113. package/components/card/themes/light/card.fluent.css.js.map +1 -1
  114. package/components/card/themes/light/card.header.bootstrap.css.js +1 -2
  115. package/components/card/themes/light/card.header.bootstrap.css.js.map +1 -1
  116. package/components/card/themes/light/card.header.fluent.css.js +1 -2
  117. package/components/card/themes/light/card.header.fluent.css.js.map +1 -1
  118. package/components/card/themes/light/card.header.indigo.css.js +1 -2
  119. package/components/card/themes/light/card.header.indigo.css.js.map +1 -1
  120. package/components/card/themes/light/card.header.material.css.js +1 -2
  121. package/components/card/themes/light/card.header.material.css.js.map +1 -1
  122. package/components/card/themes/light/card.indigo.css.js +14 -0
  123. package/components/card/themes/light/card.indigo.css.js.map +1 -0
  124. package/components/card/themes/light/card.material.css.js +11 -4
  125. package/components/card/themes/light/card.material.css.js.map +1 -1
  126. package/components/card/themes/light/card.media.material.css.js +1 -2
  127. package/components/card/themes/light/card.media.material.css.js.map +1 -1
  128. package/components/checkbox/checkbox-base.d.ts +8 -35
  129. package/components/checkbox/checkbox-base.js +28 -41
  130. package/components/checkbox/checkbox-base.js.map +1 -1
  131. package/components/checkbox/checkbox.d.ts +0 -1
  132. package/components/checkbox/checkbox.js +5 -16
  133. package/components/checkbox/checkbox.js.map +1 -1
  134. package/components/checkbox/switch.d.ts +0 -2
  135. package/components/checkbox/switch.js +4 -16
  136. package/components/checkbox/switch.js.map +1 -1
  137. package/components/checkbox/themes/dark/checkbox.bootstrap.css.js +1 -13
  138. package/components/checkbox/themes/dark/checkbox.bootstrap.css.js.map +1 -1
  139. package/components/checkbox/themes/dark/checkbox.fluent.css.js +1 -13
  140. package/components/checkbox/themes/dark/checkbox.fluent.css.js.map +1 -1
  141. package/components/checkbox/themes/dark/checkbox.indigo.css.js +1 -13
  142. package/components/checkbox/themes/dark/checkbox.indigo.css.js.map +1 -1
  143. package/components/checkbox/themes/dark/checkbox.material.css.js +1 -13
  144. package/components/checkbox/themes/dark/checkbox.material.css.js.map +1 -1
  145. package/components/checkbox/themes/dark/switch.bootstrap.css.js +1 -13
  146. package/components/checkbox/themes/dark/switch.bootstrap.css.js.map +1 -1
  147. package/components/checkbox/themes/dark/switch.fluent.css.js +1 -13
  148. package/components/checkbox/themes/dark/switch.fluent.css.js.map +1 -1
  149. package/components/checkbox/themes/dark/switch.indigo.css.js +1 -13
  150. package/components/checkbox/themes/dark/switch.indigo.css.js.map +1 -1
  151. package/components/checkbox/themes/dark/switch.material.css.js +1 -13
  152. package/components/checkbox/themes/dark/switch.material.css.js.map +1 -1
  153. package/components/checkbox/themes/light/checkbox.base.css.js +3 -18
  154. package/components/checkbox/themes/light/checkbox.base.css.js.map +1 -1
  155. package/components/checkbox/themes/light/checkbox.bootstrap.css.js +33 -33
  156. package/components/checkbox/themes/light/checkbox.bootstrap.css.js.map +1 -1
  157. package/components/checkbox/themes/light/checkbox.fluent.css.js +37 -37
  158. package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
  159. package/components/checkbox/themes/light/checkbox.indigo.css.js +38 -35
  160. package/components/checkbox/themes/light/checkbox.indigo.css.js.map +1 -1
  161. package/components/checkbox/themes/light/checkbox.material.css.js +31 -33
  162. package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
  163. package/components/checkbox/themes/light/switch.base.css.js +3 -16
  164. package/components/checkbox/themes/light/switch.base.css.js.map +1 -1
  165. package/components/checkbox/themes/light/switch.bootstrap.css.js +18 -27
  166. package/components/checkbox/themes/light/switch.bootstrap.css.js.map +1 -1
  167. package/components/checkbox/themes/light/switch.fluent.css.js +39 -38
  168. package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
  169. package/components/checkbox/themes/light/switch.indigo.css.js +33 -35
  170. package/components/checkbox/themes/light/switch.indigo.css.js.map +1 -1
  171. package/components/checkbox/themes/light/switch.material.css.js +22 -31
  172. package/components/checkbox/themes/light/switch.material.css.js.map +1 -1
  173. package/components/chip/themes/chip.base.css.js +1 -5
  174. package/components/chip/themes/chip.base.css.js.map +1 -1
  175. package/components/chip/themes/chip.bootstrap.css.js +35 -6
  176. package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
  177. package/components/chip/themes/chip.fluent.css.js +35 -5
  178. package/components/chip/themes/chip.fluent.css.js.map +1 -1
  179. package/components/chip/themes/chip.indigo.css.js +35 -5
  180. package/components/chip/themes/chip.indigo.css.js.map +1 -1
  181. package/components/chip/themes/chip.material.css.js +35 -5
  182. package/components/chip/themes/chip.material.css.js.map +1 -1
  183. package/components/combo/combo-header.js +5 -3
  184. package/components/combo/combo-header.js.map +1 -1
  185. package/components/combo/combo-item.js +5 -4
  186. package/components/combo/combo-item.js.map +1 -1
  187. package/components/combo/combo.d.ts +9 -37
  188. package/components/combo/combo.js +71 -58
  189. package/components/combo/combo.js.map +1 -1
  190. package/components/combo/controllers/selection.js +1 -3
  191. package/components/combo/controllers/selection.js.map +1 -1
  192. package/components/combo/themes/dark/combo.indigo.css.js +1 -1
  193. package/components/combo/themes/dark/combo.indigo.css.js.map +1 -1
  194. package/components/combo/themes/dark/combo.material.css.js +1 -1
  195. package/components/combo/themes/dark/combo.material.css.js.map +1 -1
  196. package/components/combo/themes/light/combo.base.css.js +19 -33
  197. package/components/combo/themes/light/combo.base.css.js.map +1 -1
  198. package/components/combo/themes/light/combo.bootstrap.css.js +209 -88
  199. package/components/combo/themes/light/combo.bootstrap.css.js.map +1 -1
  200. package/components/combo/themes/light/combo.fluent.css.js +201 -47
  201. package/components/combo/themes/light/combo.fluent.css.js.map +1 -1
  202. package/components/combo/themes/light/combo.indigo.css.js +213 -25
  203. package/components/combo/themes/light/combo.indigo.css.js.map +1 -1
  204. package/components/combo/themes/light/combo.material.css.js +242 -89
  205. package/components/combo/themes/light/combo.material.css.js.map +1 -1
  206. package/components/combo/themes/light/header/combo-header.base.css.js +3 -7
  207. package/components/combo/themes/light/header/combo-header.base.css.js.map +1 -1
  208. package/components/combo/themes/light/item/combo-item.base.css.js +9 -29
  209. package/components/combo/themes/light/item/combo-item.base.css.js.map +1 -1
  210. package/components/common/localization/validation-en.d.ts +10 -0
  211. package/components/common/localization/validation-en.js +10 -0
  212. package/components/common/localization/validation-en.js.map +1 -0
  213. package/components/common/mixins/event-emitter.js.map +1 -1
  214. package/components/common/mixins/form-associated-required.d.ts +16 -0
  215. package/components/common/mixins/form-associated-required.js +29 -0
  216. package/components/common/mixins/form-associated-required.js.map +1 -0
  217. package/components/common/mixins/form-associated.d.ts +92 -0
  218. package/components/common/mixins/form-associated.js +151 -0
  219. package/components/common/mixins/form-associated.js.map +1 -0
  220. package/components/common/util.d.ts +38 -0
  221. package/components/common/util.js +34 -0
  222. package/components/common/util.js.map +1 -1
  223. package/components/common/validators.d.ts +45 -0
  224. package/components/common/validators.js +54 -0
  225. package/components/common/validators.js.map +1 -0
  226. package/components/date-time-input/date-time-input.d.ts +30 -11
  227. package/components/date-time-input/date-time-input.js +147 -135
  228. package/components/date-time-input/date-time-input.js.map +1 -1
  229. package/components/date-time-input/date-util.d.ts +1 -0
  230. package/components/date-time-input/date-util.js +6 -3
  231. package/components/date-time-input/date-util.js.map +1 -1
  232. package/components/dialog/dialog.js +1 -1
  233. package/components/dialog/dialog.js.map +1 -1
  234. package/components/dialog/themes/light/dialog.base.css.js +2 -5
  235. package/components/dialog/themes/light/dialog.base.css.js.map +1 -1
  236. package/components/dialog/themes/light/dialog.bootstrap.css.js +8 -3
  237. package/components/dialog/themes/light/dialog.bootstrap.css.js.map +1 -1
  238. package/components/dialog/themes/light/dialog.fluent.css.js +10 -1
  239. package/components/dialog/themes/light/dialog.fluent.css.js.map +1 -1
  240. package/components/dialog/themes/light/dialog.indigo.css.js +10 -1
  241. package/components/dialog/themes/light/dialog.indigo.css.js.map +1 -1
  242. package/components/dialog/themes/light/dialog.material.css.js +42 -1
  243. package/components/dialog/themes/light/dialog.material.css.js.map +1 -1
  244. package/components/dropdown/dropdown-group.js +6 -3
  245. package/components/dropdown/dropdown-group.js.map +1 -1
  246. package/components/dropdown/dropdown-header.js +6 -4
  247. package/components/dropdown/dropdown-header.js.map +1 -1
  248. package/components/dropdown/dropdown-item.js +8 -11
  249. package/components/dropdown/dropdown-item.js.map +1 -1
  250. package/components/dropdown/dropdown.js +2 -1
  251. package/components/dropdown/dropdown.js.map +1 -1
  252. package/components/dropdown/themes/dark/dropdown.bootstrap.css.js +1 -1
  253. package/components/dropdown/themes/dark/dropdown.bootstrap.css.js.map +1 -1
  254. package/components/dropdown/themes/dark/dropdown.fluent.css.js +1 -1
  255. package/components/dropdown/themes/dark/dropdown.fluent.css.js.map +1 -1
  256. package/components/dropdown/themes/dark/dropdown.indigo.css.js +1 -1
  257. package/components/dropdown/themes/dark/dropdown.indigo.css.js.map +1 -1
  258. package/components/dropdown/themes/dark/dropdown.material.css.js +3 -0
  259. package/components/dropdown/themes/dark/dropdown.material.css.js.map +1 -0
  260. package/components/dropdown/themes/light/dropdown.base.css.js +1 -7
  261. package/components/dropdown/themes/light/dropdown.base.css.js.map +1 -1
  262. package/components/dropdown/themes/light/dropdown.bootstrap.css.js +28 -4
  263. package/components/dropdown/themes/light/dropdown.bootstrap.css.js.map +1 -1
  264. package/components/dropdown/themes/light/dropdown.fluent.css.js +26 -3
  265. package/components/dropdown/themes/light/dropdown.fluent.css.js.map +1 -1
  266. package/components/dropdown/themes/light/dropdown.indigo.css.js +26 -3
  267. package/components/dropdown/themes/light/dropdown.indigo.css.js.map +1 -1
  268. package/components/dropdown/themes/light/dropdown.material.css.d.ts +1 -0
  269. package/components/dropdown/themes/light/dropdown.material.css.js +33 -0
  270. package/components/dropdown/themes/light/dropdown.material.css.js.map +1 -0
  271. package/components/dropdown/themes/light/group/dropdown-group.base.css.d.ts +1 -0
  272. package/components/dropdown/themes/light/{dropdown-group.base.css.js → group/dropdown-group.base.css.js} +4 -7
  273. package/components/dropdown/themes/light/group/dropdown-group.base.css.js.map +1 -0
  274. package/components/dropdown/themes/light/group/dropdown-group.bootstrap.css.d.ts +1 -0
  275. package/components/dropdown/themes/light/group/dropdown-group.bootstrap.css.js +28 -0
  276. package/components/dropdown/themes/light/group/dropdown-group.bootstrap.css.js.map +1 -0
  277. package/components/dropdown/themes/light/group/dropdown-group.fluent.css.d.ts +1 -0
  278. package/components/dropdown/themes/light/group/dropdown-group.fluent.css.js +29 -0
  279. package/components/dropdown/themes/light/group/dropdown-group.fluent.css.js.map +1 -0
  280. package/components/dropdown/themes/light/group/dropdown-group.indigo.css.d.ts +1 -0
  281. package/components/dropdown/themes/light/group/dropdown-group.indigo.css.js +28 -0
  282. package/components/dropdown/themes/light/group/dropdown-group.indigo.css.js.map +1 -0
  283. package/components/dropdown/themes/light/group/dropdown-group.material.css.d.ts +1 -0
  284. package/components/dropdown/themes/light/group/dropdown-group.material.css.js +28 -0
  285. package/components/dropdown/themes/light/group/dropdown-group.material.css.js.map +1 -0
  286. package/components/dropdown/themes/light/header/dropdown-header.base.css.d.ts +1 -0
  287. package/components/dropdown/themes/light/header/dropdown-header.base.css.js +56 -0
  288. package/components/dropdown/themes/light/header/dropdown-header.base.css.js.map +1 -0
  289. package/components/dropdown/themes/light/header/dropdown-header.bootstrap.css.d.ts +1 -0
  290. package/components/dropdown/themes/light/header/dropdown-header.bootstrap.css.js +28 -0
  291. package/components/dropdown/themes/light/header/dropdown-header.bootstrap.css.js.map +1 -0
  292. package/components/dropdown/themes/light/header/dropdown-header.fluent.css.d.ts +1 -0
  293. package/components/dropdown/themes/light/header/dropdown-header.fluent.css.js +27 -0
  294. package/components/dropdown/themes/light/header/dropdown-header.fluent.css.js.map +1 -0
  295. package/components/dropdown/themes/light/header/dropdown-header.indigo.css.d.ts +1 -0
  296. package/components/dropdown/themes/light/header/dropdown-header.indigo.css.js +28 -0
  297. package/components/dropdown/themes/light/header/dropdown-header.indigo.css.js.map +1 -0
  298. package/components/dropdown/themes/light/header/dropdown-header.material.css.d.ts +1 -0
  299. package/components/dropdown/themes/light/header/dropdown-header.material.css.js +28 -0
  300. package/components/dropdown/themes/light/header/dropdown-header.material.css.js.map +1 -0
  301. package/components/dropdown/themes/light/item/dropdown-item.base.css.d.ts +1 -0
  302. package/components/dropdown/themes/light/item/dropdown-item.base.css.js +105 -0
  303. package/components/dropdown/themes/light/item/dropdown-item.base.css.js.map +1 -0
  304. package/components/dropdown/themes/light/item/dropdown-item.bootstrap.css.d.ts +1 -0
  305. package/components/dropdown/themes/light/item/dropdown-item.bootstrap.css.js +54 -0
  306. package/components/dropdown/themes/light/item/dropdown-item.bootstrap.css.js.map +1 -0
  307. package/components/dropdown/themes/light/item/dropdown-item.fluent.css.d.ts +1 -0
  308. package/components/dropdown/themes/light/item/dropdown-item.fluent.css.js +55 -0
  309. package/components/dropdown/themes/light/item/dropdown-item.fluent.css.js.map +1 -0
  310. package/components/dropdown/themes/light/item/dropdown-item.indigo.css.d.ts +1 -0
  311. package/components/dropdown/themes/light/item/dropdown-item.indigo.css.js +54 -0
  312. package/components/dropdown/themes/light/item/dropdown-item.indigo.css.js.map +1 -0
  313. package/components/dropdown/themes/light/item/dropdown-item.material.css.d.ts +1 -0
  314. package/components/dropdown/themes/light/item/dropdown-item.material.css.js +54 -0
  315. package/components/dropdown/themes/light/item/dropdown-item.material.css.js.map +1 -0
  316. package/components/expansion-panel/expansion-panel.js +1 -1
  317. package/components/expansion-panel/expansion-panel.js.map +1 -1
  318. package/components/expansion-panel/themes/light/expansion-panel.base.css.js +13 -4
  319. package/components/expansion-panel/themes/light/expansion-panel.base.css.js.map +1 -1
  320. package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js +14 -1
  321. package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js.map +1 -1
  322. package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js +14 -1
  323. package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js.map +1 -1
  324. package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js +14 -1
  325. package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js.map +1 -1
  326. package/components/form/form.d.ts +3 -0
  327. package/components/form/form.js.map +1 -1
  328. package/components/icon/dark/icon.bootstrap.css.js +1 -13
  329. package/components/icon/dark/icon.bootstrap.css.js.map +1 -1
  330. package/components/icon/dark/icon.fluent.css.js +1 -13
  331. package/components/icon/dark/icon.fluent.css.js.map +1 -1
  332. package/components/icon/dark/icon.indigo.css.js +1 -13
  333. package/components/icon/dark/icon.indigo.css.js.map +1 -1
  334. package/components/icon/dark/icon.material.css.js +1 -13
  335. package/components/icon/dark/icon.material.css.js.map +1 -1
  336. package/components/icon/icon.base.css.js +1 -10
  337. package/components/icon/icon.base.css.js.map +1 -1
  338. package/components/icon/light/icon.bootstrap.css.js +9 -19
  339. package/components/icon/light/icon.bootstrap.css.js.map +1 -1
  340. package/components/icon/light/icon.fluent.css.js +9 -19
  341. package/components/icon/light/icon.fluent.css.js.map +1 -1
  342. package/components/icon/light/icon.indigo.css.js +9 -19
  343. package/components/icon/light/icon.indigo.css.js.map +1 -1
  344. package/components/icon/light/icon.material.css.js +9 -19
  345. package/components/icon/light/icon.material.css.js.map +1 -1
  346. package/components/input/input-base.d.ts +13 -24
  347. package/components/input/input-base.js +21 -25
  348. package/components/input/input-base.js.map +1 -1
  349. package/components/input/input.d.ts +24 -15
  350. package/components/input/input.js +106 -48
  351. package/components/input/input.js.map +1 -1
  352. package/components/input/themes/dark/input.dark.indigo.css.js +1 -1
  353. package/components/input/themes/dark/input.dark.indigo.css.js.map +1 -1
  354. package/components/input/themes/dark/input.dark.material.css.js +1 -1
  355. package/components/input/themes/dark/input.dark.material.css.js.map +1 -1
  356. package/components/input/themes/light/input.base.css.js +6 -14
  357. package/components/input/themes/light/input.base.css.js.map +1 -1
  358. package/components/input/themes/light/input.bootstrap.css.js +209 -115
  359. package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
  360. package/components/input/themes/light/input.fluent.css.js +144 -61
  361. package/components/input/themes/light/input.fluent.css.js.map +1 -1
  362. package/components/input/themes/light/input.indigo.css.js +170 -43
  363. package/components/input/themes/light/input.indigo.css.js.map +1 -1
  364. package/components/input/themes/light/input.material.css.js +377 -188
  365. package/components/input/themes/light/input.material.css.js.map +1 -1
  366. package/components/list/themes/dark/list.bootstrap.css.js +1 -1
  367. package/components/list/themes/dark/list.bootstrap.css.js.map +1 -1
  368. package/components/list/themes/dark/list.fluent.css.js +1 -1
  369. package/components/list/themes/dark/list.fluent.css.js.map +1 -1
  370. package/components/list/themes/dark/list.indigo.css.js +1 -1
  371. package/components/list/themes/dark/list.indigo.css.js.map +1 -1
  372. package/components/list/themes/light/list-header.base.css.js +0 -33
  373. package/components/list/themes/light/list-header.base.css.js.map +1 -1
  374. package/components/list/themes/light/list-header.indigo.css.js +1 -2
  375. package/components/list/themes/light/list-header.indigo.css.js.map +1 -1
  376. package/components/list/themes/light/list-item.base.css.js +26 -34
  377. package/components/list/themes/light/list-item.base.css.js.map +1 -1
  378. package/components/list/themes/light/list-item.bootstrap.css.js +27 -2
  379. package/components/list/themes/light/list-item.bootstrap.css.js.map +1 -1
  380. package/components/list/themes/light/list-item.fluent.css.js +27 -2
  381. package/components/list/themes/light/list-item.fluent.css.js.map +1 -1
  382. package/components/list/themes/light/list-item.indigo.css.js +27 -2
  383. package/components/list/themes/light/list-item.indigo.css.js.map +1 -1
  384. package/components/list/themes/light/list.base.css.js +27 -2
  385. package/components/list/themes/light/list.base.css.js.map +1 -1
  386. package/components/list/themes/light/list.bootstrap.css.js +27 -3
  387. package/components/list/themes/light/list.bootstrap.css.js.map +1 -1
  388. package/components/mask-input/mask-input-base.d.ts +2 -9
  389. package/components/mask-input/mask-input-base.js +7 -12
  390. package/components/mask-input/mask-input-base.js.map +1 -1
  391. package/components/mask-input/mask-input.d.ts +5 -6
  392. package/components/mask-input/mask-input.js +42 -51
  393. package/components/mask-input/mask-input.js.map +1 -1
  394. package/components/mask-input/mask-parser.js +2 -1
  395. package/components/mask-input/mask-parser.js.map +1 -1
  396. package/components/nav-drawer/themes/dark/nav-drawer-item.base.css.js +1 -1
  397. package/components/nav-drawer/themes/dark/nav-drawer-item.base.css.js.map +1 -1
  398. package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js +1 -1
  399. package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js.map +1 -1
  400. package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js +1 -1
  401. package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js.map +1 -1
  402. package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js +1 -1
  403. package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js.map +1 -1
  404. package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.js +1 -1
  405. package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.js.map +1 -1
  406. package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js +1 -2
  407. package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js.map +1 -1
  408. package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js +1 -2
  409. package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js.map +1 -1
  410. package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js +1 -2
  411. package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js.map +1 -1
  412. package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js +17 -2
  413. package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js.map +1 -1
  414. package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js +17 -1
  415. package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js.map +1 -1
  416. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js +0 -33
  417. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map +1 -1
  418. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js +16 -35
  419. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map +1 -1
  420. package/components/nav-drawer/themes/light/nav-drawer.base.css.js +16 -4
  421. package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map +1 -1
  422. package/components/navbar/themes/dark/navbar.bootstrap.css.js +1 -13
  423. package/components/navbar/themes/dark/navbar.bootstrap.css.js.map +1 -1
  424. package/components/navbar/themes/dark/navbar.fluent.css.js +1 -13
  425. package/components/navbar/themes/dark/navbar.fluent.css.js.map +1 -1
  426. package/components/navbar/themes/dark/navbar.indigo.css.js +1 -13
  427. package/components/navbar/themes/dark/navbar.indigo.css.js.map +1 -1
  428. package/components/navbar/themes/dark/navbar.material.css.js +1 -13
  429. package/components/navbar/themes/dark/navbar.material.css.js.map +1 -1
  430. package/components/navbar/themes/light/navbar.bootstrap.css.js +5 -53
  431. package/components/navbar/themes/light/navbar.bootstrap.css.js.map +1 -1
  432. package/components/navbar/themes/light/navbar.fluent.css.js +4 -52
  433. package/components/navbar/themes/light/navbar.fluent.css.js.map +1 -1
  434. package/components/navbar/themes/light/navbar.indigo.css.js +4 -52
  435. package/components/navbar/themes/light/navbar.indigo.css.js.map +1 -1
  436. package/components/navbar/themes/light/navbar.material.css.js +4 -52
  437. package/components/navbar/themes/light/navbar.material.css.js.map +1 -1
  438. package/components/navbar/themes/navbar.base.css.js +1 -3
  439. package/components/navbar/themes/navbar.base.css.js.map +1 -1
  440. package/components/progress/themes/circular/circular.progress.base.css.js +1 -3
  441. package/components/progress/themes/circular/circular.progress.base.css.js.map +1 -1
  442. package/components/progress/themes/circular/circular.progress.bootstrap.css.js +1 -2
  443. package/components/progress/themes/circular/circular.progress.bootstrap.css.js.map +1 -1
  444. package/components/progress/themes/circular/circular.progress.fluent.css.js +1 -2
  445. package/components/progress/themes/circular/circular.progress.fluent.css.js.map +1 -1
  446. package/components/progress/themes/linear/linear.progress.base.css.js +44 -66
  447. package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
  448. package/components/progress/themes/linear/linear.progress.bootstrap.css.js +11 -65
  449. package/components/progress/themes/linear/linear.progress.bootstrap.css.js.map +1 -1
  450. package/components/progress/themes/linear/linear.progress.fluent.css.js +11 -7
  451. package/components/progress/themes/linear/linear.progress.fluent.css.js.map +1 -1
  452. package/components/progress/themes/linear/linear.progress.indigo.css.js +11 -31
  453. package/components/progress/themes/linear/linear.progress.indigo.css.js.map +1 -1
  454. package/components/radio/radio.d.ts +13 -37
  455. package/components/radio/radio.js +135 -97
  456. package/components/radio/radio.js.map +1 -1
  457. package/components/radio/themes/dark/radio.bootstrap.css.js +1 -13
  458. package/components/radio/themes/dark/radio.bootstrap.css.js.map +1 -1
  459. package/components/radio/themes/dark/radio.fluent.css.js +1 -13
  460. package/components/radio/themes/dark/radio.fluent.css.js.map +1 -1
  461. package/components/radio/themes/dark/radio.indigo.css.js +1 -13
  462. package/components/radio/themes/dark/radio.indigo.css.js.map +1 -1
  463. package/components/radio/themes/dark/radio.material.css.js +1 -13
  464. package/components/radio/themes/dark/radio.material.css.js.map +1 -1
  465. package/components/radio/themes/light/radio.base.css.js +1 -17
  466. package/components/radio/themes/light/radio.base.css.js.map +1 -1
  467. package/components/radio/themes/light/radio.bootstrap.css.js +10 -54
  468. package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
  469. package/components/radio/themes/light/radio.fluent.css.js +2 -50
  470. package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
  471. package/components/radio/themes/light/radio.indigo.css.js +13 -53
  472. package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
  473. package/components/radio/themes/light/radio.material.css.js +4 -49
  474. package/components/radio/themes/light/radio.material.css.js.map +1 -1
  475. package/components/radio-group/radio-group.base.css.js +1 -2
  476. package/components/radio-group/radio-group.base.css.js.map +1 -1
  477. package/components/radio-group/radio-group.d.ts +0 -4
  478. package/components/radio-group/radio-group.fluent.css.js +1 -2
  479. package/components/radio-group/radio-group.fluent.css.js.map +1 -1
  480. package/components/radio-group/radio-group.js +3 -54
  481. package/components/radio-group/radio-group.js.map +1 -1
  482. package/components/radio-group/radio-group.material.css.js +1 -2
  483. package/components/radio-group/radio-group.material.css.js.map +1 -1
  484. package/components/rating/dark/rating.fluent.css.d.ts +1 -0
  485. package/components/rating/dark/rating.fluent.css.js +3 -0
  486. package/components/rating/dark/rating.fluent.css.js.map +1 -0
  487. package/components/rating/rating-symbol.base.css.js +2 -3
  488. package/components/rating/rating-symbol.base.css.js.map +1 -1
  489. package/components/rating/rating.base.css.js +9 -6
  490. package/components/rating/rating.base.css.js.map +1 -1
  491. package/components/rating/rating.bootstrap.css.js +1 -2
  492. package/components/rating/rating.bootstrap.css.js.map +1 -1
  493. package/components/rating/rating.d.ts +10 -11
  494. package/components/rating/rating.fluent.css.js +12 -7
  495. package/components/rating/rating.fluent.css.js.map +1 -1
  496. package/components/rating/rating.indigo.css.js +1 -2
  497. package/components/rating/rating.indigo.css.js.map +1 -1
  498. package/components/rating/rating.js +19 -15
  499. package/components/rating/rating.js.map +1 -1
  500. package/components/ripple/ripple.material.css.js +1 -0
  501. package/components/ripple/ripple.material.css.js.map +1 -1
  502. package/components/select/select-item.d.ts +0 -2
  503. package/components/select/select-item.js +0 -3
  504. package/components/select/select-item.js.map +1 -1
  505. package/components/select/select.d.ts +9 -40
  506. package/components/select/select.js +41 -49
  507. package/components/select/select.js.map +1 -1
  508. package/components/select/themes/dark/select.fluent.css.js +1 -1
  509. package/components/select/themes/dark/select.fluent.css.js.map +1 -1
  510. package/components/select/themes/dark/select.indigo.css.js +1 -1
  511. package/components/select/themes/dark/select.indigo.css.js.map +1 -1
  512. package/components/select/themes/dark/select.material.css.js +1 -1
  513. package/components/select/themes/dark/select.material.css.js.map +1 -1
  514. package/components/select/themes/light/select.base.css.js +1 -10
  515. package/components/select/themes/light/select.base.css.js.map +1 -1
  516. package/components/select/themes/light/select.bootstrap.css.js +121 -42
  517. package/components/select/themes/light/select.bootstrap.css.js.map +1 -1
  518. package/components/select/themes/light/select.fluent.css.js +116 -9
  519. package/components/select/themes/light/select.fluent.css.js.map +1 -1
  520. package/components/select/themes/light/select.indigo.css.js +138 -17
  521. package/components/select/themes/light/select.indigo.css.js.map +1 -1
  522. package/components/select/themes/light/select.material.css.js +162 -27
  523. package/components/select/themes/light/select.material.css.js.map +1 -1
  524. package/components/slider/slider.d.ts +4 -12
  525. package/components/slider/slider.js +16 -25
  526. package/components/slider/slider.js.map +1 -1
  527. package/components/slider/themes/dark/slider.bootstrap.css.js +1 -1
  528. package/components/slider/themes/dark/slider.bootstrap.css.js.map +1 -1
  529. package/components/slider/themes/dark/slider.fluent.css.js +1 -1
  530. package/components/slider/themes/dark/slider.fluent.css.js.map +1 -1
  531. package/components/slider/themes/dark/slider.indigo.css.js +1 -1
  532. package/components/slider/themes/dark/slider.indigo.css.js.map +1 -1
  533. package/components/slider/themes/light/slider.base.css.js +21 -18
  534. package/components/slider/themes/light/slider.base.css.js.map +1 -1
  535. package/components/slider/themes/light/slider.bootstrap.css.js +1 -2
  536. package/components/slider/themes/light/slider.bootstrap.css.js.map +1 -1
  537. package/components/slider/themes/light/slider.fluent.css.js +7 -5
  538. package/components/slider/themes/light/slider.fluent.css.js.map +1 -1
  539. package/components/slider/themes/light/slider.indigo.css.js +5 -3
  540. package/components/slider/themes/light/slider.indigo.css.js.map +1 -1
  541. package/components/slider/themes/light/slider.material.css.js +2 -4
  542. package/components/slider/themes/light/slider.material.css.js.map +1 -1
  543. package/components/snackbar/snackbar.js +1 -1
  544. package/components/snackbar/snackbar.js.map +1 -1
  545. package/components/snackbar/themes/dark/snackbar.indigo.css.js +1 -1
  546. package/components/snackbar/themes/dark/snackbar.indigo.css.js.map +1 -1
  547. package/components/snackbar/themes/light/snackbar.base.css.js +7 -3
  548. package/components/snackbar/themes/light/snackbar.base.css.js.map +1 -1
  549. package/components/snackbar/themes/light/snackbar.bootstrap.css.js +9 -1
  550. package/components/snackbar/themes/light/snackbar.bootstrap.css.js.map +1 -1
  551. package/components/snackbar/themes/light/snackbar.fluent.css.js +9 -2
  552. package/components/snackbar/themes/light/snackbar.fluent.css.js.map +1 -1
  553. package/components/snackbar/themes/light/snackbar.indigo.css.js +9 -2
  554. package/components/snackbar/themes/light/snackbar.indigo.css.js.map +1 -1
  555. package/components/stepper/animations.d.ts +2 -0
  556. package/components/stepper/animations.js +22 -0
  557. package/components/stepper/animations.js.map +1 -0
  558. package/components/stepper/step.d.ts +17 -8
  559. package/components/stepper/step.js +29 -0
  560. package/components/stepper/step.js.map +1 -1
  561. package/components/stepper/stepper.d.ts +19 -3
  562. package/components/stepper/stepper.js +58 -7
  563. package/components/stepper/stepper.js.map +1 -1
  564. package/components/stepper/themes/step/dark/step.bootstrap.css.js +1 -1
  565. package/components/stepper/themes/step/dark/step.bootstrap.css.js.map +1 -1
  566. package/components/stepper/themes/step/dark/step.fluent.css.js +1 -1
  567. package/components/stepper/themes/step/dark/step.fluent.css.js.map +1 -1
  568. package/components/stepper/themes/step/dark/step.indigo.css.js +1 -1
  569. package/components/stepper/themes/step/dark/step.indigo.css.js.map +1 -1
  570. package/components/stepper/themes/step/dark/step.material.css.js +1 -1
  571. package/components/stepper/themes/step/dark/step.material.css.js.map +1 -1
  572. package/components/stepper/themes/step/light/step.base.css.js +46 -174
  573. package/components/stepper/themes/step/light/step.base.css.js.map +1 -1
  574. package/components/stepper/themes/step/light/step.bootstrap.css.js +183 -20
  575. package/components/stepper/themes/step/light/step.bootstrap.css.js.map +1 -1
  576. package/components/stepper/themes/step/light/step.fluent.css.js +179 -13
  577. package/components/stepper/themes/step/light/step.fluent.css.js.map +1 -1
  578. package/components/stepper/themes/step/light/step.indigo.css.js +179 -26
  579. package/components/stepper/themes/step/light/step.indigo.css.js.map +1 -1
  580. package/components/stepper/themes/step/light/step.material.css.js +179 -5
  581. package/components/stepper/themes/step/light/step.material.css.js.map +1 -1
  582. package/components/stepper/themes/stepper/stepper.base.css.js +3 -8
  583. package/components/stepper/themes/stepper/stepper.base.css.js.map +1 -1
  584. package/components/stepper/themes/stepper/stepper.bootstrap.css.js +1 -2
  585. package/components/stepper/themes/stepper/stepper.bootstrap.css.js.map +1 -1
  586. package/components/stepper/themes/stepper/stepper.fluent.css.js +1 -2
  587. package/components/stepper/themes/stepper/stepper.fluent.css.js.map +1 -1
  588. package/components/stepper/themes/stepper/stepper.indigo.css.js +1 -2
  589. package/components/stepper/themes/stepper/stepper.indigo.css.js.map +1 -1
  590. package/components/tabs/themes/dark/tab.dark.base.css.js +1 -1
  591. package/components/tabs/themes/dark/tab.dark.base.css.js.map +1 -1
  592. package/components/tabs/themes/dark/tab.dark.bootstrap.css.js +1 -1
  593. package/components/tabs/themes/dark/tab.dark.bootstrap.css.js.map +1 -1
  594. package/components/tabs/themes/light/tab-panel.base.css.js +1 -2
  595. package/components/tabs/themes/light/tab-panel.base.css.js.map +1 -1
  596. package/components/tabs/themes/light/tab.base.css.js +24 -3
  597. package/components/tabs/themes/light/tab.base.css.js.map +1 -1
  598. package/components/tabs/themes/light/tab.bootstrap.css.js +27 -6
  599. package/components/tabs/themes/light/tab.bootstrap.css.js.map +1 -1
  600. package/components/tabs/themes/light/tab.fluent.css.js +24 -2
  601. package/components/tabs/themes/light/tab.fluent.css.js.map +1 -1
  602. package/components/tabs/themes/light/tab.indigo.css.js +24 -2
  603. package/components/tabs/themes/light/tab.indigo.css.js.map +1 -1
  604. package/components/tabs/themes/light/tabs.base.css.js +1 -3
  605. package/components/tabs/themes/light/tabs.base.css.js.map +1 -1
  606. package/components/tabs/themes/light/tabs.bootstrap.css.js +1 -2
  607. package/components/tabs/themes/light/tabs.bootstrap.css.js.map +1 -1
  608. package/components/tabs/themes/light/tabs.fluent.css.js +1 -2
  609. package/components/tabs/themes/light/tabs.fluent.css.js.map +1 -1
  610. package/components/tabs/themes/light/tabs.indigo.css.js +1 -2
  611. package/components/tabs/themes/light/tabs.indigo.css.js.map +1 -1
  612. package/components/toast/themes/toast.base.css.js +37 -2
  613. package/components/toast/themes/toast.base.css.js.map +1 -1
  614. package/components/toast/themes/toast.bootstrap.css.js +6 -3
  615. package/components/toast/themes/toast.bootstrap.css.js.map +1 -1
  616. package/components/toast/themes/toast.fluent.css.js +6 -3
  617. package/components/toast/themes/toast.fluent.css.js.map +1 -1
  618. package/components/toast/themes/toast.indigo.css.js +6 -3
  619. package/components/toast/themes/toast.indigo.css.js.map +1 -1
  620. package/components/toast/toast.js +1 -1
  621. package/components/toast/toast.js.map +1 -1
  622. package/components/tree/themes/dark/tree-item.bootstrap.css.js +1 -1
  623. package/components/tree/themes/dark/tree-item.bootstrap.css.js.map +1 -1
  624. package/components/tree/themes/dark/tree-item.fluent.css.js +1 -1
  625. package/components/tree/themes/dark/tree-item.fluent.css.js.map +1 -1
  626. package/components/tree/themes/dark/tree-item.indigo.css.js +1 -1
  627. package/components/tree/themes/dark/tree-item.indigo.css.js.map +1 -1
  628. package/components/tree/themes/light/tree-item.base.css.js +18 -7
  629. package/components/tree/themes/light/tree-item.base.css.js.map +1 -1
  630. package/components/tree/themes/light/tree-item.bootstrap.css.js +59 -3
  631. package/components/tree/themes/light/tree-item.bootstrap.css.js.map +1 -1
  632. package/components/tree/themes/light/tree-item.fluent.css.js +57 -1
  633. package/components/tree/themes/light/tree-item.fluent.css.js.map +1 -1
  634. package/components/tree/themes/light/tree-item.indigo.css.js +57 -1
  635. package/components/tree/themes/light/tree-item.indigo.css.js.map +1 -1
  636. package/components/tree/themes/light/tree-item.material.css.d.ts +1 -0
  637. package/components/tree/themes/light/tree-item.material.css.js +58 -0
  638. package/components/tree/themes/light/tree-item.material.css.js.map +1 -0
  639. package/components/tree/themes/light/tree.base.css.js +1 -2
  640. package/components/tree/themes/light/tree.base.css.js.map +1 -1
  641. package/components/tree/tree-item.d.ts +7 -2
  642. package/components/tree/tree-item.js +37 -16
  643. package/components/tree/tree-item.js.map +1 -1
  644. package/components/tree/tree.d.ts +0 -6
  645. package/components/tree/tree.js +0 -4
  646. package/components/tree/tree.js.map +1 -1
  647. package/components/tree/tree.navigation.js +3 -2
  648. package/components/tree/tree.navigation.js.map +1 -1
  649. package/custom-elements.json +798 -525
  650. package/package.json +4 -4
  651. package/themes/dark/bootstrap.css +491 -102
  652. package/themes/dark/fluent.css +531 -125
  653. package/themes/dark/indigo.css +739 -97
  654. package/themes/dark/material.css +445 -94
  655. package/themes/light/bootstrap.css +5 -49
  656. package/themes/light/fluent.css +5 -49
  657. package/themes/light/indigo.css +229 -49
  658. package/themes/light/material.css +5 -49
  659. package/theming/theming-controller.d.ts +3 -2
  660. package/theming/theming-controller.js +38 -19
  661. package/theming/theming-controller.js.map +1 -1
  662. package/theming/theming-decorator.d.ts +4 -3
  663. package/theming/theming-decorator.js +3 -5
  664. package/theming/theming-decorator.js.map +1 -1
  665. package/theming/types.d.ts +1 -9
  666. package/theming/types.js.map +1 -1
  667. package/vscode-html-custom-data.json +242 -289
  668. package/components/avatar/themes/dark/avatar.base.bootstrap.css.js +0 -15
  669. package/components/avatar/themes/dark/avatar.base.bootstrap.css.js.map +0 -1
  670. package/components/avatar/themes/light/avatar.base.css.js +0 -130
  671. package/components/avatar/themes/light/avatar.base.css.js.map +0 -1
  672. package/components/common/types.d.ts +0 -1
  673. package/components/common/types.js +0 -2
  674. package/components/common/types.js.map +0 -1
  675. package/components/dropdown/themes/light/dropdown-group.base.css.js.map +0 -1
  676. package/components/dropdown/themes/light/dropdown-group.fluent.css.js +0 -6
  677. package/components/dropdown/themes/light/dropdown-group.fluent.css.js.map +0 -1
  678. package/components/dropdown/themes/light/dropdown-header.base.css.js +0 -61
  679. package/components/dropdown/themes/light/dropdown-header.base.css.js.map +0 -1
  680. package/components/dropdown/themes/light/dropdown-header.bootstrap.css.js +0 -6
  681. package/components/dropdown/themes/light/dropdown-header.bootstrap.css.js.map +0 -1
  682. package/components/dropdown/themes/light/dropdown-header.fluent.css.js +0 -6
  683. package/components/dropdown/themes/light/dropdown-header.fluent.css.js.map +0 -1
  684. package/components/dropdown/themes/light/dropdown-item.base.css.js +0 -124
  685. package/components/dropdown/themes/light/dropdown-item.base.css.js.map +0 -1
  686. package/components/dropdown/themes/light/dropdown-item.bootstrap.css.js +0 -27
  687. package/components/dropdown/themes/light/dropdown-item.bootstrap.css.js.map +0 -1
  688. package/components/dropdown/themes/light/dropdown-item.fluent.css.js +0 -27
  689. package/components/dropdown/themes/light/dropdown-item.fluent.css.js.map +0 -1
  690. package/components/dropdown/themes/light/dropdown-item.indigo.css.js +0 -27
  691. package/components/dropdown/themes/light/dropdown-item.indigo.css.js.map +0 -1
  692. /package/components/avatar/themes/{light/avatar.base.css.d.ts → avatar.base.css.d.ts} +0 -0
  693. /package/components/avatar/themes/dark/{avatar.base.bootstrap.css.d.ts → avatar.bootstrap.css.d.ts} +0 -0
  694. /package/components/{dropdown/themes/light/dropdown-group.base.css.d.ts → avatar/themes/dark/avatar.fluent.css.d.ts} +0 -0
  695. /package/components/{dropdown/themes/light/dropdown-group.fluent.css.d.ts → avatar/themes/dark/avatar.indigo.css.d.ts} +0 -0
  696. /package/components/{dropdown/themes/light/dropdown-header.base.css.d.ts → avatar/themes/dark/avatar.material.css.d.ts} +0 -0
  697. /package/components/{dropdown/themes/light/dropdown-header.bootstrap.css.d.ts → avatar/themes/light/avatar.fluent.css.d.ts} +0 -0
  698. /package/components/{dropdown/themes/light/dropdown-header.fluent.css.d.ts → avatar/themes/light/avatar.indigo.css.d.ts} +0 -0
  699. /package/components/{dropdown/themes/light/dropdown-item.base.css.d.ts → avatar/themes/light/avatar.material.css.d.ts} +0 -0
  700. /package/components/{dropdown/themes/light/dropdown-item.bootstrap.css.d.ts → calendar/themes/indigo/calendar.indigo.css.d.ts} +0 -0
  701. /package/components/{dropdown/themes/light/dropdown-item.fluent.css.d.ts → card/themes/light/card.indigo.css.d.ts} +0 -0
  702. /package/components/dropdown/themes/{light/dropdown-item.indigo.css.d.ts → dark/dropdown.material.css.d.ts} +0 -0
package/components/button/themes/button/light/button.fluent.css.js CHANGED
@@ -1,19 +1,5 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
3
- /* stylelint-disable max-line-length */
4
- /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
5
- /* stylelint-disable max-line-length */
6
- /* stylelint-disable max-line-length */
7
- /* stylelint-disable max-line-length */
8
- /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
9
- /* stylelint-disable max-line-length */
10
- /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
11
- /* stylelint-disable max-line-length */
12
- /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
13
- /* stylelint-disable max-line-length */
14
- /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
15
- :host([variant=flat]),
16
- :host([variant=flat]) [igxButton=flat], :host([variant=flat]) .igx-button--flat {
2
+ export const styles = css `:host([variant=flat]) {
17
3
  --shadow-color: var(--ig-button-shadow-color, transparent);
18
4
  --border-color: var(--ig-button-border-color, transparent);
19
5
  --hover-border-color: var(--ig-button-hover-border-color, transparent);
@@ -23,6 +9,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
23
9
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
24
10
  --disabled-background: var(--ig-button-disabled-background, transparent);
25
11
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));
12
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));
26
13
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
27
14
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
28
15
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -37,14 +24,14 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
37
24
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-800), var(--ig-gray-a)));
38
25
  --active-background: var(--ig-button-active-background, transparent);
39
26
  --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));
40
- --border-radius: var(--ig-button-border-radius, 0rem);
27
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 1.25rem), 1.25rem));
41
28
  }
42
29
  :host([variant=flat]) [part=base] {
43
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
30
+ height: var(--size);
31
+ border-radius: var(--border-radius);
44
32
  }
45
33
 
46
- :host([variant=outlined]),
47
- :host([variant=outlined]) [igxButton=outlined], :host([variant=outlined]) .igx-button--outlined {
34
+ :host([variant=outlined]) {
48
35
  --shadow-color: var(--ig-button-shadow-color, transparent);
49
36
  --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));
50
37
  --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));
@@ -54,6 +41,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
54
41
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
55
42
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
56
43
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), 0.5));
44
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));
57
45
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
58
46
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
59
47
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -68,14 +56,17 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
68
56
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));
69
57
  --active-background: var(--ig-button-active-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));
70
58
  --active-foreground: var(--ig-button-active-foreground, var(--ig-gray-300-contrast));
71
- --border-radius: var(--ig-button-border-radius, 0.125rem);
59
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));
72
60
  }
73
61
  :host([variant=outlined]) [part=base] {
74
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
62
+ height: var(--size);
63
+ border-radius: var(--border-radius);
64
+ }
65
+ :host([variant=outlined]) [part=base]::after {
66
+ border-radius: calc(var(--border-radius) - 0.25rem);
75
67
  }
76
68
 
77
- :host([variant=contained]),
78
- :host([variant=contained]) [igxButton=raised], :host([variant=contained]) .igx-button--raised {
69
+ :host([variant=contained]) {
79
70
  --shadow-color: var(--ig-button-shadow-color, transparent);
80
71
  --border-color: var(--ig-button-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
81
72
  --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));
@@ -85,6 +76,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
85
76
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
86
77
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
87
78
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));
79
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));
88
80
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
89
81
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
90
82
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -99,17 +91,17 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
99
91
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));
100
92
  --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));
101
93
  --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));
102
- --border-radius: var(--ig-button-border-radius, 0.125rem);
94
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));
103
95
  }
104
96
  :host([variant=contained]) [part=base] {
105
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
97
+ height: var(--size);
98
+ border-radius: var(--border-radius);
99
+ }
100
+ :host([variant=contained]) [part=base]::after {
101
+ border-radius: calc(var(--border-radius) - 0.25rem);
106
102
  }
107
103
 
108
104
  :host([variant=fab]) {
109
- --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.5rem, -1 * 2.5rem), var(--is-small, 1) * max(2rem, -1 * 2rem));
110
- }
111
- :host([variant=fab]),
112
- :host([variant=fab]) [igxButton=fab], :host([variant=fab]) .igx-button--fab {
113
105
  --shadow-color: var(--ig-button-shadow-color, transparent);
114
106
  --border-color: var(--ig-button-border-color, var(--ig-gray-900-contrast));
115
107
  --hover-border-color: var(--ig-button-hover-border-color, var(--ig-gray-900-contrast));
@@ -119,6 +111,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
119
111
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
120
112
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
121
113
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));
114
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));
122
115
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
123
116
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
124
117
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -133,78 +126,85 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
133
126
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));
134
127
  --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));
135
128
  --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));
136
- --border-radius: var(--ig-button-border-radius, 0.875rem);
129
+ --border-radius: var(--ig-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 0.5) * 1.75rem), 1.75rem));
137
130
  }
138
131
  :host([variant=fab]) [part=base] {
139
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
132
+ height: var(--size);
133
+ border-radius: var(--border-radius);
140
134
  }
141
135
  :host([variant=fab]) [part=base]::after {
142
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * calc(var(--border-radius) - 0.25rem)), calc(var(--border-radius) - 0.25rem));
143
- }
144
-
145
- :host {
146
- --size: max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem));
136
+ border-radius: calc(var(--border-radius) - 0.25rem);
147
137
  }
148
138
 
149
139
  [part=base] {
150
140
  padding: 0 max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)), var(--is-small, 1) * max(8px, -1 * 8px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));
151
141
  -webkit-transition: all 0.1s ease-in-out;
152
- -o-transition: all 0.1s ease-in-out;
153
142
  transition: all 0.1s ease-in-out;
154
143
  }
155
144
 
156
- :host(:not([disabled])[variant=flat]) [part=base] {
145
+ :host(:not([disabled])[variant=flat]) [part=base],
146
+ :host(:not(:disabled)[variant=flat]) [part=base] {
157
147
  color: var(--foreground);
158
148
  background: var(--background);
159
149
  border: 1px solid var(--border-color);
160
150
  }
161
- :host(:not([disabled])[variant=flat]) [part=base]:hover {
151
+ :host(:not([disabled])[variant=flat]) [part=base]:hover,
152
+ :host(:not(:disabled)[variant=flat]) [part=base]:hover {
162
153
  color: var(--hover-foreground);
163
154
  background: var(--hover-background);
164
155
  border-color: var(--hover-border-color);
165
156
  }
166
- :host(:not([disabled])[variant=flat]) [part=base]:focus {
157
+ :host(:not([disabled])[variant=flat]) [part=base]:focus,
158
+ :host(:not(:disabled)[variant=flat]) [part=base]:focus {
167
159
  color: var(--focus-foreground);
168
160
  background: var(--focus-background);
169
161
  border-color: var(--focus-border-color);
170
162
  }
171
- :host(:not([disabled])[variant=flat]) [part=base]:active {
163
+ :host(:not([disabled])[variant=flat]) [part=base]:active,
164
+ :host(:not(:disabled)[variant=flat]) [part=base]:active {
172
165
  color: var(--active-foreground);
173
166
  background: var(--active-background);
174
167
  border-color: var(--active-border-color);
175
168
  }
176
- :host(:not([disabled])[variant=flat]) [part=base]:focus-visible {
169
+ :host(:not([disabled])[variant=flat]) [part=base]:focus-visible,
170
+ :host(:not(:disabled)[variant=flat]) [part=base]:focus-visible {
177
171
  color: var(--focus-visible-foreground);
178
172
  background: var(--focus-visible-background);
179
173
  border-color: var(--focus-visible-border-color);
180
174
  }
181
175
 
182
- :host(:not([disabled])[variant=outlined]) [part=base] {
176
+ :host(:not([disabled])[variant=outlined]) [part=base],
177
+ :host(:not(:disabled)[variant=outlined]) [part=base] {
183
178
  color: var(--foreground);
184
179
  background: var(--background);
185
180
  border: 0.0625rem solid var(--border-color);
186
181
  }
187
- :host(:not([disabled])[variant=outlined]) [part=base]:hover {
182
+ :host(:not([disabled])[variant=outlined]) [part=base]:hover,
183
+ :host(:not(:disabled)[variant=outlined]) [part=base]:hover {
188
184
  color: var(--hover-foreground);
189
185
  background: var(--hover-background);
190
186
  border-color: var(--hover-border-color);
191
187
  }
192
- :host(:not([disabled])[variant=outlined]) [part=base]:focus {
188
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus,
189
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus {
193
190
  color: var(--focus-foreground);
194
191
  background: var(--focus-background);
195
192
  border-color: var(--focus-border-color);
196
193
  }
197
- :host(:not([disabled])[variant=outlined]) [part=base]:active {
194
+ :host(:not([disabled])[variant=outlined]) [part=base]:active,
195
+ :host(:not(:disabled)[variant=outlined]) [part=base]:active {
198
196
  color: var(--active-foreground);
199
197
  background: var(--active-background);
200
198
  border-color: var(--active-border-color);
201
199
  }
202
- :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible {
200
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible,
201
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible {
203
202
  color: var(--focus-visible-foreground);
204
203
  background: var(--focus-visible-background);
205
204
  border-color: var(--focus-visible-border-color);
206
205
  }
207
- :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible::after {
206
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible::after,
207
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible::after {
208
208
  content: "";
209
209
  position: absolute;
210
210
  inset-block-start: 0.125rem;
@@ -215,52 +215,62 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
215
215
  -webkit-box-shadow: 0 0 0 0.0625rem var(--focus-visible-foreground);
216
216
  box-shadow: 0 0 0 0.0625rem var(--focus-visible-foreground);
217
217
  }
218
- :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover {
218
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover,
219
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:hover {
219
220
  color: var(--hover-foreground);
220
221
  background: var(--hover-background);
221
222
  border-color: var(--hover-border-color);
222
223
  }
223
- :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover::after {
224
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover::after,
225
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:hover::after {
224
226
  -webkit-box-shadow: 0 0 0 0.0625rem var(--hover-foreground);
225
227
  box-shadow: 0 0 0 0.0625rem var(--hover-foreground);
226
228
  }
227
- :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active {
229
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active,
230
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:active {
228
231
  color: var(--active-foreground);
229
232
  background: var(--active-background);
230
233
  border-color: var(--active-border-color);
231
234
  }
232
- :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active::after {
235
+ :host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active::after,
236
+ :host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:active::after {
233
237
  -webkit-box-shadow: 0 0 0 0.0625rem var(--active-foreground);
234
238
  box-shadow: 0 0 0 0.0625rem var(--active-foreground);
235
239
  }
236
240
 
237
- :host(:not([disabled])[variant=contained]) [part=base] {
241
+ :host(:not([disabled])[variant=contained]) [part=base],
242
+ :host(:not(:disabled)[variant=contained]) [part=base] {
238
243
  color: var(--foreground);
239
244
  background: var(--background);
240
245
  border: 0.0625rem solid var(--border-color);
241
246
  }
242
- :host(:not([disabled])[variant=contained]) [part=base]:hover {
247
+ :host(:not([disabled])[variant=contained]) [part=base]:hover,
248
+ :host(:not(:disabled)[variant=contained]) [part=base]:hover {
243
249
  color: var(--hover-foreground);
244
250
  background: var(--hover-background);
245
251
  border-color: var(--hover-border-color);
246
252
  }
247
- :host(:not([disabled])[variant=contained]) [part=base]:focus {
253
+ :host(:not([disabled])[variant=contained]) [part=base]:focus,
254
+ :host(:not(:disabled)[variant=contained]) [part=base]:focus {
248
255
  color: var(--focus-foreground);
249
256
  background: var(--focus-background);
250
257
  border-color: var(--focus-border-color);
251
258
  }
252
- :host(:not([disabled])[variant=contained]) [part=base]:active {
259
+ :host(:not([disabled])[variant=contained]) [part=base]:active,
260
+ :host(:not(:disabled)[variant=contained]) [part=base]:active {
253
261
  color: var(--active-foreground);
254
262
  background: var(--active-background);
255
263
  border-color: var(--active-border-color);
256
264
  }
257
- :host(:not([disabled])[variant=contained]) [part=base]:focus-visible {
265
+ :host(:not([disabled])[variant=contained]) [part=base]:focus-visible,
266
+ :host(:not(:disabled)[variant=contained]) [part=base]:focus-visible {
258
267
  color: var(--focus-visible-foreground);
259
268
  background: var(--focus-visible-background);
260
269
  border-color: var(--focus-visible-border-color);
261
270
  position: relative;
262
271
  }
263
- :host(:not([disabled])[variant=contained]) [part=base]:focus-visible::after {
272
+ :host(:not([disabled])[variant=contained]) [part=base]:focus-visible::after,
273
+ :host(:not(:disabled)[variant=contained]) [part=base]:focus-visible::after {
264
274
  content: "";
265
275
  -webkit-box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);
266
276
  box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);
@@ -271,44 +281,52 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
271
281
  width: calc(100% - 6px);
272
282
  height: calc(100% - 6px);
273
283
  }
274
- :host(:not([disabled])[variant=contained]) [part=base]:focus-visible:hover {
284
+ :host(:not([disabled])[variant=contained]) [part=base]:focus-visible:hover,
285
+ :host(:not(:disabled)[variant=contained]) [part=base]:focus-visible:hover {
275
286
  color: var(--hover-foreground);
276
287
  background: var(--hover-background);
277
288
  border-color: var(--hover-border-color);
278
289
  }
279
- :host(:not([disabled])[variant=contained]) [part=base]:focus-visible:active {
290
+ :host(:not([disabled])[variant=contained]) [part=base]:focus-visible:active,
291
+ :host(:not(:disabled)[variant=contained]) [part=base]:focus-visible:active {
280
292
  color: var(--active-foreground);
281
293
  background: var(--active-background);
282
294
  border-color: var(--active-border-color);
283
295
  }
284
296
 
285
- :host(:not([disabled])[variant=fab]) [part=base] {
297
+ :host(:not([disabled])[variant=fab]) [part=base],
298
+ :host(:not(:disabled)[variant=fab]) [part=base] {
286
299
  color: var(--foreground);
287
300
  background: var(--background);
288
301
  border: 0.0625rem solid var(--border-color);
289
302
  }
290
- :host(:not([disabled])[variant=fab]) [part=base]:hover {
303
+ :host(:not([disabled])[variant=fab]) [part=base]:hover,
304
+ :host(:not(:disabled)[variant=fab]) [part=base]:hover {
291
305
  color: var(--hover-foreground);
292
306
  background: var(--hover-background);
293
307
  border-color: var(--hover-border-color);
294
308
  }
295
- :host(:not([disabled])[variant=fab]) [part=base]:focus {
309
+ :host(:not([disabled])[variant=fab]) [part=base]:focus,
310
+ :host(:not(:disabled)[variant=fab]) [part=base]:focus {
296
311
  color: var(--focus-foreground);
297
312
  background: var(--focus-background);
298
313
  border-color: var(--focus-border-color);
299
314
  }
300
- :host(:not([disabled])[variant=fab]) [part=base]:active {
315
+ :host(:not([disabled])[variant=fab]) [part=base]:active,
316
+ :host(:not(:disabled)[variant=fab]) [part=base]:active {
301
317
  color: var(--active-foreground);
302
318
  background: var(--active-background);
303
319
  border-color: var(--active-border-color);
304
320
  }
305
- :host(:not([disabled])[variant=fab]) [part=base]:focus-visible {
321
+ :host(:not([disabled])[variant=fab]) [part=base]:focus-visible,
322
+ :host(:not(:disabled)[variant=fab]) [part=base]:focus-visible {
306
323
  color: var(--focus-visible-foreground);
307
324
  background: var(--focus-visible-background);
308
325
  border-color: var(--focus-visible-border-color);
309
326
  position: relative;
310
327
  }
311
- :host(:not([disabled])[variant=fab]) [part=base]:focus-visible::after {
328
+ :host(:not([disabled])[variant=fab]) [part=base]:focus-visible::after,
329
+ :host(:not(:disabled)[variant=fab]) [part=base]:focus-visible::after {
312
330
  content: "";
313
331
  -webkit-box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);
314
332
  box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);
@@ -319,34 +337,41 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
319
337
  width: calc(100% - 6px);
320
338
  height: calc(100% - 6px);
321
339
  }
322
- :host(:not([disabled])[variant=fab]) [part=base]:focus-visible:hover {
340
+ :host(:not([disabled])[variant=fab]) [part=base]:focus-visible:hover,
341
+ :host(:not(:disabled)[variant=fab]) [part=base]:focus-visible:hover {
323
342
  color: var(--hover-foreground);
324
343
  background: var(--hover-background);
325
344
  border-color: var(--hover-border-color);
326
345
  }
327
- :host(:not([disabled])[variant=fab]) [part=base]:focus-visible:active {
346
+ :host(:not([disabled])[variant=fab]) [part=base]:focus-visible:active,
347
+ :host(:not(:disabled)[variant=fab]) [part=base]:focus-visible:active {
328
348
  color: var(--active-foreground);
329
349
  background: var(--active-background);
330
350
  border-color: var(--active-border-color);
331
351
  }
332
352
 
333
- :host([disabled][variant=flat]) [part=base] {
353
+ :host([disabled][variant=flat]) [part=base],
354
+ :host(:disabled[variant=flat]) [part=base] {
334
355
  color: var(--disabled-foreground);
335
356
  background: var(--disabled-background);
336
357
  }
337
358
 
338
- :host([disabled][variant=outlined]) [part=base] {
359
+ :host([disabled][variant=outlined]) [part=base],
360
+ :host(:disabled[variant=outlined]) [part=base] {
339
361
  color: var(--disabled-foreground);
340
362
  background: var(--disabled-background);
341
363
  border-color: var(--disabled-border-color);
342
364
  }
343
365
 
344
- :host([disabled][variant=contained]) [part=base] {
366
+ :host([disabled][variant=contained]) [part=base],
367
+ :host(:disabled[variant=contained]) [part=base] {
345
368
  color: var(--disabled-foreground);
346
369
  background: var(--disabled-background);
370
+ border: 0.0625rem solid var(--disabled-border-color);
347
371
  }
348
372
 
349
- :host([disabled][variant=fab]) [part=base] {
373
+ :host([disabled][variant=fab]) [part=base],
374
+ :host(:disabled[variant=fab]) [part=base] {
350
375
  color: var(--disabled-foreground);
351
376
  background: var(--disabled-background);
352
377
  }`;
package/components/button/themes/button/light/button.fluent.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8VvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n:host([variant=flat]),\n:host([variant=flat]) [igxButton=flat], :host([variant=flat]) .igx-button--flat {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, transparent);\n --hover-border-color: var(--ig-button-hover-border-color, transparent);\n --focus-border-color: var(--ig-button-focus-border-color, transparent);\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --active-border-color: var(--ig-button-active-border-color, transparent);\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, transparent);\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, transparent);\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, transparent);\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --focus-background: var(--ig-button-focus-background, transparent);\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-secondary-500), var(--ig-secondary-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, transparent);\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, transparent);\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, 0rem);\n}\n:host([variant=flat]) [part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\n\n:host([variant=outlined]),\n:host([variant=outlined]) [igxButton=outlined], :host([variant=outlined]) .igx-button--outlined {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), 0.5));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, transparent);\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, transparent);\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-gray-300-contrast));\n --border-radius: var(--ig-button-border-radius, 0.125rem);\n}\n:host([variant=outlined]) [part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\n\n:host([variant=contained]),\n:host([variant=contained]) [igxButton=raised], :host([variant=contained]) .igx-button--raised {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --foreground: var(--ig-button-foreground, var(--ig-primary-900-contrast));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, var(--ig-primary-900-contrast));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, var(--ig-primary-900-contrast));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));\n --border-radius: var(--ig-button-border-radius, 0.125rem);\n}\n:host([variant=contained]) [part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\n\n:host([variant=fab]) {\n --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.5rem, -1 * 2.5rem), var(--is-small, 1) * max(2rem, -1 * 2rem));\n}\n:host([variant=fab]),\n:host([variant=fab]) [igxButton=fab], :host([variant=fab]) .igx-button--fab {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, var(--ig-gray-900-contrast));\n --hover-border-color: var(--ig-button-hover-border-color, var(--ig-gray-900-contrast));\n --focus-border-color: var(--ig-button-focus-border-color, var(--ig-gray-900-contrast));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, var(--ig-gray-900-contrast));\n --active-border-color: var(--ig-button-active-border-color, var(--ig-gray-900-contrast));\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --foreground: var(--ig-button-foreground, var(--ig-primary-900-contrast));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, var(--ig-primary-900-contrast));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, var(--ig-primary-900-contrast));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));\n --border-radius: var(--ig-button-border-radius, 0.875rem);\n}\n:host([variant=fab]) [part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\n:host([variant=fab]) [part=base]::after {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * calc(var(--border-radius) - 0.25rem)), calc(var(--border-radius) - 0.25rem));\n}\n\n:host {\n --size: max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem));\n}\n\n[part=base] {\n padding: 0 max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)), var(--is-small, 1) * max(8px, -1 * 8px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n -webkit-transition: all 0.1s ease-in-out;\n -o-transition: all 0.1s ease-in-out;\n transition: all 0.1s ease-in-out;\n}\n\n:host(:not([disabled])[variant=flat]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 1px solid var(--border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 0.0625rem solid var(--border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible::after {\n content: \"\";\n position: absolute;\n inset-block-start: 0.125rem;\n inset-inline-start: 0.125rem;\n pointer-events: none;\n width: calc(100% - (0.125rem * 2));\n height: calc(100% - (0.125rem * 2));\n -webkit-box-shadow: 0 0 0 0.0625rem var(--focus-visible-foreground);\n box-shadow: 0 0 0 0.0625rem var(--focus-visible-foreground);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover::after {\n -webkit-box-shadow: 0 0 0 0.0625rem var(--hover-foreground);\n box-shadow: 0 0 0 0.0625rem var(--hover-foreground);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active::after {\n -webkit-box-shadow: 0 0 0 0.0625rem var(--active-foreground);\n box-shadow: 0 0 0 0.0625rem var(--active-foreground);\n}\n\n:host(:not([disabled])[variant=contained]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 0.0625rem solid var(--border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n position: relative;\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible::after {\n content: \"\";\n -webkit-box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n position: absolute;\n inset-block-start: 3px;\n inset-inline-start: 3px;\n pointer-events: none;\n width: calc(100% - 6px);\n height: calc(100% - 6px);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n\n:host(:not([disabled])[variant=fab]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 0.0625rem solid var(--border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n position: relative;\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible::after {\n content: \"\";\n -webkit-box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n position: absolute;\n inset-block-start: 3px;\n inset-inline-start: 3px;\n pointer-events: none;\n width: calc(100% - 6px);\n height: calc(100% - 6px);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n\n:host([disabled][variant=flat]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}\n\n:host([disabled][variant=outlined]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n border-color: var(--disabled-border-color);\n}\n\n:host([disabled][variant=contained]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}\n\n:host([disabled][variant=fab]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}`;\n"]}
1
+ {"version":3,"file":"button.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuXvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host([variant=flat]) {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, transparent);\n --hover-border-color: var(--ig-button-hover-border-color, transparent);\n --focus-border-color: var(--ig-button-focus-border-color, transparent);\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --active-border-color: var(--ig-button-active-border-color, transparent);\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, transparent);\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, transparent);\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, transparent);\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --focus-background: var(--ig-button-focus-background, transparent);\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-secondary-500), var(--ig-secondary-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, transparent);\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, transparent);\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 1.25rem), 1.25rem));\n}\n:host([variant=flat]) [part=base] {\n height: var(--size);\n border-radius: var(--border-radius);\n}\n\n:host([variant=outlined]) {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), 0.5));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, transparent);\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, transparent);\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-gray-300-contrast));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));\n}\n:host([variant=outlined]) [part=base] {\n height: var(--size);\n border-radius: var(--border-radius);\n}\n:host([variant=outlined]) [part=base]::after {\n border-radius: calc(var(--border-radius) - 0.25rem);\n}\n\n:host([variant=contained]) {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --foreground: var(--ig-button-foreground, var(--ig-primary-900-contrast));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, var(--ig-primary-900-contrast));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, var(--ig-primary-900-contrast));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));\n}\n:host([variant=contained]) [part=base] {\n height: var(--size);\n border-radius: var(--border-radius);\n}\n:host([variant=contained]) [part=base]::after {\n border-radius: calc(var(--border-radius) - 0.25rem);\n}\n\n:host([variant=fab]) {\n --shadow-color: var(--ig-button-shadow-color, transparent);\n --border-color: var(--ig-button-border-color, var(--ig-gray-900-contrast));\n --hover-border-color: var(--ig-button-hover-border-color, var(--ig-gray-900-contrast));\n --focus-border-color: var(--ig-button-focus-border-color, var(--ig-gray-900-contrast));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, var(--ig-gray-900-contrast));\n --active-border-color: var(--ig-button-active-border-color, var(--ig-gray-900-contrast));\n --disabled-border-color: var(--ig-button-disabled-border-color, transparent);\n --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));\n --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));\n --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));\n --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));\n --active-elevation: var(--ig-button-active-elevation, var(--ig-elevation-0));\n --background: var(--ig-button-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --foreground: var(--ig-button-foreground, var(--ig-primary-900-contrast));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, var(--ig-primary-900-contrast));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, var(--ig-primary-900-contrast));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));\n --border-radius: var(--ig-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 0.5) * 1.75rem), 1.75rem));\n}\n:host([variant=fab]) [part=base] {\n height: var(--size);\n border-radius: var(--border-radius);\n}\n:host([variant=fab]) [part=base]::after {\n border-radius: calc(var(--border-radius) - 0.25rem);\n}\n\n[part=base] {\n padding: 0 max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)), var(--is-small, 1) * max(8px, -1 * 8px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n -webkit-transition: all 0.1s ease-in-out;\n transition: all 0.1s ease-in-out;\n}\n\n:host(:not([disabled])[variant=flat]) [part=base],\n:host(:not(:disabled)[variant=flat]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 1px solid var(--border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:hover,\n:host(:not(:disabled)[variant=flat]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus,\n:host(:not(:disabled)[variant=flat]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:active,\n:host(:not(:disabled)[variant=flat]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus-visible,\n:host(:not(:disabled)[variant=flat]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base],\n:host(:not(:disabled)[variant=outlined]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 0.0625rem solid var(--border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover,\n:host(:not(:disabled)[variant=outlined]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:active,\n:host(:not(:disabled)[variant=outlined]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible::after,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible::after {\n content: \"\";\n position: absolute;\n inset-block-start: 0.125rem;\n inset-inline-start: 0.125rem;\n pointer-events: none;\n width: calc(100% - (0.125rem * 2));\n height: calc(100% - (0.125rem * 2));\n -webkit-box-shadow: 0 0 0 0.0625rem var(--focus-visible-foreground);\n box-shadow: 0 0 0 0.0625rem var(--focus-visible-foreground);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover::after,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:hover::after {\n -webkit-box-shadow: 0 0 0 0.0625rem var(--hover-foreground);\n box-shadow: 0 0 0 0.0625rem var(--hover-foreground);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active::after,\n:host(:not(:disabled)[variant=outlined]) [part=base]:focus-visible:active::after {\n -webkit-box-shadow: 0 0 0 0.0625rem var(--active-foreground);\n box-shadow: 0 0 0 0.0625rem var(--active-foreground);\n}\n\n:host(:not([disabled])[variant=contained]) [part=base],\n:host(:not(:disabled)[variant=contained]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 0.0625rem solid var(--border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:hover,\n:host(:not(:disabled)[variant=contained]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus,\n:host(:not(:disabled)[variant=contained]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:active,\n:host(:not(:disabled)[variant=contained]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible,\n:host(:not(:disabled)[variant=contained]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n position: relative;\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible::after,\n:host(:not(:disabled)[variant=contained]) [part=base]:focus-visible::after {\n content: \"\";\n -webkit-box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n position: absolute;\n inset-block-start: 3px;\n inset-inline-start: 3px;\n pointer-events: none;\n width: calc(100% - 6px);\n height: calc(100% - 6px);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible:hover,\n:host(:not(:disabled)[variant=contained]) [part=base]:focus-visible:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible:active,\n:host(:not(:disabled)[variant=contained]) [part=base]:focus-visible:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n\n:host(:not([disabled])[variant=fab]) [part=base],\n:host(:not(:disabled)[variant=fab]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border: 0.0625rem solid var(--border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover,\n:host(:not(:disabled)[variant=fab]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus,\n:host(:not(:disabled)[variant=fab]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:active,\n:host(:not(:disabled)[variant=fab]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible,\n:host(:not(:disabled)[variant=fab]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n border-color: var(--focus-visible-border-color);\n position: relative;\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible::after,\n:host(:not(:disabled)[variant=fab]) [part=base]:focus-visible::after {\n content: \"\";\n -webkit-box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n box-shadow: 0 0 0 1px var(--ig-primary-600-contrast);\n position: absolute;\n inset-block-start: 3px;\n inset-inline-start: 3px;\n pointer-events: none;\n width: calc(100% - 6px);\n height: calc(100% - 6px);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible:hover,\n:host(:not(:disabled)[variant=fab]) [part=base]:focus-visible:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible:active,\n:host(:not(:disabled)[variant=fab]) [part=base]:focus-visible:active {\n color: var(--active-foreground);\n background: var(--active-background);\n border-color: var(--active-border-color);\n}\n\n:host([disabled][variant=flat]) [part=base],\n:host(:disabled[variant=flat]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}\n\n:host([disabled][variant=outlined]) [part=base],\n:host(:disabled[variant=outlined]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n border-color: var(--disabled-border-color);\n}\n\n:host([disabled][variant=contained]) [part=base],\n:host(:disabled[variant=contained]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n border: 0.0625rem solid var(--disabled-border-color);\n}\n\n:host([disabled][variant=fab]) [part=base],\n:host(:disabled[variant=fab]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}`;\n"]}