igniteui-webcomponents 4.2.3 → 4.3.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (420) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/README.md +2 -6
  3. package/animations/player.js +10 -6
  4. package/animations/player.js.map +1 -1
  5. package/animations/presets/fade/index.d.ts +3 -0
  6. package/animations/presets/fade/index.js +12 -0
  7. package/animations/presets/fade/index.js.map +1 -0
  8. package/animations/presets/index.d.ts +1 -0
  9. package/animations/presets/index.js +1 -0
  10. package/animations/presets/index.js.map +1 -1
  11. package/components/accordion/accordion.js +2 -1
  12. package/components/accordion/accordion.js.map +1 -1
  13. package/components/avatar/avatar.js +2 -2
  14. package/components/avatar/avatar.js.map +1 -1
  15. package/components/avatar/themes/dark/avatar.base.bootstrap.css.js +15 -0
  16. package/components/avatar/themes/dark/avatar.base.bootstrap.css.js.map +1 -0
  17. package/components/avatar/themes/{avatar.base.css.js → light/avatar.base.css.js} +25 -8
  18. package/components/avatar/themes/light/avatar.base.css.js.map +1 -0
  19. package/components/avatar/themes/light/avatar.bootstrap.css.js +26 -0
  20. package/components/avatar/themes/light/avatar.bootstrap.css.js.map +1 -0
  21. package/components/badge/badge.js.map +1 -1
  22. package/components/badge/themes/light/badge.base.css.js +4 -5
  23. package/components/badge/themes/light/badge.base.css.js.map +1 -1
  24. package/components/button/button-base.js.map +1 -1
  25. package/components/button/button.js.map +1 -1
  26. package/components/button/icon-button.js.map +1 -1
  27. package/components/button/themes/button/dark/button.bootstrap.css.js +15 -0
  28. package/components/button/themes/button/dark/button.bootstrap.css.js.map +1 -0
  29. package/components/button/themes/button/dark/button.fluent.css.js +13 -1
  30. package/components/button/themes/button/dark/button.fluent.css.js.map +1 -1
  31. package/components/button/themes/button/dark/button.indigo.css.d.ts +1 -0
  32. package/components/button/themes/button/dark/button.indigo.css.js +15 -0
  33. package/components/button/themes/button/dark/button.indigo.css.js.map +1 -0
  34. package/components/button/themes/button/dark/button.material.css.d.ts +1 -0
  35. package/components/button/themes/button/dark/button.material.css.js +15 -0
  36. package/components/button/themes/button/dark/button.material.css.js.map +1 -0
  37. package/components/button/themes/button/light/button.base.css.js +6 -57
  38. package/components/button/themes/button/light/button.base.css.js.map +1 -1
  39. package/components/button/themes/button/light/button.bootstrap.css.js +229 -71
  40. package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
  41. package/components/button/themes/button/light/button.fluent.css.js +289 -70
  42. package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
  43. package/components/button/themes/button/light/button.indigo.css.js +282 -78
  44. package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
  45. package/components/button/themes/button/light/button.material.css.js +282 -170
  46. package/components/button/themes/button/light/button.material.css.js.map +1 -1
  47. package/components/button/themes/icon-button/light/icon-button.base.css.js +4 -6
  48. package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
  49. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +24 -0
  50. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
  51. package/components/button/themes/icon-button/light/icon-button.fluent.css.js +16 -0
  52. package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
  53. package/components/button/themes/icon-button/light/icon-button.indigo.css.js +9 -0
  54. package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
  55. package/components/button/themes/icon-button/light/icon-button.material.css.js +7 -0
  56. package/components/button/themes/icon-button/light/icon-button.material.css.js.map +1 -1
  57. package/components/calendar/calendar.js.map +1 -1
  58. package/components/calendar/common/calendar-base.d.ts +2 -2
  59. package/components/calendar/common/calendar-base.js.map +1 -1
  60. package/components/calendar/days-view/days-view.js.map +1 -1
  61. package/components/calendar/months-view/months-view.js.map +1 -1
  62. package/components/calendar/themes/calendar.base.css.js +4 -5
  63. package/components/calendar/themes/calendar.base.css.js.map +1 -1
  64. package/components/calendar/themes/fluent/calendar.fluent.css.js +4 -5
  65. package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
  66. package/components/calendar/years-view/years-view.js.map +1 -1
  67. package/components/card/card.actions.js.map +1 -1
  68. package/components/card/card.content.js.map +1 -1
  69. package/components/card/card.header.js.map +1 -1
  70. package/components/card/card.js.map +1 -1
  71. package/components/card/card.media.js +2 -1
  72. package/components/card/card.media.js.map +1 -1
  73. package/components/card/themes/light/card.actions.bootstrap.css.js +4 -5
  74. package/components/card/themes/light/card.actions.bootstrap.css.js.map +1 -1
  75. package/components/card/themes/light/card.actions.material.css.js +4 -5
  76. package/components/card/themes/light/card.actions.material.css.js.map +1 -1
  77. package/components/card/themes/light/card.content.bootstrap.css.js +5 -8
  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 +5 -8
  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 +5 -8
  82. package/components/card/themes/light/card.content.material.css.js.map +1 -1
  83. package/components/card/themes/light/card.header.bootstrap.css.js +4 -8
  84. package/components/card/themes/light/card.header.bootstrap.css.js.map +1 -1
  85. package/components/card/themes/light/card.header.fluent.css.js +4 -8
  86. package/components/card/themes/light/card.header.fluent.css.js.map +1 -1
  87. package/components/card/themes/light/card.header.indigo.css.js +4 -8
  88. package/components/card/themes/light/card.header.indigo.css.js.map +1 -1
  89. package/components/card/themes/light/card.header.material.css.js +4 -8
  90. package/components/card/themes/light/card.header.material.css.js.map +1 -1
  91. package/components/card/themes/light/card.material.css.js +15 -5
  92. package/components/card/themes/light/card.material.css.js.map +1 -1
  93. package/components/card/themes/light/card.media.material.css.js +4 -5
  94. package/components/card/themes/light/card.media.material.css.js.map +1 -1
  95. package/components/checkbox/checkbox-base.js.map +1 -1
  96. package/components/checkbox/checkbox.js.map +1 -1
  97. package/components/checkbox/switch.js.map +1 -1
  98. package/components/checkbox/themes/dark/checkbox.bootstrap.css.d.ts +1 -0
  99. package/components/checkbox/themes/dark/checkbox.bootstrap.css.js +15 -0
  100. package/components/checkbox/themes/dark/checkbox.bootstrap.css.js.map +1 -0
  101. package/components/checkbox/themes/dark/checkbox.fluent.css.js +13 -1
  102. package/components/checkbox/themes/dark/checkbox.fluent.css.js.map +1 -1
  103. package/components/checkbox/themes/dark/checkbox.indigo.css.js +13 -1
  104. package/components/checkbox/themes/dark/checkbox.indigo.css.js.map +1 -1
  105. package/components/checkbox/themes/dark/checkbox.material.css.d.ts +1 -0
  106. package/components/checkbox/themes/dark/checkbox.material.css.js +15 -0
  107. package/components/checkbox/themes/dark/checkbox.material.css.js.map +1 -0
  108. package/components/checkbox/themes/dark/switch.bootstrap.css.d.ts +1 -0
  109. package/components/checkbox/themes/dark/switch.bootstrap.css.js +15 -0
  110. package/components/checkbox/themes/dark/switch.bootstrap.css.js.map +1 -0
  111. package/components/checkbox/themes/dark/switch.fluent.css.js +13 -1
  112. package/components/checkbox/themes/dark/switch.fluent.css.js.map +1 -1
  113. package/components/checkbox/themes/dark/switch.indigo.css.js +13 -1
  114. package/components/checkbox/themes/dark/switch.indigo.css.js.map +1 -1
  115. package/components/checkbox/themes/dark/switch.material.css.d.ts +1 -0
  116. package/components/checkbox/themes/dark/switch.material.css.js +15 -0
  117. package/components/checkbox/themes/dark/switch.material.css.js.map +1 -0
  118. package/components/checkbox/themes/light/checkbox.base.css.js +17 -51
  119. package/components/checkbox/themes/light/checkbox.base.css.js.map +1 -1
  120. package/components/checkbox/themes/light/checkbox.bootstrap.css.js +124 -46
  121. package/components/checkbox/themes/light/checkbox.bootstrap.css.js.map +1 -1
  122. package/components/checkbox/themes/light/checkbox.fluent.css.js +172 -87
  123. package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
  124. package/components/checkbox/themes/light/checkbox.indigo.css.js +136 -49
  125. package/components/checkbox/themes/light/checkbox.indigo.css.js.map +1 -1
  126. package/components/checkbox/themes/light/checkbox.material.css.js +148 -18
  127. package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
  128. package/components/checkbox/themes/light/switch.base.css.js +31 -56
  129. package/components/checkbox/themes/light/switch.base.css.js.map +1 -1
  130. package/components/checkbox/themes/light/switch.bootstrap.css.js +148 -95
  131. package/components/checkbox/themes/light/switch.bootstrap.css.js.map +1 -1
  132. package/components/checkbox/themes/light/switch.fluent.css.js +144 -80
  133. package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
  134. package/components/checkbox/themes/light/switch.indigo.css.js +154 -97
  135. package/components/checkbox/themes/light/switch.indigo.css.js.map +1 -1
  136. package/components/checkbox/themes/light/switch.material.css.js +171 -37
  137. package/components/checkbox/themes/light/switch.material.css.js.map +1 -1
  138. package/components/chip/chip.js.map +1 -1
  139. package/components/chip/themes/chip.base.css.js +4 -5
  140. package/components/chip/themes/chip.base.css.js.map +1 -1
  141. package/components/chip/themes/chip.bootstrap.css.js +4 -5
  142. package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
  143. package/components/chip/themes/chip.fluent.css.js +4 -5
  144. package/components/chip/themes/chip.fluent.css.js.map +1 -1
  145. package/components/chip/themes/chip.indigo.css.js +4 -5
  146. package/components/chip/themes/chip.indigo.css.js.map +1 -1
  147. package/components/chip/themes/chip.material.css.js +4 -5
  148. package/components/chip/themes/chip.material.css.js.map +1 -1
  149. package/components/combo/combo-header.js.map +1 -1
  150. package/components/combo/combo-item.d.ts +5 -0
  151. package/components/combo/combo-item.js.map +1 -1
  152. package/components/combo/combo-list.js +2 -1
  153. package/components/combo/combo-list.js.map +1 -1
  154. package/components/combo/combo.d.ts +51 -5
  155. package/components/combo/combo.js +58 -26
  156. package/components/combo/combo.js.map +1 -1
  157. package/components/combo/controllers/data.js +9 -5
  158. package/components/combo/controllers/data.js.map +1 -1
  159. package/components/combo/controllers/selection.d.ts +2 -1
  160. package/components/combo/controllers/selection.js +14 -3
  161. package/components/combo/controllers/selection.js.map +1 -1
  162. package/components/combo/operations/filter.d.ts +3 -1
  163. package/components/combo/operations/filter.js +10 -7
  164. package/components/combo/operations/filter.js.map +1 -1
  165. package/components/combo/operations/group.d.ts +2 -2
  166. package/components/combo/operations/group.js +8 -5
  167. package/components/combo/operations/group.js.map +1 -1
  168. package/components/combo/themes/light/combo.base.css.js +4 -5
  169. package/components/combo/themes/light/combo.base.css.js.map +1 -1
  170. package/components/combo/themes/light/header/combo-header.base.css.js +4 -5
  171. package/components/combo/themes/light/header/combo-header.base.css.js.map +1 -1
  172. package/components/combo/themes/light/item/combo-item.base.css.js +4 -5
  173. package/components/combo/themes/light/item/combo-item.base.css.js.map +1 -1
  174. package/components/combo/types.d.ts +8 -5
  175. package/components/combo/types.js.map +1 -1
  176. package/components/common/mixins/sizable.js.map +1 -1
  177. package/components/date-time-input/date-time-input.js +2 -1
  178. package/components/date-time-input/date-time-input.js.map +1 -1
  179. package/components/date-time-input/date-util.js +2 -1
  180. package/components/date-time-input/date-util.js.map +1 -1
  181. package/components/dialog/dialog.d.ts +9 -2
  182. package/components/dialog/dialog.js +37 -10
  183. package/components/dialog/dialog.js.map +1 -1
  184. package/components/dialog/themes/light/dialog.base.css.js +17 -8
  185. package/components/dialog/themes/light/dialog.base.css.js.map +1 -1
  186. package/components/dropdown/dropdown-group.js.map +1 -1
  187. package/components/dropdown/dropdown-header.js.map +1 -1
  188. package/components/dropdown/dropdown-item.js.map +1 -1
  189. package/components/dropdown/dropdown.js +2 -0
  190. package/components/dropdown/dropdown.js.map +1 -1
  191. package/components/dropdown/themes/light/dropdown-group.base.css.js +4 -5
  192. package/components/dropdown/themes/light/dropdown-group.base.css.js.map +1 -1
  193. package/components/dropdown/themes/light/dropdown-header.base.css.js +4 -5
  194. package/components/dropdown/themes/light/dropdown-header.base.css.js.map +1 -1
  195. package/components/dropdown/themes/light/dropdown-item.base.css.js +4 -5
  196. package/components/dropdown/themes/light/dropdown-item.base.css.js.map +1 -1
  197. package/components/dropdown/themes/light/dropdown.base.css.js +4 -5
  198. package/components/dropdown/themes/light/dropdown.base.css.js.map +1 -1
  199. package/components/expansion-panel/expansion-panel.d.ts +1 -0
  200. package/components/expansion-panel/expansion-panel.js.map +1 -1
  201. package/components/expansion-panel/themes/light/expansion-panel.base.css.js +4 -5
  202. package/components/expansion-panel/themes/light/expansion-panel.base.css.js.map +1 -1
  203. package/components/form/form.js +2 -1
  204. package/components/form/form.js.map +1 -1
  205. package/components/icon/dark/icon.bootstrap.css.d.ts +1 -0
  206. package/components/icon/dark/icon.bootstrap.css.js +15 -0
  207. package/components/icon/dark/icon.bootstrap.css.js.map +1 -0
  208. package/components/icon/dark/icon.fluent.css.d.ts +1 -0
  209. package/components/{avatar/themes/avatar.bootstrap.css.js → icon/dark/icon.fluent.css.js} +13 -5
  210. package/components/icon/dark/icon.fluent.css.js.map +1 -0
  211. package/components/icon/dark/icon.indigo.css.d.ts +1 -0
  212. package/components/icon/dark/icon.indigo.css.js +15 -0
  213. package/components/icon/dark/icon.indigo.css.js.map +1 -0
  214. package/components/icon/dark/icon.material.css.d.ts +1 -0
  215. package/components/icon/dark/icon.material.css.js +15 -0
  216. package/components/icon/dark/icon.material.css.js.map +1 -0
  217. package/components/icon/icon.base.css.d.ts +1 -0
  218. package/components/icon/{icon.material.css.js → icon.base.css.js} +11 -13
  219. package/components/icon/icon.base.css.js.map +1 -0
  220. package/components/icon/icon.js +12 -3
  221. package/components/icon/icon.js.map +1 -1
  222. package/components/icon/light/icon.bootstrap.css.d.ts +1 -0
  223. package/components/icon/light/icon.bootstrap.css.js +60 -0
  224. package/components/icon/light/icon.bootstrap.css.js.map +1 -0
  225. package/components/icon/light/icon.fluent.css.d.ts +1 -0
  226. package/components/icon/light/icon.fluent.css.js +60 -0
  227. package/components/icon/light/icon.fluent.css.js.map +1 -0
  228. package/components/icon/light/icon.indigo.css.d.ts +1 -0
  229. package/components/icon/light/icon.indigo.css.js +60 -0
  230. package/components/icon/light/icon.indigo.css.js.map +1 -0
  231. package/components/icon/light/icon.material.css.d.ts +1 -0
  232. package/components/icon/light/icon.material.css.js +60 -0
  233. package/components/icon/light/icon.material.css.js.map +1 -0
  234. package/components/input/input-base.js.map +1 -1
  235. package/components/input/input.js +2 -1
  236. package/components/input/input.js.map +1 -1
  237. package/components/input/themes/light/input.base.css.js +4 -5
  238. package/components/input/themes/light/input.base.css.js.map +1 -1
  239. package/components/list/list-header.js.map +1 -1
  240. package/components/list/list-item.js.map +1 -1
  241. package/components/list/list.js.map +1 -1
  242. package/components/list/themes/light/list-header.base.css.js +4 -5
  243. package/components/list/themes/light/list-header.base.css.js.map +1 -1
  244. package/components/list/themes/light/list-item.base.css.js +4 -5
  245. package/components/list/themes/light/list-item.base.css.js.map +1 -1
  246. package/components/list/themes/light/list.base.css.js +4 -5
  247. package/components/list/themes/light/list.base.css.js.map +1 -1
  248. package/components/mask-input/mask-input-base.js.map +1 -1
  249. package/components/mask-input/mask-input.js +2 -1
  250. package/components/mask-input/mask-input.js.map +1 -1
  251. package/components/nav-drawer/nav-drawer-header-item.js.map +1 -1
  252. package/components/nav-drawer/nav-drawer-item.js.map +1 -1
  253. package/components/nav-drawer/nav-drawer.js.map +1 -1
  254. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js +4 -5
  255. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map +1 -1
  256. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js +4 -5
  257. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map +1 -1
  258. package/components/nav-drawer/themes/light/nav-drawer.base.css.js +4 -5
  259. package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map +1 -1
  260. package/components/navbar/navbar.js +3 -2
  261. package/components/navbar/navbar.js.map +1 -1
  262. package/components/navbar/themes/dark/navbar.bootstrap.css.d.ts +1 -0
  263. package/components/navbar/themes/dark/navbar.bootstrap.css.js +15 -0
  264. package/components/navbar/themes/dark/navbar.bootstrap.css.js.map +1 -0
  265. package/components/navbar/themes/dark/navbar.fluent.css.d.ts +1 -0
  266. package/components/navbar/themes/dark/navbar.fluent.css.js +15 -0
  267. package/components/navbar/themes/dark/navbar.fluent.css.js.map +1 -0
  268. package/components/navbar/themes/dark/navbar.indigo.css.d.ts +1 -0
  269. package/components/navbar/themes/dark/navbar.indigo.css.js +15 -0
  270. package/components/navbar/themes/dark/navbar.indigo.css.js.map +1 -0
  271. package/components/navbar/themes/dark/navbar.material.css.d.ts +1 -0
  272. package/components/navbar/themes/dark/navbar.material.css.js +15 -0
  273. package/components/navbar/themes/dark/navbar.material.css.js.map +1 -0
  274. package/components/navbar/themes/light/navbar.bootstrap.css.js +62 -6
  275. package/components/navbar/themes/light/navbar.bootstrap.css.js.map +1 -1
  276. package/components/navbar/themes/light/navbar.fluent.css.js +68 -1
  277. package/components/navbar/themes/light/navbar.fluent.css.js.map +1 -1
  278. package/components/navbar/themes/light/navbar.indigo.css.js +65 -3
  279. package/components/navbar/themes/light/navbar.indigo.css.js.map +1 -1
  280. package/components/navbar/themes/light/navbar.material.css.d.ts +1 -0
  281. package/components/navbar/themes/light/navbar.material.css.js +69 -0
  282. package/components/navbar/themes/light/navbar.material.css.js.map +1 -0
  283. package/components/navbar/themes/navbar.base.css.d.ts +1 -0
  284. package/components/navbar/themes/{light/navbar.base.css.js → navbar.base.css.js} +7 -10
  285. package/components/navbar/themes/navbar.base.css.js.map +1 -0
  286. package/components/progress/base.js.map +1 -1
  287. package/components/progress/circular-gradient.js +2 -1
  288. package/components/progress/circular-gradient.js.map +1 -1
  289. package/components/progress/circular-progress.js.map +1 -1
  290. package/components/progress/linear-progress.js.map +1 -1
  291. package/components/progress/themes/circular/circular.progress.base.css.js +4 -5
  292. package/components/progress/themes/circular/circular.progress.base.css.js.map +1 -1
  293. package/components/progress/themes/linear/linear.progress.base.css.js +4 -5
  294. package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
  295. package/components/progress/themes/linear/linear.progress.bootstrap.css.js +4 -5
  296. package/components/progress/themes/linear/linear.progress.bootstrap.css.js.map +1 -1
  297. package/components/progress/themes/linear/linear.progress.indigo.css.js +4 -5
  298. package/components/progress/themes/linear/linear.progress.indigo.css.js.map +1 -1
  299. package/components/radio/radio.js +6 -3
  300. package/components/radio/radio.js.map +1 -1
  301. package/components/radio/themes/dark/radio.bootstrap.css.d.ts +1 -0
  302. package/components/radio/themes/dark/radio.bootstrap.css.js +15 -0
  303. package/components/radio/themes/dark/radio.bootstrap.css.js.map +1 -0
  304. package/components/radio/themes/dark/radio.fluent.css.js +13 -1
  305. package/components/radio/themes/dark/radio.fluent.css.js.map +1 -1
  306. package/components/radio/themes/dark/radio.indigo.css.js +13 -1
  307. package/components/radio/themes/dark/radio.indigo.css.js.map +1 -1
  308. package/components/radio/themes/dark/radio.material.css.js +13 -1
  309. package/components/radio/themes/dark/radio.material.css.js.map +1 -1
  310. package/components/radio/themes/light/radio.base.css.js +24 -41
  311. package/components/radio/themes/light/radio.base.css.js.map +1 -1
  312. package/components/radio/themes/light/radio.bootstrap.css.js +102 -30
  313. package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
  314. package/components/radio/themes/light/radio.fluent.css.js +155 -66
  315. package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
  316. package/components/radio/themes/light/radio.indigo.css.js +106 -56
  317. package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
  318. package/components/radio/themes/light/radio.material.css.js +131 -16
  319. package/components/radio/themes/light/radio.material.css.js.map +1 -1
  320. package/components/radio-group/radio-group.base.css.js +4 -5
  321. package/components/radio-group/radio-group.base.css.js.map +1 -1
  322. package/components/radio-group/radio-group.js.map +1 -1
  323. package/components/rating/rating-symbol.base.css.js +4 -5
  324. package/components/rating/rating-symbol.base.css.js.map +1 -1
  325. package/components/rating/rating-symbol.js +2 -1
  326. package/components/rating/rating-symbol.js.map +1 -1
  327. package/components/rating/rating.base.css.js +4 -5
  328. package/components/rating/rating.base.css.js.map +1 -1
  329. package/components/rating/rating.js.map +1 -1
  330. package/components/ripple/ripple.js +2 -1
  331. package/components/ripple/ripple.js.map +1 -1
  332. package/components/ripple/ripple.material.css.js +4 -5
  333. package/components/ripple/ripple.material.css.js.map +1 -1
  334. package/components/select/select-group.js +2 -1
  335. package/components/select/select-group.js.map +1 -1
  336. package/components/select/select-header.js +2 -1
  337. package/components/select/select-header.js.map +1 -1
  338. package/components/select/select-item.js +2 -1
  339. package/components/select/select-item.js.map +1 -1
  340. package/components/select/select.d.ts +8 -0
  341. package/components/select/select.js +9 -4
  342. package/components/select/select.js.map +1 -1
  343. package/components/select/themes/light/select.base.css.js +4 -5
  344. package/components/select/themes/light/select.base.css.js.map +1 -1
  345. package/components/slider/range-slider.js +2 -1
  346. package/components/slider/range-slider.js.map +1 -1
  347. package/components/slider/slider-base.js.map +1 -1
  348. package/components/slider/slider-label.js +2 -1
  349. package/components/slider/slider-label.js.map +1 -1
  350. package/components/slider/slider.js +2 -1
  351. package/components/slider/slider.js.map +1 -1
  352. package/components/slider/themes/light/slider.base.css.js +4 -5
  353. package/components/slider/themes/light/slider.base.css.js.map +1 -1
  354. package/components/snackbar/snackbar.d.ts +5 -1
  355. package/components/snackbar/snackbar.js +19 -2
  356. package/components/snackbar/snackbar.js.map +1 -1
  357. package/components/snackbar/themes/light/snackbar.base.css.js +4 -5
  358. package/components/snackbar/themes/light/snackbar.base.css.js.map +1 -1
  359. package/components/stepper/step.js.map +1 -1
  360. package/components/stepper/stepper.d.ts +1 -1
  361. package/components/stepper/stepper.js +12 -3
  362. package/components/stepper/stepper.js.map +1 -1
  363. package/components/stepper/themes/step/light/step.base.css.js +7 -5
  364. package/components/stepper/themes/step/light/step.base.css.js.map +1 -1
  365. package/components/stepper/themes/stepper/stepper.base.css.js +13 -6
  366. package/components/stepper/themes/stepper/stepper.base.css.js.map +1 -1
  367. package/components/stepper/themes/stepper/stepper.bootstrap.css.js +4 -5
  368. package/components/stepper/themes/stepper/stepper.bootstrap.css.js.map +1 -1
  369. package/components/stepper/themes/stepper/stepper.fluent.css.js +4 -5
  370. package/components/stepper/themes/stepper/stepper.fluent.css.js.map +1 -1
  371. package/components/stepper/themes/stepper/stepper.indigo.css.js +4 -5
  372. package/components/stepper/themes/stepper/stepper.indigo.css.js.map +1 -1
  373. package/components/tabs/tab-panel.js +2 -1
  374. package/components/tabs/tab-panel.js.map +1 -1
  375. package/components/tabs/tab.js.map +1 -1
  376. package/components/tabs/tabs.js +1 -1
  377. package/components/tabs/tabs.js.map +1 -1
  378. package/components/tabs/themes/light/tab-panel.base.css.js +4 -5
  379. package/components/tabs/themes/light/tab-panel.base.css.js.map +1 -1
  380. package/components/tabs/themes/light/tab.base.css.js +4 -5
  381. package/components/tabs/themes/light/tab.base.css.js.map +1 -1
  382. package/components/tabs/themes/light/tabs.base.css.js +4 -5
  383. package/components/tabs/themes/light/tabs.base.css.js.map +1 -1
  384. package/components/toast/toast.d.ts +4 -1
  385. package/components/toast/toast.js +17 -2
  386. package/components/toast/toast.js.map +1 -1
  387. package/components/toggle/toggle.directive.d.ts +9 -3
  388. package/components/toggle/toggle.directive.js +54 -38
  389. package/components/toggle/toggle.directive.js.map +1 -1
  390. package/components/tree/themes/light/tree-item.base.css.js +4 -5
  391. package/components/tree/themes/light/tree-item.base.css.js.map +1 -1
  392. package/components/tree/themes/light/tree.base.css.js +4 -5
  393. package/components/tree/themes/light/tree.base.css.js.map +1 -1
  394. package/components/tree/tree-item.js.map +1 -1
  395. package/components/tree/tree.js.map +1 -1
  396. package/custom-elements.json +49 -32
  397. package/index.d.ts +1 -1
  398. package/index.js +1 -0
  399. package/index.js.map +1 -1
  400. package/package.json +6 -4
  401. package/themes/dark/bootstrap.css +320 -0
  402. package/themes/dark/fluent.css +303 -25
  403. package/themes/dark/indigo.css +307 -12
  404. package/themes/dark/material.css +329 -6
  405. package/themes/light/bootstrap.css +108 -0
  406. package/themes/light/fluent.css +108 -0
  407. package/themes/light/indigo.css +108 -0
  408. package/themes/light/material.css +108 -0
  409. package/vscode-html-custom-data.json +21 -32
  410. package/components/avatar/themes/avatar.base.css.js.map +0 -1
  411. package/components/avatar/themes/avatar.bootstrap.css.js.map +0 -1
  412. package/components/combo/utils/converters.d.ts +0 -3
  413. package/components/combo/utils/converters.js +0 -9
  414. package/components/combo/utils/converters.js.map +0 -1
  415. package/components/icon/icon.material.css.js.map +0 -1
  416. package/components/navbar/themes/light/navbar.base.css.js.map +0 -1
  417. /package/components/avatar/themes/{avatar.base.css.d.ts → dark/avatar.base.bootstrap.css.d.ts} +0 -0
  418. /package/components/avatar/themes/{avatar.bootstrap.css.d.ts → light/avatar.base.css.d.ts} +0 -0
  419. /package/components/{icon/icon.material.css.d.ts → avatar/themes/light/avatar.bootstrap.css.d.ts} +0 -0
  420. /package/components/{navbar/themes/light/navbar.base.css.d.ts → button/themes/button/dark/button.bootstrap.css.d.ts} +0 -0
@@ -1,11 +1,10 @@
1
1
  import { css } from 'lit';
2
2
  export const styles = css `:host {
3
3
  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
4
- --is-medium:
5
- min(
6
- clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
7
- clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
8
- );
4
+ --is-medium: min(
5
+ clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
6
+ clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
7
+ );
9
8
  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
10
9
  position: relative;
11
10
  -webkit-box-sizing: border-box;
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.base.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+DvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium:\n min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\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 */ /* 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:host {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n font-family: var(--ig-font-family);\n}\n\n[part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n overflow-y: auto;\n overflow-x: hidden;\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n -webkit-box-shadow: var(--ig-elevation-8);\n box-shadow: var(--ig-elevation-8);\n min-width: 7rem;\n padding: 0.5rem 0;\n z-index: 10005;\n}\n\n:host([size=small]) {\n --component-size: var(--ig-size, var(--ig-size-small));\n}\n\n:host([size=medium]) {\n --component-size: var(--ig-size, var(--ig-size-medium));\n}\n\n:host([size=large]) {\n --component-size: var(--ig-size, var(--ig-size-large));\n}`;\n"]}
1
+ {"version":3,"file":"dropdown.base.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8DvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\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 */ /* 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:host {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n font-family: var(--ig-font-family);\n}\n\n[part=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n overflow-y: auto;\n overflow-x: hidden;\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n -webkit-box-shadow: var(--ig-elevation-8);\n box-shadow: var(--ig-elevation-8);\n min-width: 7rem;\n padding: 0.5rem 0;\n z-index: 10005;\n}\n\n:host([size=small]) {\n --component-size: var(--ig-size, var(--ig-size-small));\n}\n\n:host([size=medium]) {\n --component-size: var(--ig-size, var(--ig-size-medium));\n}\n\n:host([size=large]) {\n --component-size: var(--ig-size, var(--ig-size-large));\n}`;\n"]}
@@ -14,6 +14,7 @@ declare const IgcExpansionPanelComponent_base: import("../common/mixins/construc
14
14
  *
15
15
  * @element igc-expansion-panel
16
16
  *
17
+ * @slot - renders the default content of the panel
17
18
  * @slot title - renders the title of the panel's header
18
19
  * @slot subtitle - renders the subtitle of the panel's header
19
20
  * @slot indicator - renders the expand/collapsed indicator
@@ -1 +1 @@
1
- {"version":3,"file":"expansion-panel.js","sourceRoot":"","sources":["../../../src/components/expansion-panel/expansion-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { styles } from './themes/light/expansion-panel.base.css.js';\nimport { styles as bootstrap } from './themes/light/expansion-panel.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/expansion-panel.fluent.css.js';\nimport { styles as indigo } from './themes/light/expansion-panel.indigo.css.js';\nimport { createCounter } from '../common/util.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport {\n AnimationPlayer,\n growVerIn,\n growVerOut,\n} from '../../animations/index.js';\n\ndefineComponents(IgcIconComponent);\n\nexport interface IgcExpansionPanelComponentEventMap {\n igcOpening: CustomEvent<IgcExpansionPanelComponent>;\n igcOpened: CustomEvent<IgcExpansionPanelComponent>;\n igcClosing: CustomEvent<IgcExpansionPanelComponent>;\n igcClosed: CustomEvent<IgcExpansionPanelComponent>;\n}\n\n/**\n * The Expansion Panel Component provides a way to display information in a toggleable way -\n * compact summary view containing title and description and expanded detail view containing\n * additional content to the summary header.\n *\n * @element igc-expansion-panel\n *\n * @slot title - renders the title of the panel's header\n * @slot subtitle - renders the subtitle of the panel's header\n * @slot indicator - renders the expand/collapsed indicator\n *\n * @fires igcOpening - Emitted before opening the expansion panel.\n * @fires igcOpened - Emitted after the expansion panel is opened.\n * @fires igcClosing - Emitted before closing the expansion panel.\n * @fires igcClosed - Emitted after the expansion panel is closed.\n *\n * @csspart header - The container of the expansion indicator, title and subtitle.\n * @csspart title - The title container.\n * @csspart subtitle - The subtitle container.\n * @csspart indicator - The indicator container.\n * @csspart content - The expansion panel's content wrapper.\n */\n@themes({ bootstrap, fluent, indigo })\nexport default class IgcExpansionPanelComponent extends EventEmitterMixin<\n IgcExpansionPanelComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-expansion-panel';\n public static styles = styles;\n private static readonly increment = createCounter();\n private animationPlayer!: AnimationPlayer;\n\n /**\n * Indicates whether the contents of the control should be visible.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public open = false;\n\n /**\n * Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public disabled = false;\n\n /**\n * The indicator position of the expansion panel.\n * @attr indicator-position\n */\n @property({ reflect: true, attribute: 'indicator-position' })\n public indicatorPosition: 'start' | 'end' | 'none' = 'start';\n\n @query('[part~=\"header\"]', true)\n protected panelHeader!: HTMLElement;\n\n @query('[part~=\"content\"]', true)\n protected panelContent!: HTMLElement;\n\n private panelId!: string;\n\n public override connectedCallback() {\n super.connectedCallback();\n this.panelId =\n this.getAttribute('id') ||\n `igc-expansion-panel-${IgcExpansionPanelComponent.increment()}`;\n }\n\n public override firstUpdated() {\n this.animationPlayer = new AnimationPlayer(this.panelContent);\n }\n\n private handleClicked() {\n this.panelHeader!.focus();\n\n if (this.open) {\n this.closeWithEvent();\n } else {\n this.openWithEvent();\n }\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.disabled) {\n return;\n }\n\n switch (event.key.toLowerCase()) {\n case 'arrowdown':\n case 'down':\n if (event.altKey) {\n this.openWithEvent();\n }\n break;\n case 'arrowup':\n case 'up':\n if (event.altKey) {\n this.closeWithEvent();\n }\n break;\n case 'enter':\n case ' ':\n this.open ? this.closeWithEvent() : this.openWithEvent();\n break;\n }\n }\n\n private async toggleAnimation(dir: 'open' | 'close') {\n const animation = dir === 'open' ? growVerIn : growVerOut;\n\n const [_, event] = await Promise.all([\n this.animationPlayer.stopAll(),\n this.animationPlayer.play(animation),\n ]);\n\n return event.type === 'finish';\n }\n\n /**\n * @private\n * Opens the panel.\n */\n private async openWithEvent() {\n if (this.open) {\n return;\n }\n\n const args = {\n cancelable: true,\n detail: this,\n };\n\n const allowed = this.emitEvent('igcOpening', args);\n\n if (!allowed) {\n return;\n }\n\n this.open = true;\n\n if (await this.toggleAnimation('open')) {\n this.emitEvent('igcOpened', { detail: this });\n }\n }\n\n /**\n * @private\n * Closes the panel.\n */\n private async closeWithEvent() {\n if (!this.open) {\n return;\n }\n\n const args = {\n cancelable: true,\n detail: this,\n };\n\n const allowed = this.emitEvent('igcClosing', args);\n\n if (!allowed) {\n return;\n }\n\n this.open = false;\n\n if (await this.toggleAnimation('close')) {\n this.emitEvent('igcClosed', { detail: this });\n }\n }\n\n /** Toggles panel open state. */\n public toggle(): void {\n this.open ? this.hide() : this.show();\n }\n\n /** Hides the panel content. */\n public hide(): void {\n if (this.open) {\n this.toggleAnimation('close');\n }\n\n this.open = false;\n }\n\n /** Shows the panel content. */\n public show(): void {\n if (!this.open) {\n this.toggleAnimation('open');\n }\n\n this.open = true;\n }\n\n private indicatorTemplate() {\n return html`\n <div part=\"indicator\" aria-hidden=\"true\">\n <slot name=\"indicator\">\n <igc-icon\n name=${this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}\n collection=\"internal\"\n >\n </igc-icon>\n </slot>\n </div>\n `;\n }\n\n private headerTemplate() {\n return html`\n <div\n part=\"header\"\n id=\"${this.panelId!}-header\"\n role=\"button\"\n aria-expanded=\"${this.open}\"\n aria-disabled=\"${this.disabled}\"\n aria-controls=\"${this.panelId!}-content\"\n tabindex=${this.disabled ? '-1' : '0'}\n @click=${this.handleClicked}\n @keydown=${this.handleKeydown}\n >\n ${this.indicatorTemplate()}\n <div>\n <slot name=\"title\" part=\"title\"></slot>\n <slot name=\"subtitle\" part=\"subtitle\"></slot>\n </div>\n </div>\n `;\n }\n\n private contentTemplate() {\n return html`\n <div\n part=\"content\"\n role=\"region\"\n id=\"${this.panelId!}-content\"\n aria-labelledby=\"${this.panelId!}-header\"\n aria-hidden=${!this.open}\n >\n <slot></slot>\n </div>\n `;\n }\n\n protected override render() {\n return html` ${this.headerTemplate()} ${this.contentTemplate()}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-expansion-panel': IgcExpansionPanelComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"expansion-panel.js","sourceRoot":"","sources":["../../../src/components/expansion-panel/expansion-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { styles } from './themes/light/expansion-panel.base.css.js';\nimport { styles as bootstrap } from './themes/light/expansion-panel.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/expansion-panel.fluent.css.js';\nimport { styles as indigo } from './themes/light/expansion-panel.indigo.css.js';\nimport { createCounter } from '../common/util.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport {\n AnimationPlayer,\n growVerIn,\n growVerOut,\n} from '../../animations/index.js';\n\ndefineComponents(IgcIconComponent);\n\nexport interface IgcExpansionPanelComponentEventMap {\n igcOpening: CustomEvent<IgcExpansionPanelComponent>;\n igcOpened: CustomEvent<IgcExpansionPanelComponent>;\n igcClosing: CustomEvent<IgcExpansionPanelComponent>;\n igcClosed: CustomEvent<IgcExpansionPanelComponent>;\n}\n\n/**\n * The Expansion Panel Component provides a way to display information in a toggleable way -\n * compact summary view containing title and description and expanded detail view containing\n * additional content to the summary header.\n *\n * @element igc-expansion-panel\n *\n * @slot - renders the default content of the panel\n * @slot title - renders the title of the panel's header\n * @slot subtitle - renders the subtitle of the panel's header\n * @slot indicator - renders the expand/collapsed indicator\n *\n * @fires igcOpening - Emitted before opening the expansion panel.\n * @fires igcOpened - Emitted after the expansion panel is opened.\n * @fires igcClosing - Emitted before closing the expansion panel.\n * @fires igcClosed - Emitted after the expansion panel is closed.\n *\n * @csspart header - The container of the expansion indicator, title and subtitle.\n * @csspart title - The title container.\n * @csspart subtitle - The subtitle container.\n * @csspart indicator - The indicator container.\n * @csspart content - The expansion panel's content wrapper.\n */\n@themes({ bootstrap, fluent, indigo })\nexport default class IgcExpansionPanelComponent extends EventEmitterMixin<\n IgcExpansionPanelComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-expansion-panel';\n public static styles = styles;\n private static readonly increment = createCounter();\n private animationPlayer!: AnimationPlayer;\n\n /**\n * Indicates whether the contents of the control should be visible.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public open = false;\n\n /**\n * Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public disabled = false;\n\n /**\n * The indicator position of the expansion panel.\n * @attr indicator-position\n */\n @property({ reflect: true, attribute: 'indicator-position' })\n public indicatorPosition: 'start' | 'end' | 'none' = 'start';\n\n @query('[part~=\"header\"]', true)\n protected panelHeader!: HTMLElement;\n\n @query('[part~=\"content\"]', true)\n protected panelContent!: HTMLElement;\n\n private panelId!: string;\n\n public override connectedCallback() {\n super.connectedCallback();\n this.panelId =\n this.getAttribute('id') ||\n `igc-expansion-panel-${IgcExpansionPanelComponent.increment()}`;\n }\n\n public override firstUpdated() {\n this.animationPlayer = new AnimationPlayer(this.panelContent);\n }\n\n private handleClicked() {\n this.panelHeader!.focus();\n\n if (this.open) {\n this.closeWithEvent();\n } else {\n this.openWithEvent();\n }\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.disabled) {\n return;\n }\n\n switch (event.key.toLowerCase()) {\n case 'arrowdown':\n case 'down':\n if (event.altKey) {\n this.openWithEvent();\n }\n break;\n case 'arrowup':\n case 'up':\n if (event.altKey) {\n this.closeWithEvent();\n }\n break;\n case 'enter':\n case ' ':\n this.open ? this.closeWithEvent() : this.openWithEvent();\n break;\n }\n }\n\n private async toggleAnimation(dir: 'open' | 'close') {\n const animation = dir === 'open' ? growVerIn : growVerOut;\n\n const [_, event] = await Promise.all([\n this.animationPlayer.stopAll(),\n this.animationPlayer.play(animation),\n ]);\n\n return event.type === 'finish';\n }\n\n /**\n * @private\n * Opens the panel.\n */\n private async openWithEvent() {\n if (this.open) {\n return;\n }\n\n const args = {\n cancelable: true,\n detail: this,\n };\n\n const allowed = this.emitEvent('igcOpening', args);\n\n if (!allowed) {\n return;\n }\n\n this.open = true;\n\n if (await this.toggleAnimation('open')) {\n this.emitEvent('igcOpened', { detail: this });\n }\n }\n\n /**\n * @private\n * Closes the panel.\n */\n private async closeWithEvent() {\n if (!this.open) {\n return;\n }\n\n const args = {\n cancelable: true,\n detail: this,\n };\n\n const allowed = this.emitEvent('igcClosing', args);\n\n if (!allowed) {\n return;\n }\n\n this.open = false;\n\n if (await this.toggleAnimation('close')) {\n this.emitEvent('igcClosed', { detail: this });\n }\n }\n\n /** Toggles panel open state. */\n public toggle(): void {\n this.open ? this.hide() : this.show();\n }\n\n /** Hides the panel content. */\n public hide(): void {\n if (this.open) {\n this.toggleAnimation('close');\n }\n\n this.open = false;\n }\n\n /** Shows the panel content. */\n public show(): void {\n if (!this.open) {\n this.toggleAnimation('open');\n }\n\n this.open = true;\n }\n\n private indicatorTemplate() {\n return html`\n <div part=\"indicator\" aria-hidden=\"true\">\n <slot name=\"indicator\">\n <igc-icon\n name=${this.open ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}\n collection=\"internal\"\n >\n </igc-icon>\n </slot>\n </div>\n `;\n }\n\n private headerTemplate() {\n return html`\n <div\n part=\"header\"\n id=\"${this.panelId!}-header\"\n role=\"button\"\n aria-expanded=\"${this.open}\"\n aria-disabled=\"${this.disabled}\"\n aria-controls=\"${this.panelId!}-content\"\n tabindex=${this.disabled ? '-1' : '0'}\n @click=${this.handleClicked}\n @keydown=${this.handleKeydown}\n >\n ${this.indicatorTemplate()}\n <div>\n <slot name=\"title\" part=\"title\"></slot>\n <slot name=\"subtitle\" part=\"subtitle\"></slot>\n </div>\n </div>\n `;\n }\n\n private contentTemplate() {\n return html`\n <div\n part=\"content\"\n role=\"region\"\n id=\"${this.panelId!}-content\"\n aria-labelledby=\"${this.panelId!}-header\"\n aria-hidden=${!this.open}\n >\n <slot></slot>\n </div>\n `;\n }\n\n protected override render() {\n return html` ${this.headerTemplate()} ${this.contentTemplate()}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-expansion-panel': IgcExpansionPanelComponent;\n }\n}\n"]}
@@ -1,11 +1,10 @@
1
1
  import { css } from 'lit';
2
2
  export const styles = css `:host {
3
3
  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
4
- --is-medium:
5
- min(
6
- clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
7
- clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
8
- );
4
+ --is-medium: min(
5
+ clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
6
+ clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
7
+ );
9
8
  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
10
9
  position: relative;
11
10
  -webkit-box-sizing: border-box;
@@ -1 +1 @@
1
- {"version":3,"file":"expansion-panel.base.css.js","sourceRoot":"","sources":["../../../../../src/components/expansion-panel/themes/light/expansion-panel.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsLvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium:\n min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\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 */ /* 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:host {\n --lines-clamped: 1;\n color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n width: auto;\n overflow: hidden;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n\n[part=header] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n cursor: pointer;\n padding-inline: max(var(--is-large, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)), var(--is-medium, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)), var(--is-small, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)));\n padding-block: max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-large, var(--ig-spacing-block, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-medium, var(--ig-spacing-block, --ig-spacing)), var(--is-small, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-small, var(--ig-spacing-block, --ig-spacing)));\n}\n[part=header]:focus, [part=header]:active {\n outline: transparent;\n background: hsla(var(--ig-gray-100), var(--ig-gray-a));\n}\n[part=header] *:not([part~=indicator]) {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 0 0%;\n flex: 1 0 0%;\n overflow: hidden;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n\n[part=title]::slotted(*) {\n font-family: var(--ig-h5-font-family, var(--ig-font-family));\n font-size: var(--ig-h5-font-size);\n font-weight: var(--ig-h5-font-weight);\n font-style: var(--ig-h5-font-style);\n line-height: var(--ig-h5-line-height);\n letter-spacing: var(--ig-h5-letter-spacing);\n text-transform: var(--ig-h5-text-transform);\n margin-top: var(--ig-h5-margin-top);\n margin-bottom: var(--ig-h5-margin-bottom);\n display: -webkit-inline-box;\n -webkit-line-clamp: var(--lines-clamped);\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin: 0;\n}\n\n[part=subtitle] {\n color: hsla(var(--ig-gray-700), var(--ig-gray-a));\n}\n[part=subtitle]::slotted(*) {\n font-family: var(--ig-subtitle-2-font-family, var(--ig-font-family));\n font-size: var(--ig-subtitle-2-font-size);\n font-weight: var(--ig-subtitle-2-font-weight);\n font-style: var(--ig-subtitle-2-font-style);\n line-height: var(--ig-subtitle-2-line-height);\n letter-spacing: var(--ig-subtitle-2-letter-spacing);\n text-transform: var(--ig-subtitle-2-text-transform);\n margin-top: var(--ig-subtitle-2-margin-top);\n margin-bottom: var(--ig-subtitle-2-margin-bottom);\n white-space: nowrap;\n -o-text-overflow: ellipsis;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n[part=content] ::slotted(*) {\n font-family: var(--ig-body-2-font-family, var(--ig-font-family));\n font-size: var(--ig-body-2-font-size);\n font-weight: var(--ig-body-2-font-weight);\n font-style: var(--ig-body-2-font-style);\n line-height: var(--ig-body-2-line-height);\n letter-spacing: var(--ig-body-2-letter-spacing);\n text-transform: var(--ig-body-2-text-transform);\n margin-top: var(--ig-body-2-margin-top);\n margin-bottom: var(--ig-body-2-margin-bottom);\n}\n\n[part~=content] {\n overflow: hidden;\n}\n[part~=content] > slot {\n display: block;\n padding-inline: max(var(--is-large, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)), var(--is-medium, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)), var(--is-small, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)));\n padding-block: max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-large, var(--ig-spacing-block, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-medium, var(--ig-spacing-block, --ig-spacing)), var(--is-small, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-small, var(--ig-spacing-block, --ig-spacing)));\n}\n\n:host(:not([open])) [part~=content] {\n height: 0;\n}\n\n:host([open]) [part~=content] {\n height: auto;\n}\n\n[part~=indicator] {\n color: hsla(var(--ig-gray-800), var(--ig-gray-a));\n}\n\n[part~=indicator] igc-icon {\n --size: 1.5rem;\n}\n\n:host([indicator-position=start]) [part~=indicator] {\n -webkit-margin-end: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n margin-inline-end: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n}\n\n:host([indicator-position=end]) [part~=indicator] {\n -webkit-box-ordinal-group: 3;\n -ms-flex-order: 2;\n order: 2;\n -webkit-margin-start: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n margin-inline-start: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n}\n\n:host([indicator-position=none]) [part~=indicator] {\n display: none;\n}\n\n:host([disabled]) {\n pointer-events: none;\n}\n:host([disabled]) [part=title],\n:host([disabled]) [part=subtitle],\n:host([disabled]) [part~=indicator] {\n color: var(--disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n}`;\n"]}
1
+ {"version":3,"file":"expansion-panel.base.css.js","sourceRoot":"","sources":["../../../../../src/components/expansion-panel/themes/light/expansion-panel.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqLvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\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 */ /* 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:host {\n --lines-clamped: 1;\n color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n width: auto;\n overflow: hidden;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n\n[part=header] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n cursor: pointer;\n padding-inline: max(var(--is-large, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)), var(--is-medium, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)), var(--is-small, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)));\n padding-block: max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-large, var(--ig-spacing-block, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-medium, var(--ig-spacing-block, --ig-spacing)), var(--is-small, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-small, var(--ig-spacing-block, --ig-spacing)));\n}\n[part=header]:focus, [part=header]:active {\n outline: transparent;\n background: hsla(var(--ig-gray-100), var(--ig-gray-a));\n}\n[part=header] *:not([part~=indicator]) {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 0 0%;\n flex: 1 0 0%;\n overflow: hidden;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n\n[part=title]::slotted(*) {\n font-family: var(--ig-h5-font-family, var(--ig-font-family));\n font-size: var(--ig-h5-font-size);\n font-weight: var(--ig-h5-font-weight);\n font-style: var(--ig-h5-font-style);\n line-height: var(--ig-h5-line-height);\n letter-spacing: var(--ig-h5-letter-spacing);\n text-transform: var(--ig-h5-text-transform);\n margin-top: var(--ig-h5-margin-top);\n margin-bottom: var(--ig-h5-margin-bottom);\n display: -webkit-inline-box;\n -webkit-line-clamp: var(--lines-clamped);\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin: 0;\n}\n\n[part=subtitle] {\n color: hsla(var(--ig-gray-700), var(--ig-gray-a));\n}\n[part=subtitle]::slotted(*) {\n font-family: var(--ig-subtitle-2-font-family, var(--ig-font-family));\n font-size: var(--ig-subtitle-2-font-size);\n font-weight: var(--ig-subtitle-2-font-weight);\n font-style: var(--ig-subtitle-2-font-style);\n line-height: var(--ig-subtitle-2-line-height);\n letter-spacing: var(--ig-subtitle-2-letter-spacing);\n text-transform: var(--ig-subtitle-2-text-transform);\n margin-top: var(--ig-subtitle-2-margin-top);\n margin-bottom: var(--ig-subtitle-2-margin-bottom);\n white-space: nowrap;\n -o-text-overflow: ellipsis;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n[part=content] ::slotted(*) {\n font-family: var(--ig-body-2-font-family, var(--ig-font-family));\n font-size: var(--ig-body-2-font-size);\n font-weight: var(--ig-body-2-font-weight);\n font-style: var(--ig-body-2-font-style);\n line-height: var(--ig-body-2-line-height);\n letter-spacing: var(--ig-body-2-letter-spacing);\n text-transform: var(--ig-body-2-text-transform);\n margin-top: var(--ig-body-2-margin-top);\n margin-bottom: var(--ig-body-2-margin-bottom);\n}\n\n[part~=content] {\n overflow: hidden;\n}\n[part~=content] > slot {\n display: block;\n padding-inline: max(var(--is-large, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)), var(--is-medium, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)), var(--is-small, 1) * max(24px, -1 * 24px) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)));\n padding-block: max(var(--is-large, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-large, var(--ig-spacing-block, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-medium, var(--ig-spacing-block, --ig-spacing)), var(--is-small, 1) * max(16px, -1 * 16px) * var(--ig-spacing-block-small, var(--ig-spacing-block, --ig-spacing)));\n}\n\n:host(:not([open])) [part~=content] {\n height: 0;\n}\n\n:host([open]) [part~=content] {\n height: auto;\n}\n\n[part~=indicator] {\n color: hsla(var(--ig-gray-800), var(--ig-gray-a));\n}\n\n[part~=indicator] igc-icon {\n --size: 1.5rem;\n}\n\n:host([indicator-position=start]) [part~=indicator] {\n -webkit-margin-end: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n margin-inline-end: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n}\n\n:host([indicator-position=end]) [part~=indicator] {\n -webkit-box-ordinal-group: 3;\n -ms-flex-order: 2;\n order: 2;\n -webkit-margin-start: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n margin-inline-start: 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(16px, -1 * 16px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n}\n\n:host([indicator-position=none]) [part~=indicator] {\n display: none;\n}\n\n:host([disabled]) {\n pointer-events: none;\n}\n:host([disabled]) [part=title],\n:host([disabled]) [part=subtitle],\n:host([disabled]) [part~=indicator] {\n color: var(--disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n}`;\n"]}
@@ -9,7 +9,7 @@ import { property } from 'lit/decorators.js';
9
9
  import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
10
10
  import { alternateName } from '../common/decorators/alternateName.js';
11
11
  import { blazorSuppress } from '../common/decorators/blazorSuppress.js';
12
- export default class IgcFormComponent extends EventEmitterMixin(LitElement) {
12
+ class IgcFormComponent extends EventEmitterMixin(LitElement) {
13
13
  constructor() {
14
14
  super();
15
15
  this._controlsWithChecked = [
@@ -152,4 +152,5 @@ __decorate([
152
152
  __decorate([
153
153
  blazorSuppress()
154
154
  ], IgcFormComponent.prototype, "getFormData", null);
155
+ export default IgcFormComponent;
155
156
  //# sourceMappingURL=form.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"form.js","sourceRoot":"","sources":["../../../src/components/form/form.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { alternateName } from '../common/decorators/alternateName.js';\nimport { blazorSuppress } from '../common/decorators/blazorSuppress.js';\n\nexport interface IgcFormEventMap {\n igcSubmit: CustomEvent<FormData>;\n igcReset: CustomEvent;\n}\n\n/**\n * The form is a component used to collect user input from\n * interactive controls.\n *\n * @element igc-form\n *\n * @slot - Default slot for the form.\n *\n * @fires igcSubmit - Emitted when the form is submitted.\n * @fires igcReset - Emitted when the form is reset.\n */\nexport default class IgcFormComponent extends EventEmitterMixin<\n IgcFormEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-form';\n\n public static styles = css`\n :host {\n display: block;\n }\n `;\n\n private _controlsWithChecked = [\n 'input',\n 'radio',\n 'igc-radio',\n 'igc-switch',\n 'igc-checkbox',\n ];\n private _controlsWithValue = [\n 'input',\n 'igc-input',\n 'igc-mask-input',\n 'textarea',\n 'igc-rating',\n 'igc-select',\n 'igc-combo',\n 'igc-date-time-input',\n ];\n private _controlsThatSubmit = [\n 'input',\n 'button',\n 'igc-button',\n 'igc-icon-button',\n ];\n\n /** Specifies if form data validation should be skipped on submit. */\n @property({ type: Boolean, reflect: true }) public novalidate = false;\n\n constructor() {\n super();\n\n this.addEventListener('click', this.handleClick);\n }\n\n /** Submits the form. */\n @alternateName('performSubmit')\n public submit(): boolean {\n const formData = this.getFormData();\n if (!this.novalidate && !this.reportValidity()) {\n return false;\n }\n\n this.emitEvent('igcSubmit', { detail: formData });\n return true;\n }\n\n /** Resets the form. */\n @alternateName('performReset')\n public reset() {\n const formElements = this.getFormElements();\n formElements.forEach((element) => {\n const tagName = element.tagName.toLowerCase();\n if (tagName === 'select') {\n for (let i = 0; i < element.options.length; i++) {\n const option = element.options[i];\n option.selected = option.defaultSelected;\n }\n } else if (\n (tagName === 'input' &&\n (element.type === 'checkbox' || element.type == 'radio')) ||\n (tagName !== 'input' && this._controlsWithChecked.includes(tagName))\n ) {\n element.checked = element.hasAttribute('checked');\n } else if (\n tagName === 'igc-input' ||\n tagName === 'igc-rating' ||\n tagName === 'igc-mask-input' ||\n tagName === 'igc-date-time-input'\n ) {\n element.value = element.getAttribute('value');\n } else if (this._controlsWithValue.includes(tagName)) {\n element.value = element.defaultValue;\n }\n });\n\n this.emitEvent('igcReset');\n }\n\n private getFormElements(): any[] {\n const slot = this.shadowRoot?.querySelector('slot');\n const assignedElements = slot?.assignedElements({ flatten: true });\n const formElements: any[] = [];\n assignedElements?.forEach((element: any) => {\n if (!element.disabled) {\n formElements.push(element);\n }\n const children = Array.from(element.getElementsByTagName('*')).filter(\n (element: any) => !element.disabled\n );\n formElements.push(...children);\n });\n\n return formElements;\n }\n\n //suppressing in blazor for now due to an issue, bringing it back later\n /** Retrieves the data from the form in the format of a FormData object. */\n @blazorSuppress()\n public getFormData() {\n const formData = new FormData();\n\n const formElements = this.getFormElements();\n formElements.forEach((element) => {\n const tagName = element.tagName.toLowerCase();\n if (tagName === 'select') {\n for (let i = 0; i < element.options.length; i++) {\n const option = element.options[i];\n if (option.selected) {\n formData.append(element.name, option.value);\n }\n }\n } else if (\n this._controlsWithChecked.includes(tagName) &&\n element.checked\n ) {\n formData.append(element.name, element.value || 'on');\n } else if (\n this._controlsWithValue.includes(tagName) &&\n element.type !== 'checkbox' &&\n element.type !== 'radio' &&\n element.type !== 'submit'\n ) {\n formData.append(element.name, element.value);\n }\n });\n\n return formData;\n }\n\n /** Checks for validity of the form. */\n public reportValidity(): boolean {\n const formElements = this.getFormElements();\n return !formElements.some(\n (element) =>\n typeof element.reportValidity === 'function' &&\n element.reportValidity() === false\n );\n }\n\n private handleClick(event: MouseEvent) {\n const targetElement: any = event.target as HTMLElement;\n if (\n this._controlsThatSubmit.includes(targetElement.tagName.toLowerCase()) &&\n targetElement.type?.toLowerCase() === 'submit'\n ) {\n this.submit();\n } else if (targetElement.type?.toLowerCase() === 'reset') {\n this.reset();\n }\n\n return true;\n }\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-form': IgcFormComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"form.js","sourceRoot":"","sources":["../../../src/components/form/form.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { alternateName } from '../common/decorators/alternateName.js';\nimport { blazorSuppress } from '../common/decorators/blazorSuppress.js';\n\nexport interface IgcFormEventMap {\n igcSubmit: CustomEvent<FormData>;\n igcReset: CustomEvent;\n}\n\n/**\n * The form is a component used to collect user input from\n * interactive controls.\n *\n * @element igc-form\n *\n * @slot - Default slot for the form.\n *\n * @fires igcSubmit - Emitted when the form is submitted.\n * @fires igcReset - Emitted when the form is reset.\n */\nexport default class IgcFormComponent extends EventEmitterMixin<\n IgcFormEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-form';\n\n public static styles = css`\n :host {\n display: block;\n }\n `;\n\n private _controlsWithChecked = [\n 'input',\n 'radio',\n 'igc-radio',\n 'igc-switch',\n 'igc-checkbox',\n ];\n private _controlsWithValue = [\n 'input',\n 'igc-input',\n 'igc-mask-input',\n 'textarea',\n 'igc-rating',\n 'igc-select',\n 'igc-combo',\n 'igc-date-time-input',\n ];\n private _controlsThatSubmit = [\n 'input',\n 'button',\n 'igc-button',\n 'igc-icon-button',\n ];\n\n /** Specifies if form data validation should be skipped on submit. */\n @property({ type: Boolean, reflect: true }) public novalidate = false;\n\n constructor() {\n super();\n\n this.addEventListener('click', this.handleClick);\n }\n\n /** Submits the form. */\n @alternateName('performSubmit')\n public submit(): boolean {\n const formData = this.getFormData();\n if (!this.novalidate && !this.reportValidity()) {\n return false;\n }\n\n this.emitEvent('igcSubmit', { detail: formData });\n return true;\n }\n\n /** Resets the form. */\n @alternateName('performReset')\n public reset() {\n const formElements = this.getFormElements();\n formElements.forEach((element) => {\n const tagName = element.tagName.toLowerCase();\n if (tagName === 'select') {\n for (let i = 0; i < element.options.length; i++) {\n const option = element.options[i];\n option.selected = option.defaultSelected;\n }\n } else if (\n (tagName === 'input' &&\n (element.type === 'checkbox' || element.type == 'radio')) ||\n (tagName !== 'input' && this._controlsWithChecked.includes(tagName))\n ) {\n element.checked = element.hasAttribute('checked');\n } else if (\n tagName === 'igc-input' ||\n tagName === 'igc-rating' ||\n tagName === 'igc-mask-input' ||\n tagName === 'igc-date-time-input'\n ) {\n element.value = element.getAttribute('value');\n } else if (this._controlsWithValue.includes(tagName)) {\n element.value = element.defaultValue;\n }\n });\n\n this.emitEvent('igcReset');\n }\n\n private getFormElements(): any[] {\n const slot = this.shadowRoot?.querySelector('slot');\n const assignedElements = slot?.assignedElements({ flatten: true });\n const formElements: any[] = [];\n assignedElements?.forEach((element: any) => {\n if (!element.disabled) {\n formElements.push(element);\n }\n const children = Array.from(element.getElementsByTagName('*')).filter(\n (element: any) => !element.disabled\n );\n formElements.push(...children);\n });\n\n return formElements;\n }\n\n //suppressing in blazor for now due to an issue, bringing it back later\n /** Retrieves the data from the form in the format of a FormData object. */\n @blazorSuppress()\n public getFormData() {\n const formData = new FormData();\n\n const formElements = this.getFormElements();\n formElements.forEach((element) => {\n const tagName = element.tagName.toLowerCase();\n if (tagName === 'select') {\n for (let i = 0; i < element.options.length; i++) {\n const option = element.options[i];\n if (option.selected) {\n formData.append(element.name, option.value);\n }\n }\n } else if (\n this._controlsWithChecked.includes(tagName) &&\n element.checked\n ) {\n formData.append(element.name, element.value || 'on');\n } else if (\n this._controlsWithValue.includes(tagName) &&\n element.type !== 'checkbox' &&\n element.type !== 'radio' &&\n element.type !== 'submit'\n ) {\n formData.append(element.name, element.value);\n }\n });\n\n return formData;\n }\n\n /** Checks for validity of the form. */\n public reportValidity(): boolean {\n const formElements = this.getFormElements();\n return !formElements.some(\n (element) =>\n typeof element.reportValidity === 'function' &&\n element.reportValidity() === false\n );\n }\n\n private handleClick(event: MouseEvent) {\n const targetElement: any = event.target as HTMLElement;\n if (\n this._controlsThatSubmit.includes(targetElement.tagName.toLowerCase()) &&\n targetElement.type?.toLowerCase() === 'submit'\n ) {\n this.submit();\n } else if (targetElement.type?.toLowerCase() === 'reset') {\n this.reset();\n }\n\n return true;\n }\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-form': IgcFormComponent;\n }\n}\n"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,15 @@
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
+ //# sourceMappingURL=icon.bootstrap.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.bootstrap.css.js","sourceRoot":"","sources":["../../../../src/components/icon/dark/icon.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;wMAY+K,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"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -1,7 +1,15 @@
1
1
  import { css } from 'lit';
2
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
- :host([shape=square]) [part=base],
4
- :host([shape=rounded]) [part=base] {
5
- border-radius: 0.25rem;
6
- }`;
7
- //# sourceMappingURL=avatar.bootstrap.css.js.map
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
+ //# sourceMappingURL=icon.fluent.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.fluent.css.js","sourceRoot":"","sources":["../../../../src/components/icon/dark/icon.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;wMAY+K,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"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,15 @@
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
+ //# sourceMappingURL=icon.indigo.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.indigo.css.js","sourceRoot":"","sources":["../../../../src/components/icon/dark/icon.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;wMAY+K,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"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,15 @@
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
+ //# sourceMappingURL=icon.material.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.material.css.js","sourceRoot":"","sources":["../../../../src/components/icon/dark/icon.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;wMAY+K,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"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -1,11 +1,10 @@
1
1
  import { css } from 'lit';
2
2
  export const styles = css `:host {
3
3
  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
4
- --is-medium:
5
- min(
6
- clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
7
- clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
8
- );
4
+ --is-medium: min(
5
+ clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
6
+ clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
7
+ );
9
8
  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
10
9
  position: relative;
11
10
  -webkit-box-sizing: border-box;
@@ -33,13 +32,8 @@ export const styles = css `:host {
33
32
  }
34
33
 
35
34
  /* 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 */
36
- svg {
37
- height: var(--size);
38
- width: var(--size);
39
- }
40
-
41
35
  :host {
42
- --size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.25rem, -1 * 1.25rem), var(--is-small, 1) * max(1rem, -1 * 1rem));
36
+ --size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.25rem, -1 * 1.25rem), var(--is-small, 1) * max(1rem, -1 * 1rem)) !important;
43
37
  display: -webkit-inline-box;
44
38
  display: -ms-inline-flexbox;
45
39
  display: inline-flex;
@@ -51,7 +45,6 @@ svg {
51
45
  justify-content: center;
52
46
  width: var(--size);
53
47
  height: var(--size);
54
- fill: currentcolor;
55
48
  }
56
49
 
57
50
  :host([size=small]) {
@@ -66,9 +59,14 @@ svg {
66
59
  --component-size: var(--ig-size, var(--ig-size-large));
67
60
  }
68
61
 
62
+ svg {
63
+ height: var(--size);
64
+ width: var(--size);
65
+ }
66
+
69
67
  :host([mirrored]) {
70
68
  -webkit-transform: scaleX(-1);
71
69
  -ms-transform: scaleX(-1);
72
70
  transform: scaleX(-1);
73
71
  }`;
74
- //# sourceMappingURL=icon.material.css.js.map
72
+ //# sourceMappingURL=icon.base.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.base.css.js","sourceRoot":"","sources":["../../../src/components/icon/icon.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqEvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\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 */ /* 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:host {\n --size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.25rem, -1 * 1.25rem), var(--is-small, 1) * max(1rem, -1 * 1rem)) !important;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n width: var(--size);\n height: var(--size);\n}\n\n:host([size=small]) {\n --component-size: var(--ig-size, var(--ig-size-small));\n}\n\n:host([size=medium]) {\n --component-size: var(--ig-size, var(--ig-size-medium));\n}\n\n:host([size=large]) {\n --component-size: var(--ig-size, var(--ig-size-large));\n}\n\nsvg {\n height: var(--size);\n width: var(--size);\n}\n\n:host([mirrored]) {\n -webkit-transform: scaleX(-1);\n -ms-transform: scaleX(-1);\n transform: scaleX(-1);\n}`;\n"]}
@@ -11,9 +11,14 @@ import { alternateName } from '../common/decorators/alternateName.js';
11
11
  import { blazorInclude } from '../common/decorators/blazorInclude.js';
12
12
  import { watch } from '../common/decorators/watch.js';
13
13
  import { SizableMixin } from '../common/mixins/sizable.js';
14
- import { styles } from './icon.material.css.js';
14
+ import { themes } from '../../theming/theming-decorator.js';
15
+ import { styles } from './icon.base.css.js';
16
+ import { styles as material } from './light/icon.material.css.js';
17
+ import { styles as bootstrap } from './light/icon.bootstrap.css.js';
18
+ import { styles as fluent } from './light/icon.fluent.css.js';
19
+ import { styles as indigo } from './light/icon.indigo.css.js';
15
20
  import { IconsRegistry, registerIcon as registerIcon_impl, registerIconFromText as registerIconFromText_impl, } from './icon.registry.js';
16
- export default class IgcIconComponent extends SizableMixin(LitElement) {
21
+ let IgcIconComponent = class IgcIconComponent extends SizableMixin(LitElement) {
17
22
  constructor() {
18
23
  super();
19
24
  this.svg = '';
@@ -58,7 +63,7 @@ export default class IgcIconComponent extends SizableMixin(LitElement) {
58
63
  registerIconFromText(name, iconText, collection = 'default') {
59
64
  registerIconFromText_impl(name, iconText, collection);
60
65
  }
61
- }
66
+ };
62
67
  IgcIconComponent.tagName = 'igc-icon';
63
68
  IgcIconComponent.styles = styles;
64
69
  __decorate([
@@ -84,4 +89,8 @@ __decorate([
84
89
  __decorate([
85
90
  blazorInclude()
86
91
  ], IgcIconComponent.prototype, "registerIconFromText", null);
92
+ IgcIconComponent = __decorate([
93
+ themes({ material, bootstrap, fluent, indigo })
94
+ ], IgcIconComponent);
95
+ export default IgcIconComponent;
87
96
  //# sourceMappingURL=icon.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { alternateName } from '../common/decorators/alternateName.js';\nimport { blazorInclude } from '../common/decorators/blazorInclude.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { SizableMixin } from '../common/mixins/sizable.js';\nimport { styles } from './icon.material.css.js';\nimport {\n IconsRegistry,\n registerIcon as registerIcon_impl,\n registerIconFromText as registerIconFromText_impl,\n} from './icon.registry.js';\n\n/**\n * Icon component\n *\n * @element igc-icon\n *\n *\n */\nexport default class IgcIconComponent extends SizableMixin(LitElement) {\n public static readonly tagName = 'igc-icon';\n\n public static override styles = styles;\n\n @state() private svg = '';\n\n /**\n * The name of the icon glyph to draw.\n * @attr\n */\n @property()\n @alternateName('iconName')\n public name = '';\n\n /**\n * The name of the registered collection for look up of icons.\n * Defaults to `default`.\n * @attr\n */\n @property()\n public collection = 'default';\n\n /**\n * Whether to flip the icon. Useful for RTL layouts.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public mirrored = false;\n\n constructor() {\n super();\n this.size = 'medium';\n }\n\n public override connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'img');\n }\n IconsRegistry.instance().subscribe(this.iconLoaded);\n }\n\n public override disconnectedCallback() {\n IconsRegistry.instance().unsubscribe(this.iconLoaded);\n super.disconnectedCallback();\n }\n\n @watch('name')\n @watch('collection')\n protected iconChanged(prev: string, curr: string) {\n if (prev !== curr) {\n this.getIcon();\n }\n }\n\n private iconLoaded = (name: string, collection: string) => {\n if (this.name === name && this.collection === collection) {\n this.getIcon();\n }\n };\n\n private getIcon() {\n const svg =\n this.name && this.collection\n ? IconsRegistry.instance().getIcon(this.name, this.collection)\n : '';\n this.svg = svg ?? '';\n }\n\n protected override render() {\n return html` ${unsafeSVG(this.svg)} `;\n }\n\n @blazorInclude()\n protected async registerIcon(\n name: string,\n url: string,\n collection = 'default'\n ) {\n await registerIcon_impl(name, url, collection);\n }\n\n @blazorInclude()\n protected registerIconFromText(\n name: string,\n iconText: string,\n collection = 'default'\n ) {\n registerIconFromText_impl(name, iconText, collection);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-icon': IgcIconComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { alternateName } from '../common/decorators/alternateName.js';\nimport { blazorInclude } from '../common/decorators/blazorInclude.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { SizableMixin } from '../common/mixins/sizable.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { styles } from './icon.base.css.js';\nimport { styles as material } from './light/icon.material.css.js';\nimport { styles as bootstrap } from './light/icon.bootstrap.css.js';\nimport { styles as fluent } from './light/icon.fluent.css.js';\nimport { styles as indigo } from './light/icon.indigo.css.js';\nimport {\n IconsRegistry,\n registerIcon as registerIcon_impl,\n registerIconFromText as registerIconFromText_impl,\n} from './icon.registry.js';\n\n@themes({ material, bootstrap, fluent, indigo })\n/**\n * Icon component\n *\n * @element igc-icon\n *\n *\n */\nexport default class IgcIconComponent extends SizableMixin(LitElement) {\n public static readonly tagName = 'igc-icon';\n\n public static override styles = styles;\n\n @state() private svg = '';\n\n /**\n * The name of the icon glyph to draw.\n * @attr\n */\n @property()\n @alternateName('iconName')\n public name = '';\n\n /**\n * The name of the registered collection for look up of icons.\n * Defaults to `default`.\n * @attr\n */\n @property()\n public collection = 'default';\n\n /**\n * Whether to flip the icon. Useful for RTL layouts.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public mirrored = false;\n\n constructor() {\n super();\n this.size = 'medium';\n }\n\n public override connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'img');\n }\n IconsRegistry.instance().subscribe(this.iconLoaded);\n }\n\n public override disconnectedCallback() {\n IconsRegistry.instance().unsubscribe(this.iconLoaded);\n super.disconnectedCallback();\n }\n\n @watch('name')\n @watch('collection')\n protected iconChanged(prev: string, curr: string) {\n if (prev !== curr) {\n this.getIcon();\n }\n }\n\n private iconLoaded = (name: string, collection: string) => {\n if (this.name === name && this.collection === collection) {\n this.getIcon();\n }\n };\n\n private getIcon() {\n const svg =\n this.name && this.collection\n ? IconsRegistry.instance().getIcon(this.name, this.collection)\n : '';\n this.svg = svg ?? '';\n }\n\n protected override render() {\n return html` ${unsafeSVG(this.svg)} `;\n }\n\n @blazorInclude()\n protected async registerIcon(\n name: string,\n url: string,\n collection = 'default'\n ) {\n await registerIcon_impl(name, url, collection);\n }\n\n @blazorInclude()\n protected registerIconFromText(\n name: string,\n iconText: string,\n collection = 'default'\n ) {\n registerIconFromText_impl(name, iconText, collection);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-icon': IgcIconComponent;\n }\n}\n"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,60 @@
1
+ import { css } from 'lit';
2
+ export const styles = css `:host {
3
+ --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
4
+ --is-medium: min(
5
+ clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
6
+ clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
7
+ );
8
+ --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
9
+ position: relative;
10
+ -webkit-box-sizing: border-box;
11
+ box-sizing: border-box;
12
+ scrollbar-width: var(--ig-scrollbar-size);
13
+ scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
14
+ }
15
+ :host *,
16
+ :host *::before,
17
+ :host *::after {
18
+ -webkit-box-sizing: border-box;
19
+ box-sizing: border-box;
20
+ }
21
+ :host ::-webkit-scrollbar {
22
+ width: var(--ig-scrollbar-size);
23
+ height: var(--ig-scrollbar-size);
24
+ background: var(--ig-scrollbar-track-background);
25
+ }
26
+ :host ::-webkit-scrollbar-thumb {
27
+ background: var(--ig-scrollbar-thumb-background);
28
+ }
29
+
30
+ [hidden] {
31
+ display: none !important;
32
+ }
33
+
34
+ /* 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 */
35
+ /* stylelint-disable max-line-length */
36
+ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
37
+ /* stylelint-disable max-line-length */
38
+ /* stylelint-disable max-line-length */
39
+ /* stylelint-disable max-line-length */
40
+ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
41
+ /* stylelint-disable max-line-length */
42
+ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
43
+ /* stylelint-disable max-line-length */
44
+ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */
45
+ /* stylelint-disable max-line-length */
46
+ /* 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 */
47
+ :host {
48
+ color: var(--color);
49
+ }
50
+ :host,
51
+ :host ig-icon {
52
+ --color: var(--ig-icon-color, 'currentColor');
53
+ --size: var(--ig-icon-size, 1.5rem);
54
+ --disabled-color: var(--ig-icon-disabled-color, 'currentColor');
55
+ }
56
+
57
+ svg {
58
+ fill: currentcolor;
59
+ }`;
60
+ //# sourceMappingURL=icon.bootstrap.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.bootstrap.css.js","sourceRoot":"","sources":["../../../../src/components/icon/light/icon.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\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 */ /* 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 color: var(--color);\n}\n:host,\n:host ig-icon {\n --color: var(--ig-icon-color, 'currentColor');\n --size: var(--ig-icon-size, 1.5rem);\n --disabled-color: var(--ig-icon-disabled-color, 'currentColor');\n}\n\nsvg {\n fill: currentcolor;\n}`;\n"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;