igniteui-webcomponents 4.3.0 → 4.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (571) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/components/accordion/themes/accordion.base.css.js +1 -4
  3. package/components/accordion/themes/accordion.base.css.js.map +1 -1
  4. package/components/avatar/themes/dark/avatar.base.bootstrap.css.js +1 -13
  5. package/components/avatar/themes/dark/avatar.base.bootstrap.css.js.map +1 -1
  6. package/components/avatar/themes/light/avatar.base.css.js +5 -20
  7. package/components/avatar/themes/light/avatar.base.css.js.map +1 -1
  8. package/components/avatar/themes/light/avatar.bootstrap.css.js +2 -15
  9. package/components/avatar/themes/light/avatar.bootstrap.css.js.map +1 -1
  10. package/components/badge/themes/light/badge.base.css.js +1 -2
  11. package/components/badge/themes/light/badge.base.css.js.map +1 -1
  12. package/components/badge/themes/light/badge.bootstrap.css.js +1 -2
  13. package/components/badge/themes/light/badge.bootstrap.css.js.map +1 -1
  14. package/components/button/themes/button/dark/button.bootstrap.css.js +1 -13
  15. package/components/button/themes/button/dark/button.bootstrap.css.js.map +1 -1
  16. package/components/button/themes/button/dark/button.fluent.css.js +1 -13
  17. package/components/button/themes/button/dark/button.fluent.css.js.map +1 -1
  18. package/components/button/themes/button/dark/button.indigo.css.js +1 -13
  19. package/components/button/themes/button/dark/button.indigo.css.js.map +1 -1
  20. package/components/button/themes/button/dark/button.material.css.js +1 -13
  21. package/components/button/themes/button/dark/button.material.css.js.map +1 -1
  22. package/components/button/themes/button/light/button.base.css.js +1 -2
  23. package/components/button/themes/button/light/button.base.css.js.map +1 -1
  24. package/components/button/themes/button/light/button.bootstrap.css.js +16 -30
  25. package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
  26. package/components/button/themes/button/light/button.fluent.css.js +22 -32
  27. package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
  28. package/components/button/themes/button/light/button.indigo.css.js +16 -33
  29. package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
  30. package/components/button/themes/button/light/button.material.css.js +15 -31
  31. package/components/button/themes/button/light/button.material.css.js.map +1 -1
  32. package/components/button/themes/icon-button/dark/icon-button.fluent.css.js +1 -1
  33. package/components/button/themes/icon-button/dark/icon-button.fluent.css.js.map +1 -1
  34. package/components/button/themes/icon-button/light/icon-button.base.css.js +1 -5
  35. package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
  36. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +30 -4
  37. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
  38. package/components/button/themes/icon-button/light/icon-button.fluent.css.js +40 -21
  39. package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
  40. package/components/button/themes/icon-button/light/icon-button.indigo.css.js +30 -3
  41. package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
  42. package/components/button/themes/icon-button/light/icon-button.material.css.js +30 -3
  43. package/components/button/themes/icon-button/light/icon-button.material.css.js.map +1 -1
  44. package/components/calendar/calendar.d.ts +2 -5
  45. package/components/calendar/calendar.js +31 -35
  46. package/components/calendar/calendar.js.map +1 -1
  47. package/components/calendar/days-view/days-view.js +6 -6
  48. package/components/calendar/days-view/days-view.js.map +1 -1
  49. package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js +60 -6
  50. package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js.map +1 -1
  51. package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js +53 -3
  52. package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js.map +1 -1
  53. package/components/calendar/themes/bootstrap/year-month-view.bootstrap.css.js +50 -3
  54. package/components/calendar/themes/bootstrap/year-month-view.bootstrap.css.js.map +1 -1
  55. package/components/calendar/themes/calendar.base.css.js +66 -7
  56. package/components/calendar/themes/calendar.base.css.js.map +1 -1
  57. package/components/calendar/themes/days-view.base.css.js +6 -8
  58. package/components/calendar/themes/days-view.base.css.js.map +1 -1
  59. package/components/calendar/themes/fluent/calendar.fluent.css.js +123 -10
  60. package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
  61. package/components/calendar/themes/fluent/days-view.fluent.css.js +2 -3
  62. package/components/calendar/themes/fluent/days-view.fluent.css.js.map +1 -1
  63. package/components/calendar/themes/fluent/year-month-view.fluent.css.js +1 -2
  64. package/components/calendar/themes/fluent/year-month-view.fluent.css.js.map +1 -1
  65. package/components/calendar/themes/indigo/calendar.indigo.css.js +67 -0
  66. package/components/calendar/themes/indigo/calendar.indigo.css.js.map +1 -0
  67. package/components/calendar/themes/year-month-view.base.css.js +1 -2
  68. package/components/calendar/themes/year-month-view.base.css.js.map +1 -1
  69. package/components/card/card.js +2 -0
  70. package/components/card/card.js.map +1 -1
  71. package/components/card/themes/light/card.actions.bootstrap.css.js +1 -2
  72. package/components/card/themes/light/card.actions.bootstrap.css.js.map +1 -1
  73. package/components/card/themes/light/card.actions.material.css.js +1 -2
  74. package/components/card/themes/light/card.actions.material.css.js.map +1 -1
  75. package/components/card/themes/light/card.bootstrap.css.js +11 -3
  76. package/components/card/themes/light/card.bootstrap.css.js.map +1 -1
  77. package/components/card/themes/light/card.content.bootstrap.css.js +1 -2
  78. package/components/card/themes/light/card.content.bootstrap.css.js.map +1 -1
  79. package/components/card/themes/light/card.content.indigo.css.js +1 -2
  80. package/components/card/themes/light/card.content.indigo.css.js.map +1 -1
  81. package/components/card/themes/light/card.content.material.css.js +1 -2
  82. package/components/card/themes/light/card.content.material.css.js.map +1 -1
  83. package/components/card/themes/light/card.fluent.css.js +11 -4
  84. package/components/card/themes/light/card.fluent.css.js.map +1 -1
  85. package/components/card/themes/light/card.header.bootstrap.css.js +1 -2
  86. package/components/card/themes/light/card.header.bootstrap.css.js.map +1 -1
  87. package/components/card/themes/light/card.header.fluent.css.js +1 -2
  88. package/components/card/themes/light/card.header.fluent.css.js.map +1 -1
  89. package/components/card/themes/light/card.header.indigo.css.js +1 -2
  90. package/components/card/themes/light/card.header.indigo.css.js.map +1 -1
  91. package/components/card/themes/light/card.header.material.css.js +1 -2
  92. package/components/card/themes/light/card.header.material.css.js.map +1 -1
  93. package/components/card/themes/light/card.indigo.css.js +14 -0
  94. package/components/card/themes/light/card.indigo.css.js.map +1 -0
  95. package/components/card/themes/light/card.material.css.js +11 -4
  96. package/components/card/themes/light/card.material.css.js.map +1 -1
  97. package/components/card/themes/light/card.media.material.css.js +1 -2
  98. package/components/card/themes/light/card.media.material.css.js.map +1 -1
  99. package/components/checkbox/themes/dark/checkbox.bootstrap.css.js +1 -13
  100. package/components/checkbox/themes/dark/checkbox.bootstrap.css.js.map +1 -1
  101. package/components/checkbox/themes/dark/checkbox.fluent.css.js +1 -13
  102. package/components/checkbox/themes/dark/checkbox.fluent.css.js.map +1 -1
  103. package/components/checkbox/themes/dark/checkbox.indigo.css.js +1 -13
  104. package/components/checkbox/themes/dark/checkbox.indigo.css.js.map +1 -1
  105. package/components/checkbox/themes/dark/checkbox.material.css.js +1 -13
  106. package/components/checkbox/themes/dark/checkbox.material.css.js.map +1 -1
  107. package/components/checkbox/themes/dark/switch.bootstrap.css.js +1 -13
  108. package/components/checkbox/themes/dark/switch.bootstrap.css.js.map +1 -1
  109. package/components/checkbox/themes/dark/switch.fluent.css.js +1 -13
  110. package/components/checkbox/themes/dark/switch.fluent.css.js.map +1 -1
  111. package/components/checkbox/themes/dark/switch.indigo.css.js +1 -13
  112. package/components/checkbox/themes/dark/switch.indigo.css.js.map +1 -1
  113. package/components/checkbox/themes/dark/switch.material.css.js +1 -13
  114. package/components/checkbox/themes/dark/switch.material.css.js.map +1 -1
  115. package/components/checkbox/themes/light/checkbox.base.css.js +1 -17
  116. package/components/checkbox/themes/light/checkbox.base.css.js.map +1 -1
  117. package/components/checkbox/themes/light/checkbox.bootstrap.css.js +7 -24
  118. package/components/checkbox/themes/light/checkbox.bootstrap.css.js.map +1 -1
  119. package/components/checkbox/themes/light/checkbox.fluent.css.js +6 -22
  120. package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
  121. package/components/checkbox/themes/light/checkbox.indigo.css.js +7 -22
  122. package/components/checkbox/themes/light/checkbox.indigo.css.js.map +1 -1
  123. package/components/checkbox/themes/light/checkbox.material.css.js +7 -21
  124. package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
  125. package/components/checkbox/themes/light/switch.base.css.js +1 -15
  126. package/components/checkbox/themes/light/switch.base.css.js.map +1 -1
  127. package/components/checkbox/themes/light/switch.bootstrap.css.js +6 -23
  128. package/components/checkbox/themes/light/switch.bootstrap.css.js.map +1 -1
  129. package/components/checkbox/themes/light/switch.fluent.css.js +6 -23
  130. package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
  131. package/components/checkbox/themes/light/switch.indigo.css.js +7 -24
  132. package/components/checkbox/themes/light/switch.indigo.css.js.map +1 -1
  133. package/components/checkbox/themes/light/switch.material.css.js +8 -24
  134. package/components/checkbox/themes/light/switch.material.css.js.map +1 -1
  135. package/components/chip/themes/chip.base.css.js +1 -3
  136. package/components/chip/themes/chip.base.css.js.map +1 -1
  137. package/components/chip/themes/chip.bootstrap.css.js +33 -4
  138. package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
  139. package/components/chip/themes/chip.fluent.css.js +33 -3
  140. package/components/chip/themes/chip.fluent.css.js.map +1 -1
  141. package/components/chip/themes/chip.indigo.css.js +33 -3
  142. package/components/chip/themes/chip.indigo.css.js.map +1 -1
  143. package/components/chip/themes/chip.material.css.js +33 -3
  144. package/components/chip/themes/chip.material.css.js.map +1 -1
  145. package/components/combo/combo-header.js +5 -3
  146. package/components/combo/combo-header.js.map +1 -1
  147. package/components/combo/combo-item.js +5 -4
  148. package/components/combo/combo-item.js.map +1 -1
  149. package/components/combo/combo.d.ts +2 -5
  150. package/components/combo/combo.js +18 -13
  151. package/components/combo/combo.js.map +1 -1
  152. package/components/combo/themes/dark/combo.indigo.css.js +1 -1
  153. package/components/combo/themes/dark/combo.indigo.css.js.map +1 -1
  154. package/components/combo/themes/dark/combo.material.css.js +1 -1
  155. package/components/combo/themes/dark/combo.material.css.js.map +1 -1
  156. package/components/combo/themes/light/combo.base.css.js +19 -33
  157. package/components/combo/themes/light/combo.base.css.js.map +1 -1
  158. package/components/combo/themes/light/combo.bootstrap.css.js +206 -88
  159. package/components/combo/themes/light/combo.bootstrap.css.js.map +1 -1
  160. package/components/combo/themes/light/combo.fluent.css.js +201 -50
  161. package/components/combo/themes/light/combo.fluent.css.js.map +1 -1
  162. package/components/combo/themes/light/combo.indigo.css.js +210 -25
  163. package/components/combo/themes/light/combo.indigo.css.js.map +1 -1
  164. package/components/combo/themes/light/combo.material.css.js +234 -90
  165. package/components/combo/themes/light/combo.material.css.js.map +1 -1
  166. package/components/combo/themes/light/header/combo-header.base.css.js +3 -7
  167. package/components/combo/themes/light/header/combo-header.base.css.js.map +1 -1
  168. package/components/combo/themes/light/item/combo-item.base.css.js +9 -28
  169. package/components/combo/themes/light/item/combo-item.base.css.js.map +1 -1
  170. package/components/common/mixins/event-emitter.js.map +1 -1
  171. package/components/dialog/themes/light/dialog.base.css.js +1 -4
  172. package/components/dialog/themes/light/dialog.base.css.js.map +1 -1
  173. package/components/dialog/themes/light/dialog.bootstrap.css.js +8 -3
  174. package/components/dialog/themes/light/dialog.bootstrap.css.js.map +1 -1
  175. package/components/dialog/themes/light/dialog.fluent.css.js +10 -1
  176. package/components/dialog/themes/light/dialog.fluent.css.js.map +1 -1
  177. package/components/dialog/themes/light/dialog.indigo.css.js +10 -1
  178. package/components/dialog/themes/light/dialog.indigo.css.js.map +1 -1
  179. package/components/dialog/themes/light/dialog.material.css.js +42 -1
  180. package/components/dialog/themes/light/dialog.material.css.js.map +1 -1
  181. package/components/dropdown/dropdown-group.js +6 -3
  182. package/components/dropdown/dropdown-group.js.map +1 -1
  183. package/components/dropdown/dropdown-header.js +6 -4
  184. package/components/dropdown/dropdown-header.js.map +1 -1
  185. package/components/dropdown/dropdown-item.js +6 -5
  186. package/components/dropdown/dropdown-item.js.map +1 -1
  187. package/components/dropdown/dropdown.js +2 -1
  188. package/components/dropdown/dropdown.js.map +1 -1
  189. package/components/dropdown/themes/dark/dropdown.bootstrap.css.js +1 -1
  190. package/components/dropdown/themes/dark/dropdown.bootstrap.css.js.map +1 -1
  191. package/components/dropdown/themes/dark/dropdown.fluent.css.js +1 -1
  192. package/components/dropdown/themes/dark/dropdown.fluent.css.js.map +1 -1
  193. package/components/dropdown/themes/dark/dropdown.indigo.css.js +1 -1
  194. package/components/dropdown/themes/dark/dropdown.indigo.css.js.map +1 -1
  195. package/components/dropdown/themes/dark/dropdown.material.css.js +3 -0
  196. package/components/dropdown/themes/dark/dropdown.material.css.js.map +1 -0
  197. package/components/dropdown/themes/light/dropdown.base.css.js +1 -7
  198. package/components/dropdown/themes/light/dropdown.base.css.js.map +1 -1
  199. package/components/dropdown/themes/light/dropdown.bootstrap.css.js +28 -4
  200. package/components/dropdown/themes/light/dropdown.bootstrap.css.js.map +1 -1
  201. package/components/dropdown/themes/light/dropdown.fluent.css.js +26 -3
  202. package/components/dropdown/themes/light/dropdown.fluent.css.js.map +1 -1
  203. package/components/dropdown/themes/light/dropdown.indigo.css.js +26 -3
  204. package/components/dropdown/themes/light/dropdown.indigo.css.js.map +1 -1
  205. package/components/dropdown/themes/light/dropdown.material.css.js +33 -0
  206. package/components/dropdown/themes/light/dropdown.material.css.js.map +1 -0
  207. package/components/dropdown/themes/light/{dropdown-group.base.css.js → group/dropdown-group.base.css.js} +4 -7
  208. package/components/dropdown/themes/light/group/dropdown-group.base.css.js.map +1 -0
  209. package/components/dropdown/themes/light/group/dropdown-group.bootstrap.css.js +28 -0
  210. package/components/dropdown/themes/light/group/dropdown-group.bootstrap.css.js.map +1 -0
  211. package/components/dropdown/themes/light/group/dropdown-group.fluent.css.js +29 -0
  212. package/components/dropdown/themes/light/group/dropdown-group.fluent.css.js.map +1 -0
  213. package/components/dropdown/themes/light/group/dropdown-group.indigo.css.js +28 -0
  214. package/components/dropdown/themes/light/group/dropdown-group.indigo.css.js.map +1 -0
  215. package/components/dropdown/themes/light/group/dropdown-group.material.css.js +28 -0
  216. package/components/dropdown/themes/light/group/dropdown-group.material.css.js.map +1 -0
  217. package/components/dropdown/themes/light/header/dropdown-header.base.css.d.ts +1 -0
  218. package/components/dropdown/themes/light/header/dropdown-header.base.css.js +56 -0
  219. package/components/dropdown/themes/light/header/dropdown-header.base.css.js.map +1 -0
  220. package/components/dropdown/themes/light/header/dropdown-header.bootstrap.css.d.ts +1 -0
  221. package/components/dropdown/themes/light/header/dropdown-header.bootstrap.css.js +28 -0
  222. package/components/dropdown/themes/light/header/dropdown-header.bootstrap.css.js.map +1 -0
  223. package/components/dropdown/themes/light/header/dropdown-header.fluent.css.d.ts +1 -0
  224. package/components/dropdown/themes/light/header/dropdown-header.fluent.css.js +27 -0
  225. package/components/dropdown/themes/light/header/dropdown-header.fluent.css.js.map +1 -0
  226. package/components/dropdown/themes/light/header/dropdown-header.indigo.css.d.ts +1 -0
  227. package/components/dropdown/themes/light/header/dropdown-header.indigo.css.js +28 -0
  228. package/components/dropdown/themes/light/header/dropdown-header.indigo.css.js.map +1 -0
  229. package/components/dropdown/themes/light/header/dropdown-header.material.css.d.ts +1 -0
  230. package/components/dropdown/themes/light/header/dropdown-header.material.css.js +28 -0
  231. package/components/dropdown/themes/light/header/dropdown-header.material.css.js.map +1 -0
  232. package/components/dropdown/themes/light/item/dropdown-item.base.css.d.ts +1 -0
  233. package/components/dropdown/themes/light/item/dropdown-item.base.css.js +105 -0
  234. package/components/dropdown/themes/light/item/dropdown-item.base.css.js.map +1 -0
  235. package/components/dropdown/themes/light/item/dropdown-item.bootstrap.css.d.ts +1 -0
  236. package/components/dropdown/themes/light/item/dropdown-item.bootstrap.css.js +54 -0
  237. package/components/dropdown/themes/light/item/dropdown-item.bootstrap.css.js.map +1 -0
  238. package/components/dropdown/themes/light/item/dropdown-item.fluent.css.d.ts +1 -0
  239. package/components/dropdown/themes/light/item/dropdown-item.fluent.css.js +55 -0
  240. package/components/dropdown/themes/light/item/dropdown-item.fluent.css.js.map +1 -0
  241. package/components/dropdown/themes/light/item/dropdown-item.indigo.css.d.ts +1 -0
  242. package/components/dropdown/themes/light/item/dropdown-item.indigo.css.js +54 -0
  243. package/components/dropdown/themes/light/item/dropdown-item.indigo.css.js.map +1 -0
  244. package/components/dropdown/themes/light/item/dropdown-item.material.css.d.ts +1 -0
  245. package/components/dropdown/themes/light/item/dropdown-item.material.css.js +54 -0
  246. package/components/dropdown/themes/light/item/dropdown-item.material.css.js.map +1 -0
  247. package/components/expansion-panel/themes/light/expansion-panel.base.css.js +13 -4
  248. package/components/expansion-panel/themes/light/expansion-panel.base.css.js.map +1 -1
  249. package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js +14 -1
  250. package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js.map +1 -1
  251. package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js +14 -1
  252. package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js.map +1 -1
  253. package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js +14 -1
  254. package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js.map +1 -1
  255. package/components/icon/dark/icon.bootstrap.css.js +1 -13
  256. package/components/icon/dark/icon.bootstrap.css.js.map +1 -1
  257. package/components/icon/dark/icon.fluent.css.js +1 -13
  258. package/components/icon/dark/icon.fluent.css.js.map +1 -1
  259. package/components/icon/dark/icon.indigo.css.js +1 -13
  260. package/components/icon/dark/icon.indigo.css.js.map +1 -1
  261. package/components/icon/dark/icon.material.css.js +1 -13
  262. package/components/icon/dark/icon.material.css.js.map +1 -1
  263. package/components/icon/icon.base.css.js +2 -3
  264. package/components/icon/icon.base.css.js.map +1 -1
  265. package/components/icon/light/icon.bootstrap.css.js +3 -19
  266. package/components/icon/light/icon.bootstrap.css.js.map +1 -1
  267. package/components/icon/light/icon.fluent.css.js +3 -19
  268. package/components/icon/light/icon.fluent.css.js.map +1 -1
  269. package/components/icon/light/icon.indigo.css.js +3 -19
  270. package/components/icon/light/icon.indigo.css.js.map +1 -1
  271. package/components/icon/light/icon.material.css.js +3 -19
  272. package/components/icon/light/icon.material.css.js.map +1 -1
  273. package/components/input/input-base.d.ts +3 -4
  274. package/components/input/input-base.js +3 -6
  275. package/components/input/input-base.js.map +1 -1
  276. package/components/input/themes/dark/input.dark.indigo.css.js +1 -1
  277. package/components/input/themes/dark/input.dark.indigo.css.js.map +1 -1
  278. package/components/input/themes/dark/input.dark.material.css.js +1 -1
  279. package/components/input/themes/dark/input.dark.material.css.js.map +1 -1
  280. package/components/input/themes/light/input.base.css.js +6 -11
  281. package/components/input/themes/light/input.base.css.js.map +1 -1
  282. package/components/input/themes/light/input.bootstrap.css.js +208 -104
  283. package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
  284. package/components/input/themes/light/input.fluent.css.js +143 -47
  285. package/components/input/themes/light/input.fluent.css.js.map +1 -1
  286. package/components/input/themes/light/input.indigo.css.js +157 -45
  287. package/components/input/themes/light/input.indigo.css.js.map +1 -1
  288. package/components/input/themes/light/input.material.css.js +356 -186
  289. package/components/input/themes/light/input.material.css.js.map +1 -1
  290. package/components/list/themes/dark/list.bootstrap.css.js +1 -1
  291. package/components/list/themes/dark/list.bootstrap.css.js.map +1 -1
  292. package/components/list/themes/dark/list.fluent.css.js +1 -1
  293. package/components/list/themes/dark/list.fluent.css.js.map +1 -1
  294. package/components/list/themes/dark/list.indigo.css.js +1 -1
  295. package/components/list/themes/dark/list.indigo.css.js.map +1 -1
  296. package/components/list/themes/light/list-header.base.css.js +1 -2
  297. package/components/list/themes/light/list-header.base.css.js.map +1 -1
  298. package/components/list/themes/light/list-header.indigo.css.js +1 -2
  299. package/components/list/themes/light/list-header.indigo.css.js.map +1 -1
  300. package/components/list/themes/light/list-item.base.css.js +27 -3
  301. package/components/list/themes/light/list-item.base.css.js.map +1 -1
  302. package/components/list/themes/light/list-item.bootstrap.css.js +27 -2
  303. package/components/list/themes/light/list-item.bootstrap.css.js.map +1 -1
  304. package/components/list/themes/light/list-item.fluent.css.js +27 -2
  305. package/components/list/themes/light/list-item.fluent.css.js.map +1 -1
  306. package/components/list/themes/light/list-item.indigo.css.js +27 -2
  307. package/components/list/themes/light/list-item.indigo.css.js.map +1 -1
  308. package/components/list/themes/light/list.base.css.js +27 -2
  309. package/components/list/themes/light/list.base.css.js.map +1 -1
  310. package/components/list/themes/light/list.bootstrap.css.js +27 -3
  311. package/components/list/themes/light/list.bootstrap.css.js.map +1 -1
  312. package/components/mask-input/mask-parser.js +1 -1
  313. package/components/mask-input/mask-parser.js.map +1 -1
  314. package/components/nav-drawer/themes/dark/nav-drawer-item.base.css.js +1 -1
  315. package/components/nav-drawer/themes/dark/nav-drawer-item.base.css.js.map +1 -1
  316. package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js +1 -1
  317. package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js.map +1 -1
  318. package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js +1 -1
  319. package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js.map +1 -1
  320. package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js +1 -1
  321. package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js.map +1 -1
  322. package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.js +1 -1
  323. package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.js.map +1 -1
  324. package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js +1 -2
  325. package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js.map +1 -1
  326. package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js +1 -2
  327. package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js.map +1 -1
  328. package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js +1 -2
  329. package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js.map +1 -1
  330. package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js +17 -2
  331. package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js.map +1 -1
  332. package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js +17 -1
  333. package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js.map +1 -1
  334. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js +1 -2
  335. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map +1 -1
  336. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js +19 -5
  337. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map +1 -1
  338. package/components/nav-drawer/themes/light/nav-drawer.base.css.js +16 -4
  339. package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map +1 -1
  340. package/components/navbar/themes/dark/navbar.bootstrap.css.js +1 -13
  341. package/components/navbar/themes/dark/navbar.bootstrap.css.js.map +1 -1
  342. package/components/navbar/themes/dark/navbar.fluent.css.js +1 -13
  343. package/components/navbar/themes/dark/navbar.fluent.css.js.map +1 -1
  344. package/components/navbar/themes/dark/navbar.indigo.css.js +1 -13
  345. package/components/navbar/themes/dark/navbar.indigo.css.js.map +1 -1
  346. package/components/navbar/themes/dark/navbar.material.css.js +1 -13
  347. package/components/navbar/themes/dark/navbar.material.css.js.map +1 -1
  348. package/components/navbar/themes/light/navbar.bootstrap.css.js +6 -22
  349. package/components/navbar/themes/light/navbar.bootstrap.css.js.map +1 -1
  350. package/components/navbar/themes/light/navbar.fluent.css.js +5 -21
  351. package/components/navbar/themes/light/navbar.fluent.css.js.map +1 -1
  352. package/components/navbar/themes/light/navbar.indigo.css.js +5 -21
  353. package/components/navbar/themes/light/navbar.indigo.css.js.map +1 -1
  354. package/components/navbar/themes/light/navbar.material.css.js +5 -21
  355. package/components/navbar/themes/light/navbar.material.css.js.map +1 -1
  356. package/components/navbar/themes/navbar.base.css.js +1 -3
  357. package/components/navbar/themes/navbar.base.css.js.map +1 -1
  358. package/components/progress/themes/circular/circular.progress.base.css.js +1 -3
  359. package/components/progress/themes/circular/circular.progress.base.css.js.map +1 -1
  360. package/components/progress/themes/circular/circular.progress.bootstrap.css.js +1 -2
  361. package/components/progress/themes/circular/circular.progress.bootstrap.css.js.map +1 -1
  362. package/components/progress/themes/circular/circular.progress.fluent.css.js +1 -2
  363. package/components/progress/themes/circular/circular.progress.fluent.css.js.map +1 -1
  364. package/components/progress/themes/linear/linear.progress.base.css.js +43 -66
  365. package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
  366. package/components/progress/themes/linear/linear.progress.bootstrap.css.js +11 -65
  367. package/components/progress/themes/linear/linear.progress.bootstrap.css.js.map +1 -1
  368. package/components/progress/themes/linear/linear.progress.fluent.css.js +11 -7
  369. package/components/progress/themes/linear/linear.progress.fluent.css.js.map +1 -1
  370. package/components/progress/themes/linear/linear.progress.indigo.css.js +16 -4
  371. package/components/progress/themes/linear/linear.progress.indigo.css.js.map +1 -1
  372. package/components/radio/themes/dark/radio.bootstrap.css.js +1 -13
  373. package/components/radio/themes/dark/radio.bootstrap.css.js.map +1 -1
  374. package/components/radio/themes/dark/radio.fluent.css.js +1 -13
  375. package/components/radio/themes/dark/radio.fluent.css.js.map +1 -1
  376. package/components/radio/themes/dark/radio.indigo.css.js +1 -13
  377. package/components/radio/themes/dark/radio.indigo.css.js.map +1 -1
  378. package/components/radio/themes/dark/radio.material.css.js +1 -13
  379. package/components/radio/themes/dark/radio.material.css.js.map +1 -1
  380. package/components/radio/themes/light/radio.base.css.js +1 -17
  381. package/components/radio/themes/light/radio.base.css.js.map +1 -1
  382. package/components/radio/themes/light/radio.bootstrap.css.js +3 -19
  383. package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
  384. package/components/radio/themes/light/radio.fluent.css.js +3 -19
  385. package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
  386. package/components/radio/themes/light/radio.indigo.css.js +3 -17
  387. package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
  388. package/components/radio/themes/light/radio.material.css.js +4 -17
  389. package/components/radio/themes/light/radio.material.css.js.map +1 -1
  390. package/components/radio-group/radio-group.base.css.js +1 -2
  391. package/components/radio-group/radio-group.base.css.js.map +1 -1
  392. package/components/radio-group/radio-group.fluent.css.js +1 -2
  393. package/components/radio-group/radio-group.fluent.css.js.map +1 -1
  394. package/components/radio-group/radio-group.material.css.js +1 -2
  395. package/components/radio-group/radio-group.material.css.js.map +1 -1
  396. package/components/rating/rating-symbol.base.css.js +1 -2
  397. package/components/rating/rating-symbol.base.css.js.map +1 -1
  398. package/components/rating/rating.base.css.js +1 -2
  399. package/components/rating/rating.base.css.js.map +1 -1
  400. package/components/rating/rating.bootstrap.css.js +1 -2
  401. package/components/rating/rating.bootstrap.css.js.map +1 -1
  402. package/components/rating/rating.fluent.css.js +1 -2
  403. package/components/rating/rating.fluent.css.js.map +1 -1
  404. package/components/rating/rating.indigo.css.js +1 -2
  405. package/components/rating/rating.indigo.css.js.map +1 -1
  406. package/components/ripple/ripple.material.css.js +1 -0
  407. package/components/ripple/ripple.material.css.js.map +1 -1
  408. package/components/select/select.d.ts +2 -6
  409. package/components/select/select.js +14 -12
  410. package/components/select/select.js.map +1 -1
  411. package/components/select/themes/dark/select.fluent.css.js +1 -1
  412. package/components/select/themes/dark/select.fluent.css.js.map +1 -1
  413. package/components/select/themes/dark/select.indigo.css.js +1 -1
  414. package/components/select/themes/dark/select.indigo.css.js.map +1 -1
  415. package/components/select/themes/dark/select.material.css.js +1 -1
  416. package/components/select/themes/dark/select.material.css.js.map +1 -1
  417. package/components/select/themes/light/select.base.css.js +1 -11
  418. package/components/select/themes/light/select.base.css.js.map +1 -1
  419. package/components/select/themes/light/select.bootstrap.css.js +153 -42
  420. package/components/select/themes/light/select.bootstrap.css.js.map +1 -1
  421. package/components/select/themes/light/select.fluent.css.js +148 -9
  422. package/components/select/themes/light/select.fluent.css.js.map +1 -1
  423. package/components/select/themes/light/select.indigo.css.js +169 -16
  424. package/components/select/themes/light/select.indigo.css.js.map +1 -1
  425. package/components/select/themes/light/select.material.css.js +187 -20
  426. package/components/select/themes/light/select.material.css.js.map +1 -1
  427. package/components/slider/themes/dark/slider.bootstrap.css.js +1 -1
  428. package/components/slider/themes/dark/slider.bootstrap.css.js.map +1 -1
  429. package/components/slider/themes/dark/slider.fluent.css.js +1 -1
  430. package/components/slider/themes/dark/slider.fluent.css.js.map +1 -1
  431. package/components/slider/themes/dark/slider.indigo.css.js +1 -1
  432. package/components/slider/themes/dark/slider.indigo.css.js.map +1 -1
  433. package/components/slider/themes/light/slider.base.css.js +4 -10
  434. package/components/slider/themes/light/slider.base.css.js.map +1 -1
  435. package/components/slider/themes/light/slider.bootstrap.css.js +1 -2
  436. package/components/slider/themes/light/slider.bootstrap.css.js.map +1 -1
  437. package/components/slider/themes/light/slider.fluent.css.js +1 -2
  438. package/components/slider/themes/light/slider.fluent.css.js.map +1 -1
  439. package/components/slider/themes/light/slider.indigo.css.js +1 -2
  440. package/components/slider/themes/light/slider.indigo.css.js.map +1 -1
  441. package/components/slider/themes/light/slider.material.css.js +2 -4
  442. package/components/slider/themes/light/slider.material.css.js.map +1 -1
  443. package/components/snackbar/themes/dark/snackbar.indigo.css.js +1 -1
  444. package/components/snackbar/themes/dark/snackbar.indigo.css.js.map +1 -1
  445. package/components/snackbar/themes/light/snackbar.base.css.js +7 -3
  446. package/components/snackbar/themes/light/snackbar.base.css.js.map +1 -1
  447. package/components/snackbar/themes/light/snackbar.bootstrap.css.js +9 -1
  448. package/components/snackbar/themes/light/snackbar.bootstrap.css.js.map +1 -1
  449. package/components/snackbar/themes/light/snackbar.fluent.css.js +9 -2
  450. package/components/snackbar/themes/light/snackbar.fluent.css.js.map +1 -1
  451. package/components/snackbar/themes/light/snackbar.indigo.css.js +9 -2
  452. package/components/snackbar/themes/light/snackbar.indigo.css.js.map +1 -1
  453. package/components/stepper/themes/step/dark/step.bootstrap.css.js +1 -1
  454. package/components/stepper/themes/step/dark/step.bootstrap.css.js.map +1 -1
  455. package/components/stepper/themes/step/dark/step.fluent.css.js +1 -1
  456. package/components/stepper/themes/step/dark/step.fluent.css.js.map +1 -1
  457. package/components/stepper/themes/step/dark/step.indigo.css.js +1 -1
  458. package/components/stepper/themes/step/dark/step.indigo.css.js.map +1 -1
  459. package/components/stepper/themes/step/dark/step.material.css.js +1 -1
  460. package/components/stepper/themes/step/dark/step.material.css.js.map +1 -1
  461. package/components/stepper/themes/step/light/step.base.css.js +2 -9
  462. package/components/stepper/themes/step/light/step.base.css.js.map +1 -1
  463. package/components/stepper/themes/step/light/step.bootstrap.css.js +68 -2
  464. package/components/stepper/themes/step/light/step.bootstrap.css.js.map +1 -1
  465. package/components/stepper/themes/step/light/step.fluent.css.js +68 -2
  466. package/components/stepper/themes/step/light/step.fluent.css.js.map +1 -1
  467. package/components/stepper/themes/step/light/step.indigo.css.js +68 -2
  468. package/components/stepper/themes/step/light/step.indigo.css.js.map +1 -1
  469. package/components/stepper/themes/step/light/step.material.css.js +68 -2
  470. package/components/stepper/themes/step/light/step.material.css.js.map +1 -1
  471. package/components/stepper/themes/stepper/stepper.base.css.js +1 -8
  472. package/components/stepper/themes/stepper/stepper.base.css.js.map +1 -1
  473. package/components/stepper/themes/stepper/stepper.bootstrap.css.js +1 -2
  474. package/components/stepper/themes/stepper/stepper.bootstrap.css.js.map +1 -1
  475. package/components/stepper/themes/stepper/stepper.fluent.css.js +1 -2
  476. package/components/stepper/themes/stepper/stepper.fluent.css.js.map +1 -1
  477. package/components/stepper/themes/stepper/stepper.indigo.css.js +1 -2
  478. package/components/stepper/themes/stepper/stepper.indigo.css.js.map +1 -1
  479. package/components/tabs/themes/dark/tab.dark.base.css.js +1 -1
  480. package/components/tabs/themes/dark/tab.dark.base.css.js.map +1 -1
  481. package/components/tabs/themes/dark/tab.dark.bootstrap.css.js +1 -1
  482. package/components/tabs/themes/dark/tab.dark.bootstrap.css.js.map +1 -1
  483. package/components/tabs/themes/light/tab-panel.base.css.js +1 -2
  484. package/components/tabs/themes/light/tab-panel.base.css.js.map +1 -1
  485. package/components/tabs/themes/light/tab.base.css.js +24 -3
  486. package/components/tabs/themes/light/tab.base.css.js.map +1 -1
  487. package/components/tabs/themes/light/tab.bootstrap.css.js +27 -6
  488. package/components/tabs/themes/light/tab.bootstrap.css.js.map +1 -1
  489. package/components/tabs/themes/light/tab.fluent.css.js +24 -2
  490. package/components/tabs/themes/light/tab.fluent.css.js.map +1 -1
  491. package/components/tabs/themes/light/tab.indigo.css.js +24 -2
  492. package/components/tabs/themes/light/tab.indigo.css.js.map +1 -1
  493. package/components/tabs/themes/light/tabs.base.css.js +1 -3
  494. package/components/tabs/themes/light/tabs.base.css.js.map +1 -1
  495. package/components/tabs/themes/light/tabs.bootstrap.css.js +1 -2
  496. package/components/tabs/themes/light/tabs.bootstrap.css.js.map +1 -1
  497. package/components/tabs/themes/light/tabs.fluent.css.js +1 -2
  498. package/components/tabs/themes/light/tabs.fluent.css.js.map +1 -1
  499. package/components/tabs/themes/light/tabs.indigo.css.js +1 -2
  500. package/components/tabs/themes/light/tabs.indigo.css.js.map +1 -1
  501. package/components/toast/themes/toast.base.css.js +37 -2
  502. package/components/toast/themes/toast.base.css.js.map +1 -1
  503. package/components/toast/themes/toast.bootstrap.css.js +6 -3
  504. package/components/toast/themes/toast.bootstrap.css.js.map +1 -1
  505. package/components/toast/themes/toast.fluent.css.js +6 -3
  506. package/components/toast/themes/toast.fluent.css.js.map +1 -1
  507. package/components/toast/themes/toast.indigo.css.js +6 -3
  508. package/components/toast/themes/toast.indigo.css.js.map +1 -1
  509. package/components/tree/themes/dark/tree-item.bootstrap.css.js +1 -1
  510. package/components/tree/themes/dark/tree-item.bootstrap.css.js.map +1 -1
  511. package/components/tree/themes/dark/tree-item.fluent.css.js +1 -1
  512. package/components/tree/themes/dark/tree-item.fluent.css.js.map +1 -1
  513. package/components/tree/themes/dark/tree-item.indigo.css.js +1 -1
  514. package/components/tree/themes/dark/tree-item.indigo.css.js.map +1 -1
  515. package/components/tree/themes/light/tree-item.base.css.js +20 -6
  516. package/components/tree/themes/light/tree-item.base.css.js.map +1 -1
  517. package/components/tree/themes/light/tree-item.bootstrap.css.js +1 -2
  518. package/components/tree/themes/light/tree-item.bootstrap.css.js.map +1 -1
  519. package/components/tree/themes/light/tree-item.fluent.css.js +1 -2
  520. package/components/tree/themes/light/tree-item.fluent.css.js.map +1 -1
  521. package/components/tree/themes/light/tree-item.indigo.css.js +1 -2
  522. package/components/tree/themes/light/tree-item.indigo.css.js.map +1 -1
  523. package/components/tree/themes/light/tree.base.css.js +1 -2
  524. package/components/tree/themes/light/tree.base.css.js.map +1 -1
  525. package/components/tree/tree-item.d.ts +7 -2
  526. package/components/tree/tree-item.js +30 -11
  527. package/components/tree/tree-item.js.map +1 -1
  528. package/package.json +4 -4
  529. package/themes/dark/bootstrap.css +275 -99
  530. package/themes/dark/fluent.css +298 -123
  531. package/themes/dark/indigo.css +232 -95
  532. package/themes/dark/material.css +253 -92
  533. package/themes/light/bootstrap.css +0 -47
  534. package/themes/light/fluent.css +0 -47
  535. package/themes/light/indigo.css +0 -47
  536. package/themes/light/material.css +0 -47
  537. package/theming/theming-controller.d.ts +3 -2
  538. package/theming/theming-controller.js +38 -19
  539. package/theming/theming-controller.js.map +1 -1
  540. package/theming/theming-decorator.d.ts +4 -3
  541. package/theming/theming-decorator.js +3 -5
  542. package/theming/theming-decorator.js.map +1 -1
  543. package/theming/types.d.ts +1 -9
  544. package/theming/types.js.map +1 -1
  545. package/vscode-html-custom-data.json +8 -8
  546. package/components/dropdown/themes/light/dropdown-group.base.css.js.map +0 -1
  547. package/components/dropdown/themes/light/dropdown-group.fluent.css.js +0 -6
  548. package/components/dropdown/themes/light/dropdown-group.fluent.css.js.map +0 -1
  549. package/components/dropdown/themes/light/dropdown-header.base.css.js +0 -61
  550. package/components/dropdown/themes/light/dropdown-header.base.css.js.map +0 -1
  551. package/components/dropdown/themes/light/dropdown-header.bootstrap.css.js +0 -6
  552. package/components/dropdown/themes/light/dropdown-header.bootstrap.css.js.map +0 -1
  553. package/components/dropdown/themes/light/dropdown-header.fluent.css.js +0 -6
  554. package/components/dropdown/themes/light/dropdown-header.fluent.css.js.map +0 -1
  555. package/components/dropdown/themes/light/dropdown-item.base.css.js +0 -124
  556. package/components/dropdown/themes/light/dropdown-item.base.css.js.map +0 -1
  557. package/components/dropdown/themes/light/dropdown-item.bootstrap.css.js +0 -27
  558. package/components/dropdown/themes/light/dropdown-item.bootstrap.css.js.map +0 -1
  559. package/components/dropdown/themes/light/dropdown-item.fluent.css.js +0 -27
  560. package/components/dropdown/themes/light/dropdown-item.fluent.css.js.map +0 -1
  561. package/components/dropdown/themes/light/dropdown-item.indigo.css.js +0 -27
  562. package/components/dropdown/themes/light/dropdown-item.indigo.css.js.map +0 -1
  563. /package/components/{dropdown/themes/light/dropdown-group.base.css.d.ts → calendar/themes/indigo/calendar.indigo.css.d.ts} +0 -0
  564. /package/components/{dropdown/themes/light/dropdown-group.fluent.css.d.ts → card/themes/light/card.indigo.css.d.ts} +0 -0
  565. /package/components/dropdown/themes/{light/dropdown-header.base.css.d.ts → dark/dropdown.material.css.d.ts} +0 -0
  566. /package/components/dropdown/themes/light/{dropdown-header.bootstrap.css.d.ts → dropdown.material.css.d.ts} +0 -0
  567. /package/components/dropdown/themes/light/{dropdown-header.fluent.css.d.ts → group/dropdown-group.base.css.d.ts} +0 -0
  568. /package/components/dropdown/themes/light/{dropdown-item.base.css.d.ts → group/dropdown-group.bootstrap.css.d.ts} +0 -0
  569. /package/components/dropdown/themes/light/{dropdown-item.bootstrap.css.d.ts → group/dropdown-group.fluent.css.d.ts} +0 -0
  570. /package/components/dropdown/themes/light/{dropdown-item.fluent.css.d.ts → group/dropdown-group.indigo.css.d.ts} +0 -0
  571. /package/components/dropdown/themes/light/{dropdown-item.indigo.css.d.ts → group/dropdown-group.material.css.d.ts} +0 -0
package/components/button/themes/button/light/button.bootstrap.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2QvB,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, hsla(var(--ig-primary-200), 0.5));\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, transparent);\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-primary-200), var(--ig-primary-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-primary-500), var(--ig-primary-a)));\n --hover-background: var(--ig-button-hover-background, transparent);\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --focus-background: var(--ig-button-focus-background, transparent);\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-primary-600), var(--ig-primary-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-primary-600), var(--ig-primary-a)));\n --active-background: var(--ig-button-active-background, transparent);\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --border-radius: var(--ig-button-border-radius, 0.25rem);\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=contained]),\n:host([variant=contained]) [igxButton=raised], :host([variant=contained]) .igx-button--raised {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-primary-200), var(--ig-primary-a)));\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, transparent);\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, hsla(var(--ig-primary-50), var(--ig-primary-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-primary-200), var(--ig-primary-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-600-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-600-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-600-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-600-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-700-contrast));\n --border-radius: var(--ig-button-border-radius, 0.25rem);\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=outlined]),\n:host([variant=outlined]) [igxButton=outlined], :host([variant=outlined]) .igx-button--outlined {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-primary-200), 0.5));\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-500), var(--ig-primary-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --disabled-border-color: var(--ig-button-disabled-border-color, hsla(var(--ig-primary-50), var(--ig-primary-a)));\n --disabled-background: var(--ig-button-disabled-background, transparent);\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-primary-200), var(--ig-primary-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-primary-500), var(--ig-primary-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, var(--ig-primary-600-contrast));\n --focus-background: var(--ig-button-focus-background, transparent);\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-primary-500), var(--ig-primary-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-primary-500), var(--ig-primary-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-700-contrast));\n --border-radius: var(--ig-button-border-radius, 0.25rem);\n}\n:host([variant=outlined]) [part=base] {\n border: 0.0625rem solid var(--border-color);\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\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, hsla(var(--ig-primary-200), var(--ig-primary-a)));\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, transparent);\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, hsla(var(--ig-primary-50), var(--ig-primary-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-primary-200), var(--ig-primary-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-600-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-600-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-600-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-600-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-700-contrast));\n --border-radius: var(--ig-button-border-radius, 0.9375rem);\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\n:host {\n --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(1.9375rem, -1 * 1.9375rem));\n}\n\n:host [part=base] {\n -webkit-transition: all 0.15s ease-in-out;\n -o-transition: all 0.15s ease-in-out;\n transition: all 0.15s ease-in-out;\n}\n\n:host(:not([disabled])[variant=flat]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus, :host(:not([disabled])[variant=flat]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=contained]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus, :host(:not([disabled])[variant=contained]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus, :host(:not([disabled])[variant=outlined]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=fab]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus, :host(:not([disabled])[variant=fab]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-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=contained]) [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=fab]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}`;\n"]}
1
+ {"version":3,"file":"button.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6PvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host([variant=flat]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-primary-200), 0.5));\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, transparent);\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-primary-200), var(--ig-primary-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(1.9375rem, -1 * 1.9375rem)));\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-primary-500), var(--ig-primary-a)));\n --hover-background: var(--ig-button-hover-background, transparent);\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-primary-800), var(--ig-primary-a)));\n --focus-background: var(--ig-button-focus-background, transparent);\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-primary-600), var(--ig-primary-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-primary-600), var(--ig-primary-a)));\n --active-background: var(--ig-button-active-background, transparent);\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-primary-600), var(--ig-primary-a)));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n}\n:host([variant=flat]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host([variant=contained]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-primary-200), var(--ig-primary-a)));\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, transparent);\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, hsla(var(--ig-primary-50), var(--ig-primary-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-primary-200), var(--ig-primary-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(1.9375rem, -1 * 1.9375rem)));\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-600-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-600-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-600-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-600-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-700-contrast));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n}\n:host([variant=contained]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host([variant=outlined]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-primary-200), 0.5));\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-500), var(--ig-primary-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --disabled-border-color: var(--ig-button-disabled-border-color, hsla(var(--ig-primary-50), var(--ig-primary-a)));\n --disabled-background: var(--ig-button-disabled-background, transparent);\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-primary-200), var(--ig-primary-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(1.9375rem, -1 * 1.9375rem)));\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-primary-500), var(--ig-primary-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, var(--ig-primary-600-contrast));\n --focus-background: var(--ig-button-focus-background, transparent);\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-primary-500), var(--ig-primary-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-primary-500), var(--ig-primary-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-700-contrast));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n}\n:host([variant=outlined]) [part=base] {\n border: 0.0625rem solid var(--border-color);\n border-radius: var(--border-radius);\n}\n\n:host([variant=fab]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-primary-200), var(--ig-primary-a)));\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, transparent);\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, hsla(var(--ig-primary-50), var(--ig-primary-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-primary-200), var(--ig-primary-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(1.9375rem, -1 * 1.9375rem)));\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-600-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-600-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-600-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-600-contrast));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-700-contrast));\n --border-radius: var(--ig-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 0.5357142857) * 1.75rem), 1.75rem));\n}\n:host([variant=fab]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host {\n --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(1.9375rem, -1 * 1.9375rem));\n}\n\n:host [part=base] {\n -webkit-transition: all 0.15s ease-in-out;\n transition: all 0.15s ease-in-out;\n}\n\n:host(:not([disabled])[variant=flat]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus, :host(:not([disabled])[variant=flat]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=contained]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus, :host(:not([disabled])[variant=contained]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus, :host(:not([disabled])[variant=outlined]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=fab]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus, :host(:not([disabled])[variant=fab]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.25rem var(--shadow-color);\n box-shadow: 0 0 0 0.25rem var(--shadow-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=contained]) [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=fab]) [part=base] {\n color: var(--disabled-foreground);\n background: var(--disabled-background);\n}`;\n"]}
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,13 @@ 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
+ border-radius: var(--border-radius);
44
31
  }
45
32
 
46
- :host([variant=outlined]),
47
- :host([variant=outlined]) [igxButton=outlined], :host([variant=outlined]) .igx-button--outlined {
33
+ :host([variant=outlined]) {
48
34
  --shadow-color: var(--ig-button-shadow-color, transparent);
49
35
  --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));
50
36
  --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));
@@ -54,6 +40,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
54
40
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
55
41
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
56
42
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), 0.5));
43
+ --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
44
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
58
45
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
59
46
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -68,14 +55,16 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
68
55
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));
69
56
  --active-background: var(--ig-button-active-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));
70
57
  --active-foreground: var(--ig-button-active-foreground, var(--ig-gray-300-contrast));
71
- --border-radius: var(--ig-button-border-radius, 0.125rem);
58
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));
72
59
  }
73
60
  :host([variant=outlined]) [part=base] {
74
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
61
+ border-radius: var(--border-radius);
62
+ }
63
+ :host([variant=outlined]) [part=base]::after {
64
+ border-radius: calc(var(--border-radius) - 0.25rem);
75
65
  }
76
66
 
77
- :host([variant=contained]),
78
- :host([variant=contained]) [igxButton=raised], :host([variant=contained]) .igx-button--raised {
67
+ :host([variant=contained]) {
79
68
  --shadow-color: var(--ig-button-shadow-color, transparent);
80
69
  --border-color: var(--ig-button-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
81
70
  --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-primary-600), var(--ig-primary-a)));
@@ -85,6 +74,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
85
74
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
86
75
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
87
76
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));
77
+ --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
78
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
89
79
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
90
80
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -99,17 +89,17 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
99
89
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));
100
90
  --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));
101
91
  --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));
102
- --border-radius: var(--ig-button-border-radius, 0.125rem);
92
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));
103
93
  }
104
94
  :host([variant=contained]) [part=base] {
105
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
95
+ border-radius: var(--border-radius);
96
+ }
97
+ :host([variant=contained]) [part=base]::after {
98
+ border-radius: calc(var(--border-radius) - 0.25rem);
106
99
  }
107
100
 
108
101
  :host([variant=fab]) {
109
102
  --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
103
  --shadow-color: var(--ig-button-shadow-color, transparent);
114
104
  --border-color: var(--ig-button-border-color, var(--ig-gray-900-contrast));
115
105
  --hover-border-color: var(--ig-button-hover-border-color, var(--ig-gray-900-contrast));
@@ -119,6 +109,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
119
109
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
120
110
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
121
111
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-400), var(--ig-gray-a)));
112
+ --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
113
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
123
114
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
124
115
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -133,13 +124,13 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
133
124
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, var(--ig-primary-900-contrast));
134
125
  --active-background: var(--ig-button-active-background, hsla(var(--ig-primary-800), var(--ig-primary-a)));
135
126
  --active-foreground: var(--ig-button-active-foreground, var(--ig-primary-900-contrast));
136
- --border-radius: var(--ig-button-border-radius, 0.875rem);
127
+ --border-radius: var(--ig-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 0.5) * 1.75rem), 1.75rem));
137
128
  }
138
129
  :host([variant=fab]) [part=base] {
139
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
130
+ border-radius: var(--border-radius);
140
131
  }
141
132
  :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));
133
+ border-radius: calc(var(--border-radius) - 0.25rem);
143
134
  }
144
135
 
145
136
  :host {
@@ -149,7 +140,6 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
149
140
  [part=base] {
150
141
  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
142
  -webkit-transition: all 0.1s ease-in-out;
152
- -o-transition: all 0.1s ease-in-out;
153
143
  transition: all 0.1s ease-in-out;
154
144
  }
155
145
 
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoVvB,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 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 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 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 --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 --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 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: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 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"]}
package/components/button/themes/button/light/button.indigo.css.js CHANGED
@@ -1,23 +1,9 @@
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 {
2
+ export const styles = css `:host {
16
3
  --size: max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem));
17
4
  }
18
5
 
19
- :host([variant=flat]),
20
- :host([variant=flat]) [igxButton=flat], :host([variant=flat]) .igx-button--flat {
6
+ :host([variant=flat]) {
21
7
  --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));
22
8
  --border-color: var(--ig-button-border-color, transparent);
23
9
  --hover-border-color: var(--ig-button-hover-border-color, transparent);
@@ -27,6 +13,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
27
13
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
28
14
  --disabled-background: var(--ig-button-disabled-background, transparent);
29
15
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), var(--ig-gray-a)));
16
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem)));
30
17
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
31
18
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
32
19
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -41,11 +28,10 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
41
28
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));
42
29
  --active-background: var(--ig-button-active-background, transparent);
43
30
  --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-700), var(--ig-gray-a)));
44
- --border-radius: var(--ig-button-border-radius, 1.25rem);
31
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));
45
32
  }
46
33
 
47
- :host([variant=outlined]),
48
- :host([variant=outlined]) [igxButton=outlined], :host([variant=outlined]) .igx-button--outlined {
34
+ :host([variant=outlined]) {
49
35
  --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));
50
36
  --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
51
37
  --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
@@ -55,6 +41,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
55
41
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
56
42
  --disabled-background: var(--ig-button-disabled-background, transparent);
57
43
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), var(--ig-gray-a)));
44
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));
58
45
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
59
46
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
60
47
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -69,11 +56,10 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
69
56
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));
70
57
  --active-background: var(--ig-button-active-background, transparent);
71
58
  --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-900), var(--ig-gray-a)));
72
- --border-radius: var(--ig-button-border-radius, 1.25rem);
59
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));
73
60
  }
74
61
 
75
- :host([variant=contained]),
76
- :host([variant=contained]) [igxButton=raised], :host([variant=contained]) .igx-button--raised {
62
+ :host([variant=contained]) {
77
63
  --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));
78
64
  --border-color: var(--ig-button-border-color, transparent);
79
65
  --hover-border-color: var(--ig-button-hover-border-color, transparent);
@@ -83,6 +69,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
83
69
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
84
70
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));
85
71
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), var(--ig-gray-a)));
72
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));
86
73
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
87
74
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
88
75
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -97,14 +84,11 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
97
84
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));
98
85
  --active-background: var(--ig-button-active-background, hsla(var(--ig-secondary-300), var(--ig-secondary-a)));
99
86
  --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));
100
- --border-radius: var(--ig-button-border-radius, 1.25rem);
87
+ --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));
101
88
  }
102
89
 
103
90
  :host([variant=fab]) {
104
91
  --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.625rem, -1 * 2.625rem), var(--is-small, 1) * max(2.25rem, -1 * 2.25rem));
105
- }
106
- :host([variant=fab]),
107
- :host([variant=fab]) [igxButton=fab], :host([variant=fab]) .igx-button--fab {
108
92
  --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));
109
93
  --border-color: var(--ig-button-border-color, transparent);
110
94
  --hover-border-color: var(--ig-button-hover-border-color, transparent);
@@ -114,6 +98,7 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
114
98
  --disabled-border-color: var(--ig-button-disabled-border-color, transparent);
115
99
  --disabled-background: var(--ig-button-disabled-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));
116
100
  --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), var(--ig-gray-a)));
101
+ --size: var(--ig-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.625rem, -1 * 2.625rem), var(--is-small, 1) * max(2.25rem, -1 * 2.25rem)));
117
102
  --resting-elevation: var(--ig-button-resting-elevation, var(--ig-elevation-0));
118
103
  --hover-elevation: var(--ig-button-hover-elevation, var(--ig-elevation-0));
119
104
  --focus-elevation: var(--ig-button-focus-elevation, var(--ig-elevation-0));
@@ -128,29 +113,28 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
128
113
  --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));
129
114
  --active-background: var(--ig-button-active-background, hsla(var(--ig-secondary-300), var(--ig-secondary-a)));
130
115
  --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));
131
- --border-radius: var(--ig-button-border-radius, 1.75rem);
116
+ --border-radius: var(--ig-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 1) * 1.75rem), 1.75rem));
132
117
  }
133
118
 
134
119
  [part=base] {
135
120
  -webkit-transition: all 0.15s ease-in-out;
136
- -o-transition: all 0.15s ease-in-out;
137
121
  transition: all 0.15s ease-in-out;
138
122
  }
139
123
 
140
124
  :host([variant=flat]) [part=base] {
141
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
125
+ border-radius: var(--border-radius);
142
126
  }
143
127
 
144
128
  :host([variant=outlined]) [part=base] {
145
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
129
+ border-radius: var(--border-radius);
146
130
  }
147
131
 
148
132
  :host([variant=contained]) [part=base] {
149
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
133
+ border-radius: var(--border-radius);
150
134
  }
151
135
 
152
136
  :host([variant=fab]) [part=base] {
153
- border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));
137
+ border-radius: var(--border-radius);
154
138
  }
155
139
 
156
140
  :host(:not([disabled])[variant=flat]) [part=base] {
@@ -223,7 +207,6 @@ export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-
223
207
  :host(:not([disabled])[variant=contained]) [part=base] {
224
208
  color: var(--foreground);
225
209
  background: var(--background);
226
- border-radius: var(--border-radius);
227
210
  }
228
211
  :host(:not([disabled])[variant=contained]) [part=base]:hover {
229
212
  color: var(--hover-foreground);
package/components/button/themes/button/light/button.indigo.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiUvB,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 {\n --size: max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem));\n}\n\n:host([variant=flat]),\n:host([variant=flat]) [igxButton=flat], :host([variant=flat]) .igx-button--flat {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));\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, transparent);\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-500), 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-700), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, transparent);\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, transparent);\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, transparent);\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, 1.25rem);\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, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\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-500), 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-700), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-gray-100), 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, transparent);\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, 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, 1.25rem);\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, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));\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, transparent);\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, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), 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-secondary-500), var(--ig-secondary-a)));\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-secondary-300), var(--ig-secondary-a)));\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, 1.25rem);\n}\n\n:host([variant=fab]) {\n --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.625rem, -1 * 2.625rem), var(--is-small, 1) * max(2.25rem, -1 * 2.25rem));\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, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));\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, transparent);\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, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), 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-secondary-500), var(--ig-secondary-a)));\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-secondary-300), var(--ig-secondary-a)));\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, 1.75rem);\n}\n\n[part=base] {\n -webkit-transition: all 0.15s ease-in-out;\n -o-transition: all 0.15s ease-in-out;\n transition: all 0.15s ease-in-out;\n}\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]) [part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\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]) [part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * var(--border-radius)), var(--border-radius));\n}\n\n:host(:not([disabled])[variant=flat]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus, :host(:not([disabled])[variant=flat]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border-style: solid;\n border-color: var(--border-color);\n border-width: 0.125rem;\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover {\n background: var(--hover-background);\n color: var(--hover-foreground);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus {\n background: var(--focus-background);\n color: var(--focus-foreground);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:active {\n background: var(--active-background);\n color: var(--active-foreground);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus, :host(:not([disabled])[variant=outlined]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible {\n background: var(--focus-visible-background);\n color: var(--focus-visible-foreground);\n border-color: var(--focus-visible-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover {\n background: var(--hover-background);\n color: var(--hover-foreground);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active {\n background: var(--active-background);\n color: var(--active-foreground);\n border-color: var(--active-border-color);\n}\n\n:host(:not([disabled])[variant=contained]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border-radius: var(--border-radius);\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, :host(:not([disabled])[variant=contained]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible {\n background: var(--focus-visible-background);\n color: var(--focus-visible-foreground);\n border-color: var(--focus-visible-border-color);\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-color: var(--border-color);\n min-width: var(--size);\n min-height: var(--size);\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, :host(:not([disabled])[variant=fab]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible {\n background: var(--focus-visible-background);\n color: var(--focus-visible-foreground);\n border-color: var(--focus-visible-border-color);\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}\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.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgTvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --size: max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem));\n}\n\n:host([variant=flat]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));\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, transparent);\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-500), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem)));\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-700), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, transparent);\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, transparent);\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, transparent);\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));\n}\n\n:host([variant=outlined]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --border-color: var(--ig-button-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --hover-border-color: var(--ig-button-hover-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --focus-border-color: var(--ig-button-focus-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --focus-visible-border-color: var(--ig-button-focus-visible-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --active-border-color: var(--ig-button-active-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\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-500), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), 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-700), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-gray-100), 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, transparent);\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, 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, 1) * 1.25rem), 1.25rem));\n}\n\n:host([variant=contained]) {\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));\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, transparent);\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, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), 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-secondary-500), var(--ig-secondary-a)));\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-secondary-300), var(--ig-secondary-a)));\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));\n}\n\n:host([variant=fab]) {\n --size: max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.625rem, -1 * 2.625rem), var(--is-small, 1) * max(2.25rem, -1 * 2.25rem));\n --shadow-color: var(--ig-button-shadow-color, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));\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, transparent);\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, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --disabled-foreground: var(--ig-button-disabled-foreground, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --size: var(--ig-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.625rem, -1 * 2.625rem), var(--is-small, 1) * max(2.25rem, -1 * 2.25rem)));\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-secondary-500), var(--ig-secondary-a)));\n --foreground: var(--ig-button-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --hover-background: var(--ig-button-hover-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --hover-foreground: var(--ig-button-hover-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-background: var(--ig-button-focus-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-foreground: var(--ig-button-focus-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --focus-visible-background: var(--ig-button-focus-visible-background, hsla(var(--ig-secondary-400), var(--ig-secondary-a)));\n --focus-visible-foreground: var(--ig-button-focus-visible-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --active-background: var(--ig-button-active-background, hsla(var(--ig-secondary-300), var(--ig-secondary-a)));\n --active-foreground: var(--ig-button-active-foreground, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --border-radius: var(--ig-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 1) * 1.75rem), 1.75rem));\n}\n\n[part=base] {\n -webkit-transition: all 0.15s ease-in-out;\n transition: all 0.15s ease-in-out;\n}\n\n:host([variant=flat]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host([variant=outlined]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host([variant=contained]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host([variant=fab]) [part=base] {\n border-radius: var(--border-radius);\n}\n\n:host(:not([disabled])[variant=flat]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:hover {\n color: var(--hover-foreground);\n background: var(--hover-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus {\n color: var(--focus-foreground);\n background: var(--focus-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:active {\n color: var(--active-foreground);\n background: var(--active-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus-visible {\n color: var(--focus-visible-foreground);\n background: var(--focus-visible-background);\n}\n:host(:not([disabled])[variant=flat]) [part=base]:focus, :host(:not([disabled])[variant=flat]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base] {\n color: var(--foreground);\n background: var(--background);\n border-style: solid;\n border-color: var(--border-color);\n border-width: 0.125rem;\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover {\n background: var(--hover-background);\n color: var(--hover-foreground);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus {\n background: var(--focus-background);\n color: var(--focus-foreground);\n border-color: var(--focus-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:active {\n background: var(--active-background);\n color: var(--active-foreground);\n border-color: var(--active-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus, :host(:not([disabled])[variant=outlined]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible {\n background: var(--focus-visible-background);\n color: var(--focus-visible-foreground);\n border-color: var(--focus-visible-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:hover {\n background: var(--hover-background);\n color: var(--hover-foreground);\n border-color: var(--hover-border-color);\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus-visible:active {\n background: var(--active-background);\n color: var(--active-foreground);\n border-color: var(--active-border-color);\n}\n\n:host(:not([disabled])[variant=contained]) [part=base] {\n color: var(--foreground);\n background: var(--background);\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, :host(:not([disabled])[variant=contained]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus-visible {\n background: var(--focus-visible-background);\n color: var(--focus-visible-foreground);\n border-color: var(--focus-visible-border-color);\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-color: var(--border-color);\n min-width: var(--size);\n min-height: var(--size);\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, :host(:not([disabled])[variant=fab]) [part=base]:active {\n -webkit-box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n box-shadow: 0 0 0 0.1875rem var(--shadow-color);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus-visible {\n background: var(--focus-visible-background);\n color: var(--focus-visible-foreground);\n border-color: var(--focus-visible-border-color);\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}\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"]}