igniteui-webcomponents 6.0.0 → 6.1.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 (431) hide show
  1. package/CHANGELOG.md +48 -0
  2. package/README.md +6 -1
  3. package/components/avatar/themes/dark/avatar.bootstrap.css.js +1 -1
  4. package/components/avatar/themes/dark/avatar.bootstrap.css.js.map +1 -1
  5. package/components/avatar/themes/dark/avatar.fluent.css.js +1 -1
  6. package/components/avatar/themes/dark/avatar.fluent.css.js.map +1 -1
  7. package/components/avatar/themes/dark/avatar.material.css.js +1 -1
  8. package/components/avatar/themes/dark/avatar.material.css.js.map +1 -1
  9. package/components/button/button-base.d.ts +5 -6
  10. package/components/button/button-base.js +15 -29
  11. package/components/button/button-base.js.map +1 -1
  12. package/components/button/themes/button/light/button.shared.css.js +1 -1
  13. package/components/button/themes/button/light/button.shared.css.js.map +1 -1
  14. package/components/button-group/toggle-button.d.ts +2 -2
  15. package/components/button-group/toggle-button.js +4 -6
  16. package/components/button-group/toggle-button.js.map +1 -1
  17. package/components/calendar/calendar.d.ts +1 -1
  18. package/components/calendar/calendar.js +12 -9
  19. package/components/calendar/calendar.js.map +1 -1
  20. package/components/calendar/days-view/days-view.d.ts +1 -1
  21. package/components/calendar/days-view/days-view.js +8 -9
  22. package/components/calendar/days-view/days-view.js.map +1 -1
  23. package/components/calendar/helpers.d.ts +12 -1
  24. package/components/calendar/helpers.js +35 -10
  25. package/components/calendar/helpers.js.map +1 -1
  26. package/components/calendar/model.d.ts +15 -1
  27. package/components/calendar/model.js +26 -5
  28. package/components/calendar/model.js.map +1 -1
  29. package/components/calendar/months-view/months-view.d.ts +1 -1
  30. package/components/calendar/months-view/months-view.js +6 -6
  31. package/components/calendar/months-view/months-view.js.map +1 -1
  32. package/components/calendar/themes/dark/calendar.fluent.css.js +1 -1
  33. package/components/calendar/themes/dark/calendar.fluent.css.js.map +1 -1
  34. package/components/calendar/themes/light/calendar.fluent.css.js +1 -1
  35. package/components/calendar/themes/light/calendar.fluent.css.js.map +1 -1
  36. package/components/calendar/themes/light/calendar.shared.css.js +1 -1
  37. package/components/calendar/themes/light/calendar.shared.css.js.map +1 -1
  38. package/components/calendar/years-view/years-view.d.ts +1 -1
  39. package/components/calendar/years-view/years-view.js +6 -6
  40. package/components/calendar/years-view/years-view.js.map +1 -1
  41. package/components/carousel/carousel-indicator-container.d.ts +2 -2
  42. package/components/carousel/carousel-indicator-container.js +8 -9
  43. package/components/carousel/carousel-indicator-container.js.map +1 -1
  44. package/components/carousel/carousel.d.ts +7 -8
  45. package/components/carousel/carousel.js +24 -20
  46. package/components/carousel/carousel.js.map +1 -1
  47. package/components/checkbox/checkbox-base.d.ts +8 -10
  48. package/components/checkbox/checkbox-base.js +20 -23
  49. package/components/checkbox/checkbox-base.js.map +1 -1
  50. package/components/checkbox/checkbox.d.ts +3 -3
  51. package/components/checkbox/checkbox.js +18 -19
  52. package/components/checkbox/checkbox.js.map +1 -1
  53. package/components/checkbox/switch.d.ts +2 -2
  54. package/components/checkbox/switch.js +15 -19
  55. package/components/checkbox/switch.js.map +1 -1
  56. package/components/chip/chip.d.ts +4 -0
  57. package/components/chip/chip.js +29 -6
  58. package/components/chip/chip.js.map +1 -1
  59. package/components/chip/themes/shared/chip.common.css.js +1 -1
  60. package/components/chip/themes/shared/chip.common.css.js.map +1 -1
  61. package/components/chip/themes/shared/chip.indigo.css.js +1 -1
  62. package/components/chip/themes/shared/chip.indigo.css.js.map +1 -1
  63. package/components/combo/combo.d.ts +2 -2
  64. package/components/combo/combo.js +12 -11
  65. package/components/combo/combo.js.map +1 -1
  66. package/components/combo/themes/combo.base.css.js +1 -1
  67. package/components/combo/themes/combo.base.css.js.map +1 -1
  68. package/components/combo/themes/shared/combo.fluent.css.js +1 -1
  69. package/components/combo/themes/shared/combo.fluent.css.js.map +1 -1
  70. package/components/common/controllers/focus-ring.d.ts +21 -11
  71. package/components/common/controllers/focus-ring.js +16 -14
  72. package/components/common/controllers/focus-ring.js.map +1 -1
  73. package/components/common/controllers/gestures.d.ts +1 -0
  74. package/components/common/controllers/gestures.js.map +1 -1
  75. package/components/common/controllers/key-bindings.d.ts +40 -33
  76. package/components/common/controllers/key-bindings.js +83 -71
  77. package/components/common/controllers/key-bindings.js.map +1 -1
  78. package/components/common/controllers/resize-observer.d.ts +11 -8
  79. package/components/common/controllers/resize-observer.js +3 -3
  80. package/components/common/controllers/resize-observer.js.map +1 -1
  81. package/components/common/definitions/defineAllComponents.js +2 -0
  82. package/components/common/definitions/defineAllComponents.js.map +1 -1
  83. package/components/common/i18n/date-range-picker.resources.d.ts +11 -0
  84. package/components/common/i18n/date-range-picker.resources.js +12 -0
  85. package/components/common/i18n/date-range-picker.resources.js.map +1 -0
  86. package/components/common/mixins/combo-box.js +8 -2
  87. package/components/common/mixins/combo-box.js.map +1 -1
  88. package/components/common/mixins/forms/form-value.d.ts +15 -1
  89. package/components/common/mixins/forms/form-value.js +25 -4
  90. package/components/common/mixins/forms/form-value.js.map +1 -1
  91. package/components/common/mixins/option.d.ts +3 -2
  92. package/components/common/mixins/option.js.map +1 -1
  93. package/components/common/part-map.d.ts +17 -0
  94. package/components/common/part-map.js +46 -0
  95. package/components/common/part-map.js.map +1 -0
  96. package/components/common/util.d.ts +5 -6
  97. package/components/common/util.js +17 -22
  98. package/components/common/util.js.map +1 -1
  99. package/components/common/validators.js +3 -7
  100. package/components/common/validators.js.map +1 -1
  101. package/components/date-picker/date-picker.d.ts +37 -37
  102. package/components/date-picker/date-picker.js +142 -140
  103. package/components/date-picker/date-picker.js.map +1 -1
  104. package/components/date-picker/themes/dark/date-picker.bootstrap.css.js +1 -1
  105. package/components/date-picker/themes/dark/date-picker.bootstrap.css.js.map +1 -1
  106. package/components/date-picker/themes/dark/date-picker.fluent.css.js +1 -1
  107. package/components/date-picker/themes/dark/date-picker.fluent.css.js.map +1 -1
  108. package/components/date-picker/themes/dark/date-picker.indigo.css.js +1 -1
  109. package/components/date-picker/themes/dark/date-picker.indigo.css.js.map +1 -1
  110. package/components/date-picker/themes/dark/date-picker.material.css.js +1 -1
  111. package/components/date-picker/themes/dark/date-picker.material.css.js.map +1 -1
  112. package/components/date-picker/themes/light/date-picker.bootstrap.css.js +1 -1
  113. package/components/date-picker/themes/light/date-picker.bootstrap.css.js.map +1 -1
  114. package/components/date-picker/themes/light/date-picker.fluent.css.js +1 -1
  115. package/components/date-picker/themes/light/date-picker.fluent.css.js.map +1 -1
  116. package/components/date-picker/themes/light/date-picker.indigo.css.js +1 -1
  117. package/components/date-picker/themes/light/date-picker.indigo.css.js.map +1 -1
  118. package/components/date-picker/themes/light/date-picker.material.css.js +1 -1
  119. package/components/date-picker/themes/light/date-picker.material.css.js.map +1 -1
  120. package/components/date-picker/themes/light/date-picker.shared.css.js +1 -1
  121. package/components/date-picker/themes/light/date-picker.shared.css.js.map +1 -1
  122. package/components/date-picker/themes/shared/date-picker.bootstrap.css.js +1 -1
  123. package/components/date-picker/themes/shared/date-picker.bootstrap.css.js.map +1 -1
  124. package/components/date-picker/themes/shared/date-picker.common.css.js +1 -1
  125. package/components/date-picker/themes/shared/date-picker.common.css.js.map +1 -1
  126. package/components/date-picker/themes/shared/date-picker.fluent.css.js +1 -1
  127. package/components/date-picker/themes/shared/date-picker.fluent.css.js.map +1 -1
  128. package/components/date-picker/themes/shared/date-picker.indigo.css.js +1 -1
  129. package/components/date-picker/themes/shared/date-picker.indigo.css.js.map +1 -1
  130. package/components/date-picker/themes/shared/date-picker.material.css.js +3 -0
  131. package/components/date-picker/themes/shared/date-picker.material.css.js.map +1 -0
  132. package/components/date-picker/themes/themes.js +3 -2
  133. package/components/date-picker/themes/themes.js.map +1 -1
  134. package/components/date-range-picker/date-range-picker.base.css.js +3 -0
  135. package/components/date-range-picker/date-range-picker.base.css.js.map +1 -0
  136. package/components/date-range-picker/date-range-picker.d.ts +365 -0
  137. package/components/date-range-picker/date-range-picker.js +810 -0
  138. package/components/date-range-picker/date-range-picker.js.map +1 -0
  139. package/components/{radio-group/radio-group.base.css.js → date-range-picker/predefined-ranges-area.base.css.js} +2 -2
  140. package/components/date-range-picker/predefined-ranges-area.base.css.js.map +1 -0
  141. package/components/date-range-picker/predefined-ranges-area.d.ts +36 -0
  142. package/components/date-range-picker/predefined-ranges-area.js +115 -0
  143. package/components/date-range-picker/predefined-ranges-area.js.map +1 -0
  144. package/components/date-range-picker/themes/dark/date-range-picker.bootstrap.css.js +3 -0
  145. package/components/date-range-picker/themes/dark/date-range-picker.bootstrap.css.js.map +1 -0
  146. package/components/date-range-picker/themes/dark/date-range-picker.fluent.css.d.ts +1 -0
  147. package/components/date-range-picker/themes/dark/date-range-picker.fluent.css.js +3 -0
  148. package/components/date-range-picker/themes/dark/date-range-picker.fluent.css.js.map +1 -0
  149. package/components/date-range-picker/themes/dark/date-range-picker.indigo.css.d.ts +1 -0
  150. package/components/date-range-picker/themes/dark/date-range-picker.indigo.css.js +3 -0
  151. package/components/date-range-picker/themes/dark/date-range-picker.indigo.css.js.map +1 -0
  152. package/components/date-range-picker/themes/dark/date-range-picker.material.css.d.ts +1 -0
  153. package/components/date-range-picker/themes/dark/date-range-picker.material.css.js +3 -0
  154. package/components/date-range-picker/themes/dark/date-range-picker.material.css.js.map +1 -0
  155. package/components/date-range-picker/themes/light/date-range-picker.bootstrap.css.d.ts +1 -0
  156. package/components/date-range-picker/themes/light/date-range-picker.bootstrap.css.js +3 -0
  157. package/components/date-range-picker/themes/light/date-range-picker.bootstrap.css.js.map +1 -0
  158. package/components/date-range-picker/themes/light/date-range-picker.fluent.css.d.ts +1 -0
  159. package/components/date-range-picker/themes/light/date-range-picker.fluent.css.js +3 -0
  160. package/components/date-range-picker/themes/light/date-range-picker.fluent.css.js.map +1 -0
  161. package/components/date-range-picker/themes/light/date-range-picker.indigo.css.d.ts +1 -0
  162. package/components/date-range-picker/themes/light/date-range-picker.indigo.css.js +3 -0
  163. package/components/date-range-picker/themes/light/date-range-picker.indigo.css.js.map +1 -0
  164. package/components/date-range-picker/themes/light/date-range-picker.material.css.d.ts +1 -0
  165. package/components/date-range-picker/themes/light/date-range-picker.material.css.js +3 -0
  166. package/components/date-range-picker/themes/light/date-range-picker.material.css.js.map +1 -0
  167. package/components/date-range-picker/themes/light/date-range-picker.shared.css.d.ts +1 -0
  168. package/components/date-range-picker/themes/light/date-range-picker.shared.css.js +3 -0
  169. package/components/date-range-picker/themes/light/date-range-picker.shared.css.js.map +1 -0
  170. package/components/date-range-picker/themes/ranges-themes.d.ts +2 -0
  171. package/components/date-range-picker/themes/ranges-themes.js +14 -0
  172. package/components/date-range-picker/themes/ranges-themes.js.map +1 -0
  173. package/components/date-range-picker/themes/shared/date-range-picker.bootstrap.css.d.ts +1 -0
  174. package/components/date-range-picker/themes/shared/date-range-picker.bootstrap.css.js +3 -0
  175. package/components/date-range-picker/themes/shared/date-range-picker.bootstrap.css.js.map +1 -0
  176. package/components/date-range-picker/themes/shared/date-range-picker.common.css.d.ts +1 -0
  177. package/components/date-range-picker/themes/shared/date-range-picker.common.css.js +3 -0
  178. package/components/date-range-picker/themes/shared/date-range-picker.common.css.js.map +1 -0
  179. package/components/date-range-picker/themes/shared/date-range-picker.fluent.css.d.ts +1 -0
  180. package/components/date-range-picker/themes/shared/date-range-picker.fluent.css.js +3 -0
  181. package/components/date-range-picker/themes/shared/date-range-picker.fluent.css.js.map +1 -0
  182. package/components/date-range-picker/themes/shared/date-range-picker.indigo.css.d.ts +1 -0
  183. package/components/date-range-picker/themes/shared/date-range-picker.indigo.css.js +3 -0
  184. package/components/date-range-picker/themes/shared/date-range-picker.indigo.css.js.map +1 -0
  185. package/components/date-range-picker/themes/shared/date-range-picker.material.css.d.ts +1 -0
  186. package/components/date-range-picker/themes/shared/date-range-picker.material.css.js +3 -0
  187. package/components/date-range-picker/themes/shared/date-range-picker.material.css.js.map +1 -0
  188. package/components/date-range-picker/themes/shared/predefined-ranges-area.common.css.d.ts +1 -0
  189. package/components/date-range-picker/themes/shared/predefined-ranges-area.common.css.js +3 -0
  190. package/components/date-range-picker/themes/shared/predefined-ranges-area.common.css.js.map +1 -0
  191. package/components/date-range-picker/themes/shared/predefined-ranges-area.indigo.css.d.ts +1 -0
  192. package/components/date-range-picker/themes/shared/predefined-ranges-area.indigo.css.js +3 -0
  193. package/components/date-range-picker/themes/shared/predefined-ranges-area.indigo.css.js.map +1 -0
  194. package/components/date-range-picker/themes/themes.d.ts +2 -0
  195. package/components/date-range-picker/themes/themes.js +50 -0
  196. package/components/date-range-picker/themes/themes.js.map +1 -0
  197. package/components/date-range-picker/validators.d.ts +26 -0
  198. package/components/date-range-picker/validators.js +57 -0
  199. package/components/date-range-picker/validators.js.map +1 -0
  200. package/components/date-time-input/date-time-input.d.ts +2 -2
  201. package/components/date-time-input/date-time-input.js +8 -10
  202. package/components/date-time-input/date-time-input.js.map +1 -1
  203. package/components/date-time-input/date-util.d.ts +7 -0
  204. package/components/date-time-input/date-util.js +11 -0
  205. package/components/date-time-input/date-util.js.map +1 -1
  206. package/components/dialog/dialog.js +11 -10
  207. package/components/dialog/dialog.js.map +1 -1
  208. package/components/dialog/themes/dialog.base.css.js +1 -1
  209. package/components/dialog/themes/dialog.base.css.js.map +1 -1
  210. package/components/dialog/themes/shared/dialog.indigo.css.js +1 -1
  211. package/components/dialog/themes/shared/dialog.indigo.css.js.map +1 -1
  212. package/components/dropdown/dropdown.js.map +1 -1
  213. package/components/file-input/file-input.d.ts +12 -6
  214. package/components/file-input/file-input.js +23 -19
  215. package/components/file-input/file-input.js.map +1 -1
  216. package/components/file-input/themes/file-input.base.css.js +1 -1
  217. package/components/file-input/themes/file-input.base.css.js.map +1 -1
  218. package/components/input/input-base.d.ts +0 -1
  219. package/components/input/input-base.js +5 -4
  220. package/components/input/input-base.js.map +1 -1
  221. package/components/input/input.d.ts +2 -3
  222. package/components/input/input.js +10 -9
  223. package/components/input/input.js.map +1 -1
  224. package/components/input/themes/dark/input.bootstrap.css.js +1 -1
  225. package/components/input/themes/dark/input.bootstrap.css.js.map +1 -1
  226. package/components/input/themes/dark/input.indigo.css.js +1 -1
  227. package/components/input/themes/dark/input.indigo.css.js.map +1 -1
  228. package/components/input/themes/input.base.css.js +1 -1
  229. package/components/input/themes/input.base.css.js.map +1 -1
  230. package/components/input/themes/light/input.bootstrap.css.js +1 -1
  231. package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
  232. package/components/input/themes/light/input.indigo.css.js +1 -1
  233. package/components/input/themes/light/input.indigo.css.js.map +1 -1
  234. package/components/input/themes/light/input.shared.css.js +1 -1
  235. package/components/input/themes/light/input.shared.css.js.map +1 -1
  236. package/components/input/themes/shared/input.bootstrap.css.js +1 -1
  237. package/components/input/themes/shared/input.bootstrap.css.js.map +1 -1
  238. package/components/input/themes/shared/input.common.css.js +1 -1
  239. package/components/input/themes/shared/input.common.css.js.map +1 -1
  240. package/components/input/themes/shared/input.fluent.css.js +1 -1
  241. package/components/input/themes/shared/input.fluent.css.js.map +1 -1
  242. package/components/input/themes/shared/input.indigo.css.js +1 -1
  243. package/components/input/themes/shared/input.indigo.css.js.map +1 -1
  244. package/components/input/themes/shared/input.material.css.js +1 -1
  245. package/components/input/themes/shared/input.material.css.js.map +1 -1
  246. package/components/mask-input/mask-input.d.ts +2 -3
  247. package/components/mask-input/mask-input.js +13 -12
  248. package/components/mask-input/mask-input.js.map +1 -1
  249. package/components/mask-input/mask-parser.d.ts +100 -14
  250. package/components/mask-input/mask-parser.js +134 -117
  251. package/components/mask-input/mask-parser.js.map +1 -1
  252. package/components/nav-drawer/nav-drawer-item.js +2 -6
  253. package/components/nav-drawer/nav-drawer-item.js.map +1 -1
  254. package/components/nav-drawer/nav-drawer.js +5 -6
  255. package/components/nav-drawer/nav-drawer.js.map +1 -1
  256. package/components/progress/base.js +6 -5
  257. package/components/progress/base.js.map +1 -1
  258. package/components/progress/circular-progress.js +7 -15
  259. package/components/progress/circular-progress.js.map +1 -1
  260. package/components/progress/linear-progress.js +5 -5
  261. package/components/progress/linear-progress.js.map +1 -1
  262. package/components/progress/themes/circular/dark/circular.progress.shared.css.js +1 -1
  263. package/components/progress/themes/circular/dark/circular.progress.shared.css.js.map +1 -1
  264. package/components/progress/themes/linear/dark/linear.progress.bootstrap.css.js +1 -1
  265. package/components/progress/themes/linear/dark/linear.progress.bootstrap.css.js.map +1 -1
  266. package/components/progress/themes/linear/dark/linear.progress.shared.css.js +1 -1
  267. package/components/progress/themes/linear/dark/linear.progress.shared.css.js.map +1 -1
  268. package/components/radio/radio.d.ts +11 -12
  269. package/components/radio/radio.js +39 -44
  270. package/components/radio/radio.js.map +1 -1
  271. package/components/radio/utils.js +6 -3
  272. package/components/radio/utils.js.map +1 -1
  273. package/components/radio-group/radio-group.d.ts +2 -1
  274. package/components/radio-group/radio-group.js +23 -10
  275. package/components/radio-group/radio-group.js.map +1 -1
  276. package/components/radio-group/themes/dark/radio-group.bootstrap.css.d.ts +1 -0
  277. package/components/radio-group/themes/dark/radio-group.bootstrap.css.js +3 -0
  278. package/components/radio-group/themes/dark/radio-group.bootstrap.css.js.map +1 -0
  279. package/components/radio-group/themes/dark/radio-group.fluent.css.d.ts +1 -0
  280. package/components/radio-group/themes/dark/radio-group.fluent.css.js +3 -0
  281. package/components/radio-group/themes/dark/radio-group.fluent.css.js.map +1 -0
  282. package/components/radio-group/themes/dark/radio-group.indigo.css.d.ts +1 -0
  283. package/components/radio-group/themes/dark/radio-group.indigo.css.js +3 -0
  284. package/components/radio-group/themes/dark/radio-group.indigo.css.js.map +1 -0
  285. package/components/radio-group/themes/dark/radio-group.material.css.d.ts +1 -0
  286. package/components/radio-group/themes/dark/radio-group.material.css.js +3 -0
  287. package/components/radio-group/themes/dark/radio-group.material.css.js.map +1 -0
  288. package/components/radio-group/themes/light/radio-group.bootstrap.css.d.ts +1 -0
  289. package/components/radio-group/themes/light/radio-group.bootstrap.css.js +3 -0
  290. package/components/radio-group/themes/light/radio-group.bootstrap.css.js.map +1 -0
  291. package/components/radio-group/themes/light/radio-group.fluent.css.d.ts +1 -0
  292. package/components/radio-group/themes/light/radio-group.fluent.css.js +3 -0
  293. package/components/radio-group/themes/light/radio-group.fluent.css.js.map +1 -0
  294. package/components/radio-group/themes/light/radio-group.indigo.css.d.ts +1 -0
  295. package/components/radio-group/themes/light/radio-group.indigo.css.js +3 -0
  296. package/components/radio-group/themes/light/radio-group.indigo.css.js.map +1 -0
  297. package/components/radio-group/themes/light/radio-group.material.css.d.ts +1 -0
  298. package/components/radio-group/themes/light/radio-group.material.css.js +3 -0
  299. package/components/radio-group/themes/light/radio-group.material.css.js.map +1 -0
  300. package/components/radio-group/themes/light/radio-group.shared.css.d.ts +1 -0
  301. package/components/radio-group/themes/light/radio-group.shared.css.js +3 -0
  302. package/components/radio-group/themes/light/radio-group.shared.css.js.map +1 -0
  303. package/components/radio-group/themes/radio-group.base.css.d.ts +1 -0
  304. package/components/radio-group/themes/radio-group.base.css.js +3 -0
  305. package/components/radio-group/themes/radio-group.base.css.js.map +1 -0
  306. package/components/radio-group/themes/shared/radio-group.bootstrap.css.d.ts +1 -0
  307. package/components/radio-group/themes/shared/radio-group.bootstrap.css.js +3 -0
  308. package/components/radio-group/themes/shared/radio-group.bootstrap.css.js.map +1 -0
  309. package/components/radio-group/themes/shared/radio-group.common.css.d.ts +1 -0
  310. package/components/radio-group/themes/shared/radio-group.common.css.js +3 -0
  311. package/components/radio-group/themes/shared/radio-group.common.css.js.map +1 -0
  312. package/components/radio-group/themes/shared/radio-group.fluent.css.d.ts +1 -0
  313. package/components/radio-group/themes/shared/radio-group.fluent.css.js +3 -0
  314. package/components/radio-group/themes/shared/radio-group.fluent.css.js.map +1 -0
  315. package/components/radio-group/themes/shared/radio-group.indigo.css.d.ts +1 -0
  316. package/components/radio-group/themes/shared/radio-group.indigo.css.js +3 -0
  317. package/components/radio-group/themes/shared/radio-group.indigo.css.js.map +1 -0
  318. package/components/radio-group/themes/shared/radio-group.material.css.d.ts +1 -0
  319. package/components/radio-group/themes/shared/radio-group.material.css.js +3 -0
  320. package/components/radio-group/themes/shared/radio-group.material.css.js.map +1 -0
  321. package/components/radio-group/themes/themes.d.ts +2 -0
  322. package/components/radio-group/themes/themes.js +50 -0
  323. package/components/radio-group/themes/themes.js.map +1 -0
  324. package/components/rating/rating.d.ts +2 -2
  325. package/components/rating/rating.js +4 -4
  326. package/components/rating/rating.js.map +1 -1
  327. package/components/resize-container/resize-container.js +4 -4
  328. package/components/resize-container/resize-container.js.map +1 -1
  329. package/components/select/select.d.ts +2 -2
  330. package/components/select/select.js +11 -10
  331. package/components/select/select.js.map +1 -1
  332. package/components/select/themes/shared/select.fluent.css.js +1 -1
  333. package/components/select/themes/shared/select.fluent.css.js.map +1 -1
  334. package/components/slider/range-slider.js +1 -1
  335. package/components/slider/range-slider.js.map +1 -1
  336. package/components/slider/slider-base.js +1 -1
  337. package/components/slider/slider-base.js.map +1 -1
  338. package/components/slider/slider.d.ts +2 -3
  339. package/components/slider/slider.js +7 -7
  340. package/components/slider/slider.js.map +1 -1
  341. package/components/stepper/step.js +3 -3
  342. package/components/stepper/step.js.map +1 -1
  343. package/components/stepper/themes/step/dark/step.indigo.css.js +1 -1
  344. package/components/stepper/themes/step/dark/step.indigo.css.js.map +1 -1
  345. package/components/stepper/themes/step/light/step.bootstrap.css.js +1 -1
  346. package/components/stepper/themes/step/light/step.bootstrap.css.js.map +1 -1
  347. package/components/stepper/themes/step/light/step.fluent.css.js +1 -1
  348. package/components/stepper/themes/step/light/step.fluent.css.js.map +1 -1
  349. package/components/stepper/themes/step/light/step.indigo.css.js +1 -1
  350. package/components/stepper/themes/step/light/step.indigo.css.js.map +1 -1
  351. package/components/stepper/themes/step/light/step.material.css.js +1 -1
  352. package/components/stepper/themes/step/light/step.material.css.js.map +1 -1
  353. package/components/stepper/themes/step/light/step.shared.css.js +1 -1
  354. package/components/stepper/themes/step/light/step.shared.css.js.map +1 -1
  355. package/components/tabs/tab-dom.d.ts +2 -2
  356. package/components/tabs/tab-dom.js +15 -2
  357. package/components/tabs/tab-dom.js.map +1 -1
  358. package/components/tabs/tabs.d.ts +2 -1
  359. package/components/tabs/tabs.js +10 -8
  360. package/components/tabs/tabs.js.map +1 -1
  361. package/components/tabs/themes/dark/tab.indigo.css.js +1 -1
  362. package/components/tabs/themes/dark/tab.indigo.css.js.map +1 -1
  363. package/components/tabs/themes/light/tab.indigo.css.js +1 -1
  364. package/components/tabs/themes/light/tab.indigo.css.js.map +1 -1
  365. package/components/tabs/themes/tab.base.css.js +1 -1
  366. package/components/tabs/themes/tab.base.css.js.map +1 -1
  367. package/components/textarea/textarea.d.ts +30 -33
  368. package/components/textarea/textarea.js +95 -96
  369. package/components/textarea/textarea.js.map +1 -1
  370. package/components/textarea/themes/dark/textarea.bootstrap.css.js +1 -1
  371. package/components/textarea/themes/dark/textarea.bootstrap.css.js.map +1 -1
  372. package/components/textarea/themes/dark/textarea.indigo.css.js +1 -1
  373. package/components/textarea/themes/dark/textarea.indigo.css.js.map +1 -1
  374. package/components/textarea/themes/light/textarea.bootstrap.css.js +1 -1
  375. package/components/textarea/themes/light/textarea.bootstrap.css.js.map +1 -1
  376. package/components/textarea/themes/light/textarea.indigo.css.js +1 -1
  377. package/components/textarea/themes/light/textarea.indigo.css.js.map +1 -1
  378. package/components/textarea/themes/light/textarea.shared.css.js +1 -1
  379. package/components/textarea/themes/light/textarea.shared.css.js.map +1 -1
  380. package/components/textarea/themes/shared/textarea.bootstrap.css.js +1 -1
  381. package/components/textarea/themes/shared/textarea.bootstrap.css.js.map +1 -1
  382. package/components/textarea/themes/shared/textarea.fluent.css.js +1 -1
  383. package/components/textarea/themes/shared/textarea.fluent.css.js.map +1 -1
  384. package/components/textarea/themes/shared/textarea.indigo.css.js +1 -1
  385. package/components/textarea/themes/shared/textarea.indigo.css.js.map +1 -1
  386. package/components/textarea/themes/shared/textarea.material.css.js +1 -1
  387. package/components/textarea/themes/shared/textarea.material.css.js.map +1 -1
  388. package/components/textarea/themes/textarea.base.css.js +1 -1
  389. package/components/textarea/themes/textarea.base.css.js.map +1 -1
  390. package/components/tile-manager/tile-manager.js +5 -4
  391. package/components/tile-manager/tile-manager.js.map +1 -1
  392. package/components/tile-manager/tile.js +6 -5
  393. package/components/tile-manager/tile.js.map +1 -1
  394. package/components/tooltip/tooltip.d.ts +24 -9
  395. package/components/tooltip/tooltip.js +22 -19
  396. package/components/tooltip/tooltip.js.map +1 -1
  397. package/components/tree/tree-item.js +5 -3
  398. package/components/tree/tree-item.js.map +1 -1
  399. package/components/types.d.ts +1 -1
  400. package/components/types.js.map +1 -1
  401. package/components/validation-container/themes/dark/validator.indigo.css.js +1 -1
  402. package/components/validation-container/themes/dark/validator.indigo.css.js.map +1 -1
  403. package/components/validation-container/validation-container.js +4 -11
  404. package/components/validation-container/validation-container.js.map +1 -1
  405. package/custom-elements.json +21925 -18034
  406. package/igniteui-webcomponents.css-data.json +1 -1
  407. package/igniteui-webcomponents.html-data.json +1 -1
  408. package/index.d.ts +4 -1
  409. package/index.js +1 -0
  410. package/index.js.map +1 -1
  411. package/package.json +3 -2
  412. package/themes/dark/bootstrap.css +1 -1
  413. package/themes/dark/fluent.css +1 -1
  414. package/themes/dark/indigo.css +1 -1
  415. package/themes/dark/material.css +1 -1
  416. package/themes/light/bootstrap.css +1 -1
  417. package/themes/light/fluent.css +1 -1
  418. package/themes/light/indigo.css +1 -1
  419. package/themes/light/material.css +1 -1
  420. package/web-types.json +2 -2
  421. package/components/radio-group/radio-group.base.css.js.map +0 -1
  422. package/components/radio-group/radio-group.fluent.css.js +0 -3
  423. package/components/radio-group/radio-group.fluent.css.js.map +0 -1
  424. package/components/radio-group/radio-group.indigo.css.js +0 -3
  425. package/components/radio-group/radio-group.indigo.css.js.map +0 -1
  426. package/components/radio-group/radio-group.material.css.js +0 -3
  427. package/components/radio-group/radio-group.material.css.js.map +0 -1
  428. /package/components/{radio-group/radio-group.base.css.d.ts → date-picker/themes/shared/date-picker.material.css.d.ts} +0 -0
  429. /package/components/{radio-group/radio-group.fluent.css.d.ts → date-range-picker/date-range-picker.base.css.d.ts} +0 -0
  430. /package/components/{radio-group/radio-group.indigo.css.d.ts → date-range-picker/predefined-ranges-area.base.css.d.ts} +0 -0
  431. /package/components/{radio-group/radio-group.material.css.d.ts → date-range-picker/themes/dark/date-range-picker.bootstrap.css.d.ts} +0 -0
@@ -1,5 +1,5 @@
1
1
  import type { Constructor } from '../common/mixins/constructor.js';
2
- import { type FormValue } from '../common/mixins/forms/form-value.js';
2
+ import { type FormValueOf } from '../common/mixins/forms/form-value.js';
3
3
  import { IgcSliderBaseComponent } from './slider-base.js';
4
4
  export interface IgcSliderComponentEventMap {
5
5
  /**
@@ -38,7 +38,7 @@ declare const IgcSliderComponent_base: Constructor<import("../common/mixins/form
38
38
  export default class IgcSliderComponent extends IgcSliderComponent_base {
39
39
  static readonly tagName = "igc-slider";
40
40
  static register(): void;
41
- protected _formValue: FormValue<number>;
41
+ protected readonly _formValue: FormValueOf<number>;
42
42
  /**
43
43
  * The current value of the component.
44
44
  * @attr
@@ -46,7 +46,6 @@ export default class IgcSliderComponent extends IgcSliderComponent_base {
46
46
  set value(value: number);
47
47
  get value(): number;
48
48
  protected get activeValue(): number;
49
- constructor();
50
49
  protected normalizeValue(): void;
51
50
  protected getTrackStyle(): {
52
51
  width: string;
@@ -13,6 +13,13 @@ import { asNumber, asPercent, clamp } from '../common/util.js';
13
13
  import { IgcSliderBaseComponent } from './slider-base.js';
14
14
  import IgcSliderLabelComponent from './slider-label.js';
15
15
  class IgcSliderComponent extends FormAssociatedMixin(EventEmitterMixin(IgcSliderBaseComponent)) {
16
+ constructor() {
17
+ super(...arguments);
18
+ this._formValue = createFormValueState(this, {
19
+ initialValue: 0,
20
+ transformers: defaultNumberTransformers,
21
+ });
22
+ }
16
23
  static register() {
17
24
  registerComponent(IgcSliderComponent, IgcSliderLabelComponent);
18
25
  }
@@ -25,13 +32,6 @@ class IgcSliderComponent extends FormAssociatedMixin(EventEmitterMixin(IgcSlider
25
32
  get activeValue() {
26
33
  return this.value;
27
34
  }
28
- constructor() {
29
- super();
30
- this._formValue = createFormValueState(this, {
31
- initialValue: 0,
32
- transformers: defaultNumberTransformers,
33
- });
34
- }
35
35
  normalizeValue() {
36
36
  this.value = this.validateValue(this.value);
37
37
  }
@@ -1 +1 @@
1
- {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { property } from 'lit/decorators.js';\n\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedMixin } from '../common/mixins/forms/associated.js';\nimport {\n type FormValue,\n createFormValueState,\n defaultNumberTransformers,\n} from '../common/mixins/forms/form-value.js';\nimport { asNumber, asPercent, clamp } from '../common/util.js';\nimport { IgcSliderBaseComponent } from './slider-base.js';\nimport IgcSliderLabelComponent from './slider-label.js';\n\nexport interface IgcSliderComponentEventMap {\n /**\n * Emitted when a value is changed via thumb drag or keyboard interaction.\n */\n igcInput: CustomEvent<number>;\n /**\n * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n */\n igcChange: CustomEvent<number>;\n}\n\n/**\n * A slider component used to select numeric value within a range.\n *\n * @element igc-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcSliderComponent extends FormAssociatedMixin(\n EventEmitterMixin<\n IgcSliderComponentEventMap,\n Constructor<IgcSliderBaseComponent>\n >(IgcSliderBaseComponent)\n) {\n public static readonly tagName = 'igc-slider';\n\n /* blazorSuppress */\n public static register() {\n registerComponent(IgcSliderComponent, IgcSliderLabelComponent);\n }\n\n protected override _formValue: FormValue<number>;\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n /**\n * The current value of the component.\n * @attr\n */\n @property({ type: Number })\n public set value(value: number) {\n this._formValue.setValueAndFormState(\n this.validateValue(asNumber(value, this._formValue.value))\n );\n }\n\n public get value(): number {\n return this._formValue.value;\n }\n\n protected override get activeValue(): number {\n return this.value;\n }\n\n constructor() {\n super();\n\n this._formValue = createFormValueState(this, {\n initialValue: 0,\n transformers: defaultNumberTransformers,\n });\n }\n\n protected override normalizeValue(): void {\n this.value = this.validateValue(this.value);\n }\n\n protected override getTrackStyle() {\n return {\n width: `${asPercent(this.value - this.min, this.distance)}%`,\n };\n }\n\n protected override updateValue(increment: number) {\n const value = clamp(\n this.value + increment,\n this.lowerBound,\n this.upperBound\n );\n\n if (this.value === value) {\n return false;\n }\n\n this.value = value;\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', { detail: this.value });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', { detail: this.value });\n }\n\n /**\n * Increments the value of the slider by `stepIncrement * step`, where `stepIncrement` defaults to 1.\n * @param stepIncrement Optional step increment. If no parameter is passed, it defaults to 1.\n */\n public stepUp(stepIncrement = 1) {\n this.value = this.value + stepIncrement * this.step;\n }\n\n /**\n * Decrements the value of the slider by `stepDecrement * step`, where `stepDecrement` defaults to 1.\n * @param stepDecrement Optional step decrement. If no parameter is passed, it defaults to 1.\n */\n public stepDown(stepDecrement = 1) {\n this.value = this.value - stepDecrement * this.step;\n }\n\n protected override renderThumbs() {\n return this.renderThumb(this.value, this.ariaLabel!);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-slider': IgcSliderComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { property } from 'lit/decorators.js';\n\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedMixin } from '../common/mixins/forms/associated.js';\nimport {\n type FormValueOf,\n createFormValueState,\n defaultNumberTransformers,\n} from '../common/mixins/forms/form-value.js';\nimport { asNumber, asPercent, clamp } from '../common/util.js';\nimport { IgcSliderBaseComponent } from './slider-base.js';\nimport IgcSliderLabelComponent from './slider-label.js';\n\nexport interface IgcSliderComponentEventMap {\n /**\n * Emitted when a value is changed via thumb drag or keyboard interaction.\n */\n igcInput: CustomEvent<number>;\n /**\n * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n */\n igcChange: CustomEvent<number>;\n}\n\n/**\n * A slider component used to select numeric value within a range.\n *\n * @element igc-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcSliderComponent extends FormAssociatedMixin(\n EventEmitterMixin<\n IgcSliderComponentEventMap,\n Constructor<IgcSliderBaseComponent>\n >(IgcSliderBaseComponent)\n) {\n public static readonly tagName = 'igc-slider';\n\n /* blazorSuppress */\n public static register() {\n registerComponent(IgcSliderComponent, IgcSliderLabelComponent);\n }\n\n protected override readonly _formValue: FormValueOf<number> =\n createFormValueState(this, {\n initialValue: 0,\n transformers: defaultNumberTransformers,\n });\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n /**\n * The current value of the component.\n * @attr\n */\n @property({ type: Number })\n public set value(value: number) {\n this._formValue.setValueAndFormState(\n this.validateValue(asNumber(value, this._formValue.value))\n );\n }\n\n public get value(): number {\n return this._formValue.value;\n }\n\n protected override get activeValue(): number {\n return this.value;\n }\n\n protected override normalizeValue(): void {\n this.value = this.validateValue(this.value);\n }\n\n protected override getTrackStyle() {\n return {\n width: `${asPercent(this.value - this.min, this.distance)}%`,\n };\n }\n\n protected override updateValue(increment: number) {\n const value = clamp(\n this.value + increment,\n this.lowerBound,\n this.upperBound\n );\n\n if (this.value === value) {\n return false;\n }\n\n this.value = value;\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', { detail: this.value });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', { detail: this.value });\n }\n\n /**\n * Increments the value of the slider by `stepIncrement * step`, where `stepIncrement` defaults to 1.\n * @param stepIncrement Optional step increment. If no parameter is passed, it defaults to 1.\n */\n public stepUp(stepIncrement = 1) {\n this.value = this.value + stepIncrement * this.step;\n }\n\n /**\n * Decrements the value of the slider by `stepDecrement * step`, where `stepDecrement` defaults to 1.\n * @param stepDecrement Optional step decrement. If no parameter is passed, it defaults to 1.\n */\n public stepDown(stepDecrement = 1) {\n this.value = this.value - stepDecrement * this.step;\n }\n\n protected override renderThumbs() {\n return this.renderThumb(this.value, this.ariaLabel!);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-slider': IgcSliderComponent;\n }\n}\n"]}
@@ -14,7 +14,7 @@ import { addAnimationController } from '../../animations/player.js';
14
14
  import { themes } from '../../theming/theming-decorator.js';
15
15
  import { watch } from '../common/decorators/watch.js';
16
16
  import { registerComponent } from '../common/definitions/register.js';
17
- import { partNameMap } from '../common/util.js';
17
+ import { partMap } from '../common/part-map.js';
18
18
  import { bodyAnimations, contentAnimations, } from './animations.js';
19
19
  import { styles as shared } from './themes/step/shared/step.common.css.js';
20
20
  import { styles } from './themes/step/step.base.css.js';
@@ -133,7 +133,7 @@ let IgcStepComponent = IgcStepComponent_1 = class IgcStepComponent extends LitEl
133
133
  }
134
134
  renderTitleAndSubtitle() {
135
135
  return html `
136
- <div part="${partNameMap(this.textParts)}">
136
+ <div part=${partMap(this.textParts)}>
137
137
  <div part="title">
138
138
  <slot name="title"></slot>
139
139
  </div>
@@ -159,7 +159,7 @@ let IgcStepComponent = IgcStepComponent_1 = class IgcStepComponent extends LitEl
159
159
  render() {
160
160
  return html `
161
161
  ${when(this.contentTop && this.orientation === 'horizontal', () => this.renderContent(), () => nothing)}
162
- <div part="${partNameMap(this.headerContainerParts)}">
162
+ <div part=${partMap(this.headerContainerParts)}>
163
163
  <div
164
164
  part="header"
165
165
  tabindex="${this.active ? '0' : '-1'}"
@@ -1 +1 @@
1
- {"version":3,"file":"step.js","sourceRoot":"","sources":["../../../src/components/stepper/step.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, query, queryAssignedElements } from 'lit/decorators.js';\nimport { type Ref, createRef, ref } from 'lit/directives/ref.js';\nimport { when } from 'lit/directives/when.js';\n\nimport { EaseInOut } from '../../animations/easings.js';\nimport { addAnimationController } from '../../animations/player.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { partNameMap } from '../common/util.js';\nimport type {\n StepperOrientation,\n StepperStepType,\n StepperTitlePosition,\n} from '../types.js';\nimport {\n type Animation,\n bodyAnimations,\n contentAnimations,\n} from './animations.js';\nimport { styles as shared } from './themes/step/shared/step.common.css.js';\nimport { styles } from './themes/step/step.base.css.js';\nimport { all } from './themes/step/themes.js';\n\n/**\n * The step component is used within the `igc-stepper` element and it holds the content of each step.\n * It also supports custom indicators, title and subtitle.\n *\n * @element igc-step\n *\n * @slot - Renders the content of the step.\n * @slot indicator - Renders the indicator of the step. By default, it displays the step index + 1.\n * @slot title - Renders the title of the step.\n * @slot subtitle - Renders the subtitle of the step.\n *\n * @csspart header-container - Wrapper of the step's `header` and its separators.\n * @csspart disabled - Indicates a disabled state. Applies to `header-container`.\n * @csspart complete-start - Indicates a complete state of the current step. Applies to `header-container`.\n * @csspart complete-end - Indicates a complete state of the previous step. Applies to `header-container`.\n * @csspart optional - Indicates an optional state. Applies to `header-container`.\n * @csspart invalid - Indicates an invalid state. Applies to `header-container`.\n * @csspart top - Indicates that the title should be above the indicator. Applies to `header-container`.\n * @csspart bottom - Indicates that the title should be below the indicator. Applies to `header-container`.\n * @csspart start - Indicates that the title should be before the indicator. Applies to `header-container`.\n * @csspart end - Indicates that the title should be after the indicator. Applies to `header-container`.\n * @csspart header - Wrapper of the step's `indicator` and `text`.\n * @csspart indicator - The indicator of the step.\n * @csspart text - Wrapper of the step's `title` and `subtitle`.\n * @csspart empty - Indicates that no title and subtitle has been provided to the step. Applies to `text`.\n * @csspart title - The title of the step.\n * @csspart subtitle - The subtitle of the step.\n * @csspart body - Wrapper of the step's `content`.\n * @csspart content - The steps `content`.\n */\n@themes(all)\nexport default class IgcStepComponent extends LitElement {\n public static readonly tagName = 'igc-step';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register() {\n registerComponent(IgcStepComponent);\n }\n\n private bodyRef: Ref<HTMLElement> = createRef();\n private contentRef: Ref<HTMLElement> = createRef();\n\n private bodyAnimationPlayer = addAnimationController(this, this.bodyRef);\n private contentAnimationPlayer = addAnimationController(\n this,\n this.contentRef\n );\n\n @queryAssignedElements({ slot: 'title' })\n private _titleChildren!: Array<HTMLElement>;\n\n @queryAssignedElements({ slot: 'subtitle' })\n private _subTitleChildren!: Array<HTMLElement>;\n\n /* blazorSuppress */\n @query('[part~=\"header\"]')\n public header!: HTMLElement;\n\n /* blazorSuppress */\n @query('[part~=\"body\"]')\n public contentBody!: HTMLElement;\n\n /** Gets/sets whether the step is invalid. */\n @property({ reflect: true, type: Boolean })\n public invalid = false;\n\n /** Gets/sets whether the step is activе. */\n @property({ reflect: true, type: Boolean })\n public active = false;\n\n /**\n * Gets/sets whether the step is optional.\n *\n * @remarks\n * Optional steps validity does not affect the default behavior when the stepper is in linear mode i.e.\n * if optional step is invalid the user could still move to the next step.\n */\n @property({ type: Boolean })\n public optional = false;\n\n /** Gets/sets whether the step is interactable. */\n @property({ reflect: true, type: Boolean })\n public disabled = false;\n\n /** Gets/sets whether the step is completed.\n *\n * @remarks\n * When set to `true` the following separator is styled `solid`.\n */\n @property({ reflect: true, type: Boolean })\n public complete = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public previousComplete = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public stepType: StepperStepType = 'full';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public titlePosition: StepperTitlePosition = 'auto';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public orientation: StepperOrientation = 'horizontal';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public index = -1;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public contentTop = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public linearDisabled = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public visited = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public animation: Animation = 'fade';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public animationDuration = 350;\n\n /**\n * @hidden @internal\n * @deprecated since 5.4.0. Use the Stepper's `navigateTo` method instead.\n */\n public async toggleAnimation(\n type: 'in' | 'out',\n direction: 'normal' | 'reverse' = 'normal'\n ) {\n const bodyAnimation = bodyAnimations.get(this.animation)!.get(type)!;\n const contentAnimation = contentAnimations.get(this.animation)!.get(type)!;\n const bodyHeight = window\n .getComputedStyle(this)\n .getPropertyValue('--vertical-body-height');\n\n const options: KeyframeAnimationOptions = {\n duration: this.animationDuration,\n easing: EaseInOut.Quad,\n direction,\n };\n\n const step = {\n height: bodyHeight,\n };\n\n const [_, event] = await Promise.all([\n this.bodyAnimationPlayer.stopAll(),\n this.bodyAnimationPlayer.play(bodyAnimation({ keyframe: options, step })),\n this.contentAnimationPlayer.stopAll(),\n this.contentAnimationPlayer.play(\n contentAnimation({ keyframe: options, step })\n ),\n ]);\n\n return event.type;\n }\n\n @watch('active', { waitUntilFirstUpdate: true })\n protected activeChange() {\n if (this.active) {\n this.dispatchEvent(\n new CustomEvent('stepActiveChanged', { bubbles: true, detail: false })\n );\n }\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n @watch('invalid', { waitUntilFirstUpdate: true })\n @watch('optional', { waitUntilFirstUpdate: true })\n protected disabledInvalidOptionalChange() {\n this.dispatchEvent(\n new CustomEvent('stepDisabledInvalidChanged', { bubbles: true })\n );\n }\n\n @watch('complete', { waitUntilFirstUpdate: true })\n protected completeChange() {\n this.dispatchEvent(\n new CustomEvent('stepCompleteChanged', { bubbles: true })\n );\n }\n\n private handleClick(event: MouseEvent): void {\n event.stopPropagation();\n if (this.isAccessible) {\n this.dispatchEvent(\n new CustomEvent('stepActiveChanged', { bubbles: true, detail: true })\n );\n }\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n this.dispatchEvent(\n new CustomEvent('stepHeaderKeydown', {\n bubbles: true,\n detail: { event, focusedStep: this },\n })\n );\n }\n\n /** @hidden @internal */\n public get isAccessible(): boolean {\n return !this.disabled && !this.linearDisabled;\n }\n\n private get headerContainerParts() {\n return {\n 'header-container': true,\n disabled: !this.isAccessible,\n 'complete-start': this.complete,\n 'complete-end': this.previousComplete,\n optional: this.optional,\n invalid:\n this.invalid && this.visited && !this.active && this.isAccessible,\n top: this.titlePosition === 'top',\n bottom:\n this.titlePosition === 'bottom' ||\n (this.orientation === 'horizontal' && this.titlePosition === 'auto'),\n start: this.titlePosition === 'start',\n end:\n this.titlePosition === 'end' ||\n (this.orientation === 'vertical' && this.titlePosition === 'auto'),\n };\n }\n\n private get textParts() {\n return {\n text: true,\n empty:\n this.stepType === 'indicator'\n ? true\n : this.stepType === 'full' &&\n !this._titleChildren.length &&\n !this._subTitleChildren.length,\n };\n }\n\n protected renderIndicator() {\n if (this.stepType !== 'title') {\n return html`\n <div part=\"indicator\">\n <slot name=\"indicator\">\n <span>${this.index + 1}</span>\n </slot>\n </div>\n `;\n }\n return nothing;\n }\n\n protected renderTitleAndSubtitle() {\n return html`\n <div part=\"${partNameMap(this.textParts)}\">\n <div part=\"title\">\n <slot name=\"title\"></slot>\n </div>\n <div part=\"subtitle\">\n <slot name=\"subtitle\"></slot>\n </div>\n </div>\n `;\n }\n\n protected renderContent() {\n return html`<div\n ${ref(this.bodyRef)}\n id=\"igc-step-content-${this.index}\"\n part=\"body\"\n role=\"tabpanel\"\n aria-labelledby=\"igc-step-header-${this.index}\"\n >\n <div part=\"content\" ${ref(this.contentRef)}>\n <slot></slot>\n </div>\n </div>`;\n }\n\n protected override render() {\n return html`\n ${when(\n this.contentTop && this.orientation === 'horizontal',\n () => this.renderContent(),\n () => nothing\n )}\n <div part=\"${partNameMap(this.headerContainerParts)}\">\n <div\n part=\"header\"\n tabindex=\"${this.active ? '0' : '-1'}\"\n role=\"tab\"\n aria-selected=\"${this.active}\"\n @click=${this.handleClick}\n @keydown=${this.handleKeydown}\n >\n ${this.renderIndicator()} ${this.renderTitleAndSubtitle()}\n </div>\n </div>\n ${when(\n this.orientation === 'vertical' || !this.contentTop,\n () => this.renderContent(),\n () => nothing\n )}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-step': IgcStepComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"step.js","sourceRoot":"","sources":["../../../src/components/stepper/step.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, query, queryAssignedElements } from 'lit/decorators.js';\nimport { type Ref, createRef, ref } from 'lit/directives/ref.js';\nimport { when } from 'lit/directives/when.js';\n\nimport { EaseInOut } from '../../animations/easings.js';\nimport { addAnimationController } from '../../animations/player.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { partMap } from '../common/part-map.js';\nimport type {\n StepperOrientation,\n StepperStepType,\n StepperTitlePosition,\n} from '../types.js';\nimport {\n type Animation,\n bodyAnimations,\n contentAnimations,\n} from './animations.js';\nimport { styles as shared } from './themes/step/shared/step.common.css.js';\nimport { styles } from './themes/step/step.base.css.js';\nimport { all } from './themes/step/themes.js';\n\n/**\n * The step component is used within the `igc-stepper` element and it holds the content of each step.\n * It also supports custom indicators, title and subtitle.\n *\n * @element igc-step\n *\n * @slot - Renders the content of the step.\n * @slot indicator - Renders the indicator of the step. By default, it displays the step index + 1.\n * @slot title - Renders the title of the step.\n * @slot subtitle - Renders the subtitle of the step.\n *\n * @csspart header-container - Wrapper of the step's `header` and its separators.\n * @csspart disabled - Indicates a disabled state. Applies to `header-container`.\n * @csspart complete-start - Indicates a complete state of the current step. Applies to `header-container`.\n * @csspart complete-end - Indicates a complete state of the previous step. Applies to `header-container`.\n * @csspart optional - Indicates an optional state. Applies to `header-container`.\n * @csspart invalid - Indicates an invalid state. Applies to `header-container`.\n * @csspart top - Indicates that the title should be above the indicator. Applies to `header-container`.\n * @csspart bottom - Indicates that the title should be below the indicator. Applies to `header-container`.\n * @csspart start - Indicates that the title should be before the indicator. Applies to `header-container`.\n * @csspart end - Indicates that the title should be after the indicator. Applies to `header-container`.\n * @csspart header - Wrapper of the step's `indicator` and `text`.\n * @csspart indicator - The indicator of the step.\n * @csspart text - Wrapper of the step's `title` and `subtitle`.\n * @csspart empty - Indicates that no title and subtitle has been provided to the step. Applies to `text`.\n * @csspart title - The title of the step.\n * @csspart subtitle - The subtitle of the step.\n * @csspart body - Wrapper of the step's `content`.\n * @csspart content - The steps `content`.\n */\n@themes(all)\nexport default class IgcStepComponent extends LitElement {\n public static readonly tagName = 'igc-step';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register() {\n registerComponent(IgcStepComponent);\n }\n\n private bodyRef: Ref<HTMLElement> = createRef();\n private contentRef: Ref<HTMLElement> = createRef();\n\n private bodyAnimationPlayer = addAnimationController(this, this.bodyRef);\n private contentAnimationPlayer = addAnimationController(\n this,\n this.contentRef\n );\n\n @queryAssignedElements({ slot: 'title' })\n private _titleChildren!: Array<HTMLElement>;\n\n @queryAssignedElements({ slot: 'subtitle' })\n private _subTitleChildren!: Array<HTMLElement>;\n\n /* blazorSuppress */\n @query('[part~=\"header\"]')\n public header!: HTMLElement;\n\n /* blazorSuppress */\n @query('[part~=\"body\"]')\n public contentBody!: HTMLElement;\n\n /** Gets/sets whether the step is invalid. */\n @property({ reflect: true, type: Boolean })\n public invalid = false;\n\n /** Gets/sets whether the step is activе. */\n @property({ reflect: true, type: Boolean })\n public active = false;\n\n /**\n * Gets/sets whether the step is optional.\n *\n * @remarks\n * Optional steps validity does not affect the default behavior when the stepper is in linear mode i.e.\n * if optional step is invalid the user could still move to the next step.\n */\n @property({ type: Boolean })\n public optional = false;\n\n /** Gets/sets whether the step is interactable. */\n @property({ reflect: true, type: Boolean })\n public disabled = false;\n\n /** Gets/sets whether the step is completed.\n *\n * @remarks\n * When set to `true` the following separator is styled `solid`.\n */\n @property({ reflect: true, type: Boolean })\n public complete = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public previousComplete = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public stepType: StepperStepType = 'full';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public titlePosition: StepperTitlePosition = 'auto';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public orientation: StepperOrientation = 'horizontal';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public index = -1;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public contentTop = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public linearDisabled = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public visited = false;\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public animation: Animation = 'fade';\n\n /** @hidden @internal @private */\n @property({ attribute: false })\n public animationDuration = 350;\n\n /**\n * @hidden @internal\n * @deprecated since 5.4.0. Use the Stepper's `navigateTo` method instead.\n */\n public async toggleAnimation(\n type: 'in' | 'out',\n direction: 'normal' | 'reverse' = 'normal'\n ) {\n const bodyAnimation = bodyAnimations.get(this.animation)!.get(type)!;\n const contentAnimation = contentAnimations.get(this.animation)!.get(type)!;\n const bodyHeight = window\n .getComputedStyle(this)\n .getPropertyValue('--vertical-body-height');\n\n const options: KeyframeAnimationOptions = {\n duration: this.animationDuration,\n easing: EaseInOut.Quad,\n direction,\n };\n\n const step = {\n height: bodyHeight,\n };\n\n const [_, event] = await Promise.all([\n this.bodyAnimationPlayer.stopAll(),\n this.bodyAnimationPlayer.play(bodyAnimation({ keyframe: options, step })),\n this.contentAnimationPlayer.stopAll(),\n this.contentAnimationPlayer.play(\n contentAnimation({ keyframe: options, step })\n ),\n ]);\n\n return event.type;\n }\n\n @watch('active', { waitUntilFirstUpdate: true })\n protected activeChange() {\n if (this.active) {\n this.dispatchEvent(\n new CustomEvent('stepActiveChanged', { bubbles: true, detail: false })\n );\n }\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n @watch('invalid', { waitUntilFirstUpdate: true })\n @watch('optional', { waitUntilFirstUpdate: true })\n protected disabledInvalidOptionalChange() {\n this.dispatchEvent(\n new CustomEvent('stepDisabledInvalidChanged', { bubbles: true })\n );\n }\n\n @watch('complete', { waitUntilFirstUpdate: true })\n protected completeChange() {\n this.dispatchEvent(\n new CustomEvent('stepCompleteChanged', { bubbles: true })\n );\n }\n\n private handleClick(event: MouseEvent): void {\n event.stopPropagation();\n if (this.isAccessible) {\n this.dispatchEvent(\n new CustomEvent('stepActiveChanged', { bubbles: true, detail: true })\n );\n }\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n this.dispatchEvent(\n new CustomEvent('stepHeaderKeydown', {\n bubbles: true,\n detail: { event, focusedStep: this },\n })\n );\n }\n\n /** @hidden @internal */\n public get isAccessible(): boolean {\n return !this.disabled && !this.linearDisabled;\n }\n\n private get headerContainerParts() {\n return {\n 'header-container': true,\n disabled: !this.isAccessible,\n 'complete-start': this.complete,\n 'complete-end': this.previousComplete,\n optional: this.optional,\n invalid:\n this.invalid && this.visited && !this.active && this.isAccessible,\n top: this.titlePosition === 'top',\n bottom:\n this.titlePosition === 'bottom' ||\n (this.orientation === 'horizontal' && this.titlePosition === 'auto'),\n start: this.titlePosition === 'start',\n end:\n this.titlePosition === 'end' ||\n (this.orientation === 'vertical' && this.titlePosition === 'auto'),\n };\n }\n\n private get textParts() {\n return {\n text: true,\n empty:\n this.stepType === 'indicator'\n ? true\n : this.stepType === 'full' &&\n !this._titleChildren.length &&\n !this._subTitleChildren.length,\n };\n }\n\n protected renderIndicator() {\n if (this.stepType !== 'title') {\n return html`\n <div part=\"indicator\">\n <slot name=\"indicator\">\n <span>${this.index + 1}</span>\n </slot>\n </div>\n `;\n }\n return nothing;\n }\n\n protected renderTitleAndSubtitle() {\n return html`\n <div part=${partMap(this.textParts)}>\n <div part=\"title\">\n <slot name=\"title\"></slot>\n </div>\n <div part=\"subtitle\">\n <slot name=\"subtitle\"></slot>\n </div>\n </div>\n `;\n }\n\n protected renderContent() {\n return html`<div\n ${ref(this.bodyRef)}\n id=\"igc-step-content-${this.index}\"\n part=\"body\"\n role=\"tabpanel\"\n aria-labelledby=\"igc-step-header-${this.index}\"\n >\n <div part=\"content\" ${ref(this.contentRef)}>\n <slot></slot>\n </div>\n </div>`;\n }\n\n protected override render() {\n return html`\n ${when(\n this.contentTop && this.orientation === 'horizontal',\n () => this.renderContent(),\n () => nothing\n )}\n <div part=${partMap(this.headerContainerParts)}>\n <div\n part=\"header\"\n tabindex=\"${this.active ? '0' : '-1'}\"\n role=\"tab\"\n aria-selected=\"${this.active}\"\n @click=${this.handleClick}\n @keydown=${this.handleKeydown}\n >\n ${this.renderIndicator()} ${this.renderTitleAndSubtitle()}\n </div>\n </div>\n ${when(\n this.orientation === 'vertical' || !this.contentTop,\n () => this.renderContent(),\n () => nothing\n )}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-step': IgcStepComponent;\n }\n}\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--content-foreground: var(--ig-stepper-content-foreground, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--step-background: var(--ig-stepper-step-background, transparent);--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--title-color: var(--ig-stepper-title-color, var(--ig-gray-50-contrast));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-50-contrast));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-50-contrast));--subtitle-color: var(--ig-stepper-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-50-contrast));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-50-contrast));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-50-contrast));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-50-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-50-contrast));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-50-contrast));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-50-contrast));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-50-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-50-contrast));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-50-contrast));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-50-contrast));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-50));--ig-theme: indigo}`;
2
+ export const styles = css `:host{--content-foreground: var(--ig-stepper-content-foreground, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--step-background: var(--ig-stepper-step-background, transparent);--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--title-color: var(--ig-stepper-title-color, var(--ig-gray-50-contrast));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-50-contrast));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-50-contrast));--subtitle-color: var(--ig-stepper-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-50-contrast));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-50-contrast));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-50-contrast));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-50-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-50-contrast));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-50-contrast));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-50-contrast));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-50-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-50-contrast));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-50-contrast));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-50-contrast));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-50));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--ig-theme: indigo}`;
3
3
  //# sourceMappingURL=step.indigo.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/dark/step.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0sMAA0sM,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--content-foreground: var(--ig-stepper-content-foreground, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--step-background: var(--ig-stepper-step-background, transparent);--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--title-color: var(--ig-stepper-title-color, var(--ig-gray-50-contrast));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-50-contrast));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-50-contrast));--subtitle-color: var(--ig-stepper-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-50-contrast));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-50-contrast));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-50-contrast));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-50-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-50-contrast));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-50-contrast));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-50-contrast));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-50-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-50-contrast));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-50-contrast));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-50-contrast));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-50));--ig-theme: indigo}`;\n"]}
1
+ {"version":3,"file":"step.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/dark/step.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0sMAA0sM,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--content-foreground: var(--ig-stepper-content-foreground, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--step-background: var(--ig-stepper-step-background, transparent);--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--title-color: var(--ig-stepper-title-color, var(--ig-gray-50-contrast));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-50-contrast));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-50-contrast));--subtitle-color: var(--ig-stepper-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-50-contrast));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-50-contrast));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-50-contrast));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-50-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-50-contrast));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-50-contrast));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-50-contrast));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-50-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-50-contrast));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-50-contrast));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-50-contrast));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-50-contrast) h s l/0.3));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-50));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-50-contrast) h s l/0.1));--ig-theme: indigo}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-400));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-300));--step-separator-style: var(--ig-stepper-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-400));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-400));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-300-contrast));--ig-theme: bootstrap}`;
2
+ export const styles = css `:host{--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-400));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-300));--step-separator-style: var(--ig-stepper-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-400));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-400));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-300-contrast));--ig-theme: bootstrap}`;
3
3
  //# sourceMappingURL=step.bootstrap.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,4vDAA4vD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-400));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-300));--step-separator-style: var(--ig-stepper-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-400));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-400));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-300-contrast));--ig-theme: bootstrap}`;\n"]}
1
+ {"version":3,"file":"step.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,4vDAA4vD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-400));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-300));--step-separator-style: var(--ig-stepper-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-300) h s l/0.5));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-300) h s l/0.5));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-400));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-400));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-300-contrast));--ig-theme: bootstrap}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-900));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-300));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-200-contrast));--ig-theme: fluent}`;
2
+ export const styles = css `:host{--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-900));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-300));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-200-contrast));--step-hover-background: var(--ig-stepper-step-hover-background, var(--ig-gray-100));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, var(--ig-gray-100));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, var(--ig-gray-100));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, var(--ig-gray-100));--step-focus-background: var(--ig-stepper-step-focus-background, var(--ig-gray-200));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, var(--ig-gray-200));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, var(--ig-gray-200));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, var(--ig-gray-200));--ig-theme: fluent}`;
3
3
  //# sourceMappingURL=step.fluent.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2zBAA2zB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-900));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-300));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-200-contrast));--ig-theme: fluent}`;\n"]}
1
+ {"version":3,"file":"step.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ukDAAukD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-900));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0.02) * 6.25rem), 6.25rem));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-300));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-200-contrast));--step-hover-background: var(--ig-stepper-step-hover-background, var(--ig-gray-100));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, var(--ig-gray-100));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, var(--ig-gray-100));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, var(--ig-gray-100));--step-focus-background: var(--ig-stepper-step-focus-background, var(--ig-gray-200));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, var(--ig-gray-200));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, var(--ig-gray-200));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, var(--ig-gray-200));--ig-theme: fluent}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-700));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-900) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-800));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-900));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-900));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-900));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-gray-700));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-gray-700));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-gray-700));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-900) h s l/0.05));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-900) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-600));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--ig-theme: indigo}`;
2
+ export const styles = css `:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-700));--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-900) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-800));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-900));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-900));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-900));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-gray-700));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-gray-700));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-gray-700));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-900) h s l/0.05));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-900) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-600));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--ig-theme: indigo}`;
3
3
  //# sourceMappingURL=step.indigo.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ilGAAilG,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-700));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-900) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-800));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-900));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-900));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-900));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-gray-700));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-gray-700));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-gray-700));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-900) h s l/0.05));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-900) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-600));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--ig-theme: indigo}`;\n"]}
1
+ {"version":3,"file":"step.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ilGAAilG,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-700));--indicator-background: var(--ig-stepper-indicator-background, hsl(from var(--ig-gray-900) h s l/0.15));--indicator-outline: var(--ig-stepper-indicator-outline, transparent);--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-800));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, transparent);--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, transparent);--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-gray-900));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-gray-900));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-gray-900));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-gray-700));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-gray-700));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-gray-700));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, hsl(from var(--ig-gray-900) h s l/0.05));--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, transparent);--disabled-title-color: var(--ig-stepper-disabled-title-color, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, hsl(from var(--ig-gray-900) h s l/0.2));--step-separator-color: var(--ig-stepper-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, hsl(from var(--ig-gray-900) h s l/0.3));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, 0.25rem);--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-600));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, transparent);--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--step-hover-background: var(--ig-stepper-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--step-focus-background: var(--ig-stepper-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, hsl(from var(--ig-gray-900) h s l/0.05));--ig-theme: indigo}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--indicator-background: var(--ig-stepper-indicator-background, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-400-contrast));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, var(--ig-gray-200));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-gray-900));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-900));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-900));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--ig-theme: material}`;
2
+ export const styles = css `:host{--indicator-background: var(--ig-stepper-indicator-background, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-400-contrast));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, var(--ig-gray-200));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-gray-900));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-900));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-900));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--step-hover-background: var(--ig-stepper-step-hover-background, var(--ig-gray-200));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, var(--ig-gray-200));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, var(--ig-gray-200));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, var(--ig-gray-200));--step-focus-background: var(--ig-stepper-step-focus-background, var(--ig-gray-100));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, var(--ig-gray-100));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, var(--ig-gray-100));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, var(--ig-gray-100));--ig-theme: material}`;
3
3
  //# sourceMappingURL=step.material.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,orBAAorB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--indicator-background: var(--ig-stepper-indicator-background, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-400-contrast));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, var(--ig-gray-200));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-gray-900));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-900));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-900));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--ig-theme: material}`;\n"]}
1
+ {"version":3,"file":"step.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,g8CAAg8C,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--indicator-background: var(--ig-stepper-indicator-background, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-gray-400-contrast));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, var(--ig-gray-200));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-gray-900));--complete-indicator-background: var(--ig-stepper-complete-indicator-background, var(--ig-gray-900));--complete-indicator-outline: var(--ig-stepper-complete-indicator-outline, var(--ig-gray-900));--complete-indicator-color: var(--ig-stepper-complete-indicator-color, var(--ig-gray-900-contrast));--step-hover-background: var(--ig-stepper-step-hover-background, var(--ig-gray-200));--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, var(--ig-gray-200));--current-step-hover-background: var(--ig-stepper-current-step-hover-background, var(--ig-gray-200));--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, var(--ig-gray-200));--step-focus-background: var(--ig-stepper-step-focus-background, var(--ig-gray-100));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, var(--ig-gray-100));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, var(--ig-gray-100));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, var(--ig-gray-100));--ig-theme: material}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-900));--step-background: var(--ig-stepper-step-background, transparent);--step-hover-background: var(--ig-stepper-step-hover-background, var(--ig-gray-200));--step-focus-background: var(--ig-stepper-step-focus-background, var(--ig-gray-100));--indicator-background: var(--ig-stepper-indicator-background, transparent);--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-primary-500));--title-color: var(--ig-stepper-title-color, var(--ig-gray-900));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-900));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-900));--subtitle-color: var(--ig-stepper-subtitle-color, var(--ig-gray-700));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, var(--ig-gray-700));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, var(--ig-gray-700));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, var(--ig-gray-200));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, var(--ig-gray-100));--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-900));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-900));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-900));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, var(--ig-gray-700));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, var(--ig-gray-700));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, var(--ig-gray-700));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-step-hover-background: var(--ig-stepper-current-step-hover-background, var(--ig-gray-200));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, var(--ig-gray-100));--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, var(--ig-primary-500));--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-900-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-900));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-900));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-900));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, var(--ig-gray-700));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, var(--ig-gray-700));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, var(--ig-gray-700));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, var(--ig-gray-200));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, var(--ig-gray-100));--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, var(--ig-error-500));--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-900-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-error-500));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-error-500));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-error-500));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-error-500));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-error-500));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-error-500));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, var(--ig-gray-500));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, transparent);--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-200));--disabled-title-color: var(--ig-stepper-disabled-title-color, var(--ig-gray-500));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, var(--ig-gray-500));--step-separator-color: var(--ig-stepper-step-separator-color, var(--ig-gray-300));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-primary-500));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0) * 6.25rem), 6.25rem))}`;
2
+ export const styles = css `:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-900));--step-background: var(--ig-stepper-step-background, transparent);--indicator-background: var(--ig-stepper-indicator-background, transparent);--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-primary-500));--title-color: var(--ig-stepper-title-color, var(--ig-gray-900));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-900));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-900));--subtitle-color: var(--ig-stepper-subtitle-color, var(--ig-gray-700));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, var(--ig-gray-700));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, var(--ig-gray-700));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-900));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-900));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-900));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, var(--ig-gray-700));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, var(--ig-gray-700));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, var(--ig-gray-700));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, var(--ig-primary-500));--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-900-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-900));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-900));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-900));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, var(--ig-gray-700));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, var(--ig-gray-700));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, var(--ig-gray-700));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, var(--ig-error-500));--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-900-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-error-500));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-error-500));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-error-500));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-error-500));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-error-500));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-error-500));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, var(--ig-gray-500));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, transparent);--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-200));--disabled-title-color: var(--ig-stepper-disabled-title-color, var(--ig-gray-500));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, var(--ig-gray-500));--step-separator-color: var(--ig-stepper-step-separator-color, var(--ig-gray-300));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-primary-500));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0) * 6.25rem), 6.25rem))}`;
3
3
  //# sourceMappingURL=step.shared.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.shared.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.shared.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,glKAAglK,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-900));--step-background: var(--ig-stepper-step-background, transparent);--step-hover-background: var(--ig-stepper-step-hover-background, var(--ig-gray-200));--step-focus-background: var(--ig-stepper-step-focus-background, var(--ig-gray-100));--indicator-background: var(--ig-stepper-indicator-background, transparent);--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-primary-500));--title-color: var(--ig-stepper-title-color, var(--ig-gray-900));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-900));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-900));--subtitle-color: var(--ig-stepper-subtitle-color, var(--ig-gray-700));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, var(--ig-gray-700));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, var(--ig-gray-700));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-step-hover-background: var(--ig-stepper-complete-step-hover-background, var(--ig-gray-200));--complete-step-focus-background: var(--ig-stepper-complete-step-focus-background, var(--ig-gray-100));--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-900));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-900));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-900));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, var(--ig-gray-700));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, var(--ig-gray-700));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, var(--ig-gray-700));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-step-hover-background: var(--ig-stepper-current-step-hover-background, var(--ig-gray-200));--current-step-focus-background: var(--ig-stepper-current-step-focus-background, var(--ig-gray-100));--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, var(--ig-primary-500));--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-900-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-900));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-900));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-900));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, var(--ig-gray-700));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, var(--ig-gray-700));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, var(--ig-gray-700));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-step-hover-background: var(--ig-stepper-invalid-step-hover-background, var(--ig-gray-200));--invalid-step-focus-background: var(--ig-stepper-invalid-step-focus-background, var(--ig-gray-100));--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, var(--ig-error-500));--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-900-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-error-500));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-error-500));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-error-500));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-error-500));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-error-500));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-error-500));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, var(--ig-gray-500));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, transparent);--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-200));--disabled-title-color: var(--ig-stepper-disabled-title-color, var(--ig-gray-500));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, var(--ig-gray-500));--step-separator-color: var(--ig-stepper-step-separator-color, var(--ig-gray-300));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-primary-500));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0) * 6.25rem), 6.25rem))}`;\n"]}
1
+ {"version":3,"file":"step.shared.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/light/step.shared.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,o0IAAo0I,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--content-foreground: var(--ig-stepper-content-foreground, var(--ig-gray-900));--step-background: var(--ig-stepper-step-background, transparent);--indicator-background: var(--ig-stepper-indicator-background, transparent);--indicator-outline: var(--ig-stepper-indicator-outline, var(--ig-gray-300));--indicator-color: var(--ig-stepper-indicator-color, var(--ig-primary-500));--title-color: var(--ig-stepper-title-color, var(--ig-gray-900));--title-hover-color: var(--ig-stepper-title-hover-color, var(--ig-gray-900));--title-focus-color: var(--ig-stepper-title-focus-color, var(--ig-gray-900));--subtitle-color: var(--ig-stepper-subtitle-color, var(--ig-gray-700));--subtitle-hover-color: var(--ig-stepper-subtitle-hover-color, var(--ig-gray-700));--subtitle-focus-color: var(--ig-stepper-subtitle-focus-color, var(--ig-gray-700));--complete-step-background: var(--ig-stepper-complete-step-background, transparent);--complete-title-color: var(--ig-stepper-complete-title-color, var(--ig-gray-900));--complete-title-hover-color: var(--ig-stepper-complete-title-hover-color, var(--ig-gray-900));--complete-title-focus-color: var(--ig-stepper-complete-title-focus-color, var(--ig-gray-900));--complete-subtitle-color: var(--ig-stepper-complete-subtitle-color, var(--ig-gray-700));--complete-subtitle-hover-color: var(--ig-stepper-complete-subtitle-hover-color, var(--ig-gray-700));--complete-subtitle-focus-color: var(--ig-stepper-complete-subtitle-focus-color, var(--ig-gray-700));--current-step-background: var(--ig-stepper-current-step-background, transparent);--current-indicator-background: var(--ig-stepper-current-indicator-background, var(--ig-primary-500));--current-indicator-outline: var(--ig-stepper-current-indicator-outline, var(--ig-primary-500));--current-indicator-color: var(--ig-stepper-current-indicator-color, var(--ig-gray-900-contrast));--current-title-color: var(--ig-stepper-current-title-color, var(--ig-gray-900));--current-title-hover-color: var(--ig-stepper-current-title-hover-color, var(--ig-gray-900));--current-title-focus-color: var(--ig-stepper-current-title-focus-color, var(--ig-gray-900));--current-subtitle-color: var(--ig-stepper-current-subtitle-color, var(--ig-gray-700));--current-subtitle-hover-color: var(--ig-stepper-current-subtitle-hover-color, var(--ig-gray-700));--current-subtitle-focus-color: var(--ig-stepper-current-subtitle-focus-color, var(--ig-gray-700));--invalid-step-background: var(--ig-stepper-invalid-step-background, transparent);--invalid-indicator-background: var(--ig-stepper-invalid-indicator-background, var(--ig-error-500));--invalid-indicator-outline: var(--ig-stepper-invalid-indicator-outline, var(--ig-error-500));--invalid-indicator-color: var(--ig-stepper-invalid-indicator-color, var(--ig-gray-900-contrast));--invalid-title-color: var(--ig-stepper-invalid-title-color, var(--ig-error-500));--invalid-title-hover-color: var(--ig-stepper-invalid-title-hover-color, var(--ig-error-500));--invalid-title-focus-color: var(--ig-stepper-invalid-title-focus-color, var(--ig-error-500));--invalid-subtitle-color: var(--ig-stepper-invalid-subtitle-color, var(--ig-error-500));--invalid-subtitle-hover-color: var(--ig-stepper-invalid-subtitle-hover-color, var(--ig-error-500));--invalid-subtitle-focus-color: var(--ig-stepper-invalid-subtitle-focus-color, var(--ig-error-500));--disabled-indicator-color: var(--ig-stepper-disabled-indicator-color, var(--ig-gray-500));--disabled-indicator-background: var(--ig-stepper-disabled-indicator-background, transparent);--disabled-indicator-outline: var(--ig-stepper-disabled-indicator-outline, var(--ig-gray-200));--disabled-title-color: var(--ig-stepper-disabled-title-color, var(--ig-gray-500));--disabled-subtitle-color: var(--ig-stepper-disabled-subtitle-color, var(--ig-gray-500));--step-separator-color: var(--ig-stepper-step-separator-color, var(--ig-gray-300));--complete-step-separator-color: var(--ig-stepper-complete-step-separator-color, var(--ig-primary-500));--step-separator-style: var(--ig-stepper-step-separator-style, dashed);--complete-step-separator-style: var(--ig-stepper-complete-step-separator-style, solid);--border-radius-indicator: var(--ig-stepper-border-radius-indicator, clamp(0rem, calc(var(--ig-radius-factor, 1) * 6.25rem), 6.25rem));--border-radius-step-header: var(--ig-stepper-border-radius-step-header, clamp(0rem, calc(var(--ig-radius-factor, 0) * 6.25rem), 6.25rem))}`;\n"]}
@@ -13,11 +13,11 @@ declare class TabsHelpers {
13
13
  /**
14
14
  * Returns the DOM container holding the tabs headers.
15
15
  */
16
- get container(): HTMLElement;
16
+ get container(): HTMLElement | undefined;
17
17
  /**
18
18
  * Returns the selected indicator DOM element.
19
19
  */
20
- get indicator(): HTMLElement;
20
+ get indicator(): HTMLElement | undefined;
21
21
  /**
22
22
  * Returns the internal CSS variables used for the layout of the tabs component.
23
23
  */
@@ -38,14 +38,21 @@ class TabsHelpers {
38
38
  setStyleProperties() {
39
39
  this._styleProperties = {
40
40
  '--_tabs-count': this._host.tabs.length.toString(),
41
- '--_ig-tabs-width': `${this.container.getBoundingClientRect().width}px`,
41
+ '--_ig-tabs-width': this.container
42
+ ? `${this.container.getBoundingClientRect().width}px`
43
+ : '',
42
44
  };
43
45
  this._host.requestUpdate();
44
46
  }
45
47
  setScrollSnap(type) {
46
- this.container.style.setProperty('--_ig-tab-snap', type || 'unset');
48
+ if (this.container) {
49
+ this.container.style.setProperty('--_ig-tab-snap', type || 'unset');
50
+ }
47
51
  }
48
52
  scrollTabs(direction) {
53
+ if (!this.container) {
54
+ return;
55
+ }
49
56
  const factor = isLTR(this._host) ? 1 : -1;
50
57
  const amount = direction === 'start'
51
58
  ? -TabsHelpers.SCROLL_AMOUNT
@@ -54,6 +61,9 @@ class TabsHelpers {
54
61
  this.container.scrollBy({ left: factor * amount, behavior: 'smooth' });
55
62
  }
56
63
  setScrollButtonState() {
64
+ if (!this.container) {
65
+ return;
66
+ }
57
67
  const { scrollLeft, scrollWidth, clientWidth } = this.container;
58
68
  this._hasScrollButtons = scrollWidth > clientWidth;
59
69
  this._scrollButtonsDisabled = {
@@ -63,6 +73,9 @@ class TabsHelpers {
63
73
  this._host.requestUpdate();
64
74
  }
65
75
  async setIndicator(active) {
76
+ if (!(this.container && this.indicator)) {
77
+ return;
78
+ }
66
79
  const styles = {
67
80
  visibility: active ? 'visible' : 'hidden',
68
81
  };
@@ -1 +1 @@
1
- {"version":3,"file":"tab-dom.js","sourceRoot":"","sources":["../../../src/components/tabs/tab-dom.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Ref } from 'lit/directives/ref.js';\nimport { isLTR } from '../common/util.js';\nimport type IgcTabComponent from './tab.js';\nimport type IgcTabsComponent from './tabs.js';\n\nclass TabsHelpers {\n private static readonly SCROLL_AMOUNT = 180;\n private readonly _host: IgcTabsComponent;\n private readonly _container: Ref<HTMLElement>;\n private readonly _indicator: Ref<HTMLElement>;\n\n private _styleProperties = {\n '--_tabs-count': '',\n '--_ig-tabs-width': '',\n };\n\n private _hasScrollButtons = false;\n private _scrollButtonsDisabled = { start: true, end: false };\n\n private _isLeftToRight = false;\n\n /**\n * Returns the DOM container holding the tabs headers.\n */\n public get container(): HTMLElement {\n return this._container.value!;\n }\n\n /**\n * Returns the selected indicator DOM element.\n */\n public get indicator(): HTMLElement {\n return this._indicator.value!;\n }\n\n /**\n * Returns the internal CSS variables used for the layout of the tabs component.\n */\n public get styleProperties() {\n return this._styleProperties;\n }\n\n /**\n * Whether the scroll buttons of the tabs header strip should be shown.\n */\n public get hasScrollButtons(): boolean {\n return this._hasScrollButtons;\n }\n\n /**\n * Returns the disabled state of the tabs header strip scroll buttons.\n */\n public get scrollButtonsDisabled() {\n return this._scrollButtonsDisabled;\n }\n\n public get isLeftToRightChanged(): boolean {\n const isLeftToRight = isLTR(this._host);\n\n if (this._isLeftToRight !== isLeftToRight) {\n this._isLeftToRight = isLeftToRight;\n return true;\n }\n\n return false;\n }\n\n constructor(\n host: IgcTabsComponent,\n container: Ref<HTMLElement>,\n indicator: Ref<HTMLElement>\n ) {\n this._host = host;\n this._container = container;\n this._indicator = indicator;\n }\n\n /**\n * Sets the internal CSS variables used for the layout of the tabs component.\n * Triggers an update cycle (rerender) of the `igc-tabs` component.\n */\n public setStyleProperties(): void {\n this._styleProperties = {\n '--_tabs-count': this._host.tabs.length.toString(),\n '--_ig-tabs-width': `${this.container.getBoundingClientRect().width}px`,\n };\n this._host.requestUpdate();\n }\n\n /**\n * Sets the type of the `scroll-snap-align` CSS property for the tabs header strip.\n */\n public setScrollSnap(type?: 'start' | 'end'): void {\n this.container.style.setProperty('--_ig-tab-snap', type || 'unset');\n }\n\n /**\n * Scrolls the tabs header strip in the given direction with `scroll-snap-align` set.\n */\n public scrollTabs(direction: 'start' | 'end'): void {\n const factor = isLTR(this._host) ? 1 : -1;\n const amount =\n direction === 'start'\n ? -TabsHelpers.SCROLL_AMOUNT\n : TabsHelpers.SCROLL_AMOUNT;\n\n this.setScrollSnap(direction);\n this.container.scrollBy({ left: factor * amount, behavior: 'smooth' });\n }\n\n /**\n * Updates the state of the tabs header strip scroll buttons - visibility and active state.\n * Triggers an update cycle (rerender) of the `igc-tabs` component.\n */\n public setScrollButtonState(): void {\n const { scrollLeft, scrollWidth, clientWidth } = this.container;\n\n this._hasScrollButtons = scrollWidth > clientWidth;\n this._scrollButtonsDisabled = {\n start: scrollLeft === 0,\n end: Math.abs(Math.abs(scrollLeft) + clientWidth - scrollWidth) <= 1,\n };\n\n this._host.requestUpdate();\n }\n\n /**\n * Updates the indicator DOM element styles based on the current \"active\" tab.\n */\n public async setIndicator(active?: IgcTabComponent): Promise<void> {\n const styles = {\n visibility: active ? 'visible' : 'hidden',\n } satisfies Partial<CSSStyleDeclaration>;\n\n await this._host.updateComplete;\n\n if (active) {\n const tabHeader = getTabHeader(active);\n const { width } = tabHeader.getBoundingClientRect();\n\n const offset = this._isLeftToRight\n ? tabHeader.offsetLeft - this.container.offsetLeft\n : width +\n tabHeader.offsetLeft -\n this.container.getBoundingClientRect().width;\n\n Object.assign(styles, {\n width: `${width}px`,\n transform: `translateX(${offset}px)`,\n });\n }\n\n Object.assign(this.indicator.style, styles);\n }\n}\n\nexport function createTabHelpers(\n host: IgcTabsComponent,\n container: Ref<HTMLElement>,\n indicator: Ref<HTMLElement>\n) {\n return new TabsHelpers(host, container, indicator);\n}\n\nexport function getTabHeader(tab: IgcTabComponent): HTMLElement {\n return tab.renderRoot.querySelector('[part~=\"tab-header\"]')!;\n}\n"]}
1
+ {"version":3,"file":"tab-dom.js","sourceRoot":"","sources":["../../../src/components/tabs/tab-dom.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Ref } from 'lit/directives/ref.js';\nimport { isLTR } from '../common/util.js';\nimport type IgcTabComponent from './tab.js';\nimport type IgcTabsComponent from './tabs.js';\n\nclass TabsHelpers {\n private static readonly SCROLL_AMOUNT = 180;\n private readonly _host: IgcTabsComponent;\n private readonly _container: Ref<HTMLElement>;\n private readonly _indicator: Ref<HTMLElement>;\n\n private _styleProperties = {\n '--_tabs-count': '',\n '--_ig-tabs-width': '',\n };\n\n private _hasScrollButtons = false;\n private _scrollButtonsDisabled = { start: true, end: false };\n\n private _isLeftToRight = false;\n\n /**\n * Returns the DOM container holding the tabs headers.\n */\n public get container(): HTMLElement | undefined {\n return this._container.value;\n }\n\n /**\n * Returns the selected indicator DOM element.\n */\n public get indicator(): HTMLElement | undefined {\n return this._indicator.value;\n }\n\n /**\n * Returns the internal CSS variables used for the layout of the tabs component.\n */\n public get styleProperties() {\n return this._styleProperties;\n }\n\n /**\n * Whether the scroll buttons of the tabs header strip should be shown.\n */\n public get hasScrollButtons(): boolean {\n return this._hasScrollButtons;\n }\n\n /**\n * Returns the disabled state of the tabs header strip scroll buttons.\n */\n public get scrollButtonsDisabled() {\n return this._scrollButtonsDisabled;\n }\n\n public get isLeftToRightChanged(): boolean {\n const isLeftToRight = isLTR(this._host);\n\n if (this._isLeftToRight !== isLeftToRight) {\n this._isLeftToRight = isLeftToRight;\n return true;\n }\n\n return false;\n }\n\n constructor(\n host: IgcTabsComponent,\n container: Ref<HTMLElement>,\n indicator: Ref<HTMLElement>\n ) {\n this._host = host;\n this._container = container;\n this._indicator = indicator;\n }\n\n /**\n * Sets the internal CSS variables used for the layout of the tabs component.\n * Triggers an update cycle (rerender) of the `igc-tabs` component.\n */\n public setStyleProperties(): void {\n this._styleProperties = {\n '--_tabs-count': this._host.tabs.length.toString(),\n '--_ig-tabs-width': this.container\n ? `${this.container.getBoundingClientRect().width}px`\n : '',\n };\n this._host.requestUpdate();\n }\n\n /**\n * Sets the type of the `scroll-snap-align` CSS property for the tabs header strip.\n */\n public setScrollSnap(type?: 'start' | 'end'): void {\n if (this.container) {\n this.container.style.setProperty('--_ig-tab-snap', type || 'unset');\n }\n }\n\n /**\n * Scrolls the tabs header strip in the given direction with `scroll-snap-align` set.\n */\n public scrollTabs(direction: 'start' | 'end'): void {\n if (!this.container) {\n return;\n }\n\n const factor = isLTR(this._host) ? 1 : -1;\n const amount =\n direction === 'start'\n ? -TabsHelpers.SCROLL_AMOUNT\n : TabsHelpers.SCROLL_AMOUNT;\n\n this.setScrollSnap(direction);\n this.container.scrollBy({ left: factor * amount, behavior: 'smooth' });\n }\n\n /**\n * Updates the state of the tabs header strip scroll buttons - visibility and active state.\n * Triggers an update cycle (rerender) of the `igc-tabs` component.\n */\n public setScrollButtonState(): void {\n if (!this.container) {\n return;\n }\n\n const { scrollLeft, scrollWidth, clientWidth } = this.container;\n\n this._hasScrollButtons = scrollWidth > clientWidth;\n this._scrollButtonsDisabled = {\n start: scrollLeft === 0,\n end: Math.abs(Math.abs(scrollLeft) + clientWidth - scrollWidth) <= 1,\n };\n\n this._host.requestUpdate();\n }\n\n /**\n * Updates the indicator DOM element styles based on the current \"active\" tab.\n */\n public async setIndicator(active?: IgcTabComponent): Promise<void> {\n if (!(this.container && this.indicator)) {\n return;\n }\n\n const styles = {\n visibility: active ? 'visible' : 'hidden',\n } satisfies Partial<CSSStyleDeclaration>;\n\n await this._host.updateComplete;\n\n if (active) {\n const tabHeader = getTabHeader(active);\n const { width } = tabHeader.getBoundingClientRect();\n\n const offset = this._isLeftToRight\n ? tabHeader.offsetLeft - this.container.offsetLeft\n : width +\n tabHeader.offsetLeft -\n this.container.getBoundingClientRect().width;\n\n Object.assign(styles, {\n width: `${width}px`,\n transform: `translateX(${offset}px)`,\n });\n }\n\n Object.assign(this.indicator.style, styles);\n }\n}\n\nexport function createTabHelpers(\n host: IgcTabsComponent,\n container: Ref<HTMLElement>,\n indicator: Ref<HTMLElement>\n) {\n return new TabsHelpers(host, container, indicator);\n}\n\nexport function getTabHeader(tab: IgcTabComponent): HTMLElement {\n return tab.renderRoot.querySelector('[part~=\"tab-header\"]')!;\n}\n"]}
@@ -75,7 +75,8 @@ export default class IgcTabsComponent extends IgcTabsComponent_base {
75
75
  protected _handleClick(event: PointerEvent): void;
76
76
  protected _handleScroll(): void;
77
77
  /** Selects the specified tab and displays the corresponding panel. */
78
- select(ref: IgcTabComponent | string): void;
78
+ select(id: string): void;
79
+ select(ref: IgcTabComponent): void;
79
80
  protected _renderScrollButton(direction: 'start' | 'end'): import("lit-html").TemplateResult<1>;
80
81
  protected render(): import("lit-html").TemplateResult<1>;
81
82
  }