@roadtrip/components 3.11.0 → 3.11.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (632) hide show
  1. package/dist/cjs/{app-d9e5adfa.js → app-a0c1eef6.js} +2 -2
  2. package/dist/cjs/app-a0c1eef6.js.map +1 -0
  3. package/dist/cjs/{focus-visible-6771892b.js → focus-visible-6f34b3f4.js} +1 -1
  4. package/dist/cjs/focus-visible-6f34b3f4.js.map +1 -0
  5. package/dist/cjs/{index-e4bd5b5f.js → index-4fdb2a28.js} +408 -194
  6. package/dist/cjs/index-4fdb2a28.js.map +1 -0
  7. package/dist/cjs/{index-fd07207a.js → index-fb57f684.js} +1 -1
  8. package/dist/cjs/index-fb57f684.js.map +1 -0
  9. package/dist/cjs/index.cjs.js +3 -3
  10. package/dist/cjs/loader.cjs.js +4 -29
  11. package/dist/cjs/loader.cjs.js.map +1 -1
  12. package/dist/cjs/{polyfill-9453e116.js → polyfill-b1fff766.js} +2 -2
  13. package/dist/cjs/polyfill-b1fff766.js.map +1 -0
  14. package/dist/cjs/road-accordion.cjs.entry.js +3 -3
  15. package/dist/cjs/road-accordion.cjs.entry.js.map +1 -1
  16. package/dist/cjs/road-alert.cjs.entry.js +1 -1
  17. package/dist/cjs/road-alert.cjs.entry.js.map +1 -1
  18. package/dist/cjs/road-area-code.cjs.entry.js +9 -13
  19. package/dist/cjs/road-area-code.cjs.entry.js.map +1 -1
  20. package/dist/cjs/road-autocomplete.cjs.entry.js +1 -1
  21. package/dist/cjs/road-autocomplete.cjs.entry.js.map +1 -1
  22. package/dist/cjs/road-avatar.cjs.entry.js +1 -1
  23. package/dist/cjs/road-avatar.cjs.entry.js.map +1 -1
  24. package/dist/cjs/road-badge_14.cjs.entry.js +5 -5
  25. package/dist/cjs/road-badge_14.cjs.entry.js.map +1 -1
  26. package/dist/cjs/road-banner.cjs.entry.js +2 -2
  27. package/dist/cjs/road-banner.cjs.entry.js.map +1 -1
  28. package/dist/cjs/road-button-floating.cjs.entry.js +2 -2
  29. package/dist/cjs/road-button-floating.cjs.entry.js.map +1 -1
  30. package/dist/cjs/road-card.cjs.entry.js +1 -1
  31. package/dist/cjs/road-card.cjs.entry.js.map +1 -1
  32. package/dist/cjs/road-carousel-item.cjs.entry.js +1 -1
  33. package/dist/cjs/road-carousel-item.cjs.entry.js.map +1 -1
  34. package/dist/cjs/road-carousel.cjs.entry.js +2 -2
  35. package/dist/cjs/road-carousel.cjs.entry.js.map +1 -1
  36. package/dist/cjs/road-checkbox.cjs.entry.js +3 -3
  37. package/dist/cjs/road-checkbox.cjs.entry.js.map +1 -1
  38. package/dist/cjs/road-chip.cjs.entry.js +3 -3
  39. package/dist/cjs/road-chip.cjs.entry.js.map +1 -1
  40. package/dist/cjs/road-collapse.cjs.entry.js +1 -1
  41. package/dist/cjs/road-collapse.cjs.entry.js.map +1 -1
  42. package/dist/cjs/road-dialog.cjs.entry.js +2 -2
  43. package/dist/cjs/road-dialog.cjs.entry.js.map +1 -1
  44. package/dist/cjs/road-dropdown.cjs.entry.js +1 -1
  45. package/dist/cjs/road-dropdown.cjs.entry.js.map +1 -1
  46. package/dist/cjs/road-duration.cjs.entry.js +1 -1
  47. package/dist/cjs/road-duration.cjs.entry.js.map +1 -1
  48. package/dist/cjs/road-flap.cjs.entry.js +1 -1
  49. package/dist/cjs/road-flap.cjs.entry.js.map +1 -1
  50. package/dist/cjs/road-global-navigation.cjs.entry.js +2 -2
  51. package/dist/cjs/road-global-navigation.cjs.entry.js.map +1 -1
  52. package/dist/cjs/road-illustration.cjs.entry.js +2 -2
  53. package/dist/cjs/road-illustration.cjs.entry.js.map +1 -1
  54. package/dist/cjs/road-img.cjs.entry.js +1 -1
  55. package/dist/cjs/road-img.cjs.entry.js.map +1 -1
  56. package/dist/cjs/road-modal.cjs.entry.js +2 -2
  57. package/dist/cjs/road-modal.cjs.entry.js.map +1 -1
  58. package/dist/cjs/road-navbar-item.cjs.entry.js +1 -1
  59. package/dist/cjs/road-navbar-item.cjs.entry.js.map +1 -1
  60. package/dist/cjs/road-navbar.cjs.entry.js +2 -2
  61. package/dist/cjs/road-navbar.cjs.entry.js.map +1 -1
  62. package/dist/cjs/road-phone-number-input.cjs.entry.js +22 -16
  63. package/dist/cjs/road-phone-number-input.cjs.entry.js.map +1 -1
  64. package/dist/cjs/road-plate-number.cjs.entry.js +2 -2
  65. package/dist/cjs/road-plate-number.cjs.entry.js.map +1 -1
  66. package/dist/cjs/road-profil-dropdown.cjs.entry.js +1 -1
  67. package/dist/cjs/road-profil-dropdown.cjs.entry.js.map +1 -1
  68. package/dist/cjs/road-progress-indicator-horizontal.cjs.entry.js +1 -1
  69. package/dist/cjs/road-progress-indicator-horizontal.cjs.entry.js.map +1 -1
  70. package/dist/cjs/road-progress-indicator-vertical-item.cjs.entry.js +1 -1
  71. package/dist/cjs/road-progress-indicator-vertical-item.cjs.entry.js.map +1 -1
  72. package/dist/cjs/road-progress-indicator-vertical.cjs.entry.js +1 -1
  73. package/dist/cjs/road-progress-indicator-vertical.cjs.entry.js.map +1 -1
  74. package/dist/cjs/road-progress-tracker-item.cjs.entry.js +1 -1
  75. package/dist/cjs/road-progress-tracker-item.cjs.entry.js.map +1 -1
  76. package/dist/cjs/road-progress-tracker.cjs.entry.js +1 -1
  77. package/dist/cjs/road-progress-tracker.cjs.entry.js.map +1 -1
  78. package/dist/cjs/road-progress.cjs.entry.js +1 -1
  79. package/dist/cjs/road-progress.cjs.entry.js.map +1 -1
  80. package/dist/cjs/road-radio-group.cjs.entry.js +1 -1
  81. package/dist/cjs/road-radio-group.cjs.entry.js.map +1 -1
  82. package/dist/cjs/road-radio.cjs.entry.js +2 -2
  83. package/dist/cjs/road-radio.cjs.entry.js.map +1 -1
  84. package/dist/cjs/road-range.cjs.entry.js +2 -2
  85. package/dist/cjs/road-range.cjs.entry.js.map +1 -1
  86. package/dist/cjs/road-rating.cjs.entry.js +2 -2
  87. package/dist/cjs/road-rating.cjs.entry.js.map +1 -1
  88. package/dist/cjs/road-segmented-button-bar.cjs.entry.js +2 -2
  89. package/dist/cjs/road-segmented-button-bar.cjs.entry.js.map +1 -1
  90. package/dist/cjs/road-segmented-button.cjs.entry.js +1 -1
  91. package/dist/cjs/road-segmented-button.cjs.entry.js.map +1 -1
  92. package/dist/cjs/road-segmented-buttons.cjs.entry.js +1 -1
  93. package/dist/cjs/road-segmented-buttons.cjs.entry.js.map +1 -1
  94. package/dist/cjs/road-select-filter.cjs.entry.js +1 -1
  95. package/dist/cjs/road-select-filter.cjs.entry.js.map +1 -1
  96. package/dist/cjs/road-select.cjs.entry.js +2 -2
  97. package/dist/cjs/road-select.cjs.entry.js.map +1 -1
  98. package/dist/cjs/road-skeleton.cjs.entry.js +1 -1
  99. package/dist/cjs/road-skeleton.cjs.entry.js.map +1 -1
  100. package/dist/cjs/road-spinner.cjs.entry.js +1 -1
  101. package/dist/cjs/road-spinner.cjs.entry.js.map +1 -1
  102. package/dist/cjs/road-switch.cjs.entry.js +2 -2
  103. package/dist/cjs/road-switch.cjs.entry.js.map +1 -1
  104. package/dist/cjs/road-tab-bar.cjs.entry.js +2 -2
  105. package/dist/cjs/road-tab-bar.cjs.entry.js.map +1 -1
  106. package/dist/cjs/road-tab-button.cjs.entry.js +1 -1
  107. package/dist/cjs/road-tab-button.cjs.entry.js.map +1 -1
  108. package/dist/cjs/road-tab.cjs.entry.js +1 -1
  109. package/dist/cjs/road-tab.cjs.entry.js.map +1 -1
  110. package/dist/cjs/road-table.cjs.entry.js +1 -1
  111. package/dist/cjs/road-table.cjs.entry.js.map +1 -1
  112. package/dist/cjs/road-tabs.cjs.entry.js +1 -1
  113. package/dist/cjs/road-tabs.cjs.entry.js.map +1 -1
  114. package/dist/cjs/road-tag.cjs.entry.js +2 -2
  115. package/dist/cjs/road-tag.cjs.entry.js.map +1 -1
  116. package/dist/cjs/road-text.cjs.entry.js +1 -1
  117. package/dist/cjs/road-text.cjs.entry.js.map +1 -1
  118. package/dist/cjs/road-textarea.cjs.entry.js +1 -1
  119. package/dist/cjs/road-textarea.cjs.entry.js.map +1 -1
  120. package/dist/cjs/road-toast.cjs.entry.js +2 -2
  121. package/dist/cjs/road-toast.cjs.entry.js.map +1 -1
  122. package/dist/cjs/road-toggle.cjs.entry.js +2 -2
  123. package/dist/cjs/road-toggle.cjs.entry.js.map +1 -1
  124. package/dist/cjs/road-toolbar-title-page.cjs.entry.js +1 -1
  125. package/dist/cjs/road-toolbar-title-page.cjs.entry.js.map +1 -1
  126. package/dist/cjs/road-toolbar-title.cjs.entry.js +1 -1
  127. package/dist/cjs/road-toolbar-title.cjs.entry.js.map +1 -1
  128. package/dist/cjs/road-tooltip.cjs.entry.js +1 -1
  129. package/dist/cjs/road-tooltip.cjs.entry.js.map +1 -1
  130. package/dist/cjs/roadtrip.cjs.js +7 -103
  131. package/dist/cjs/roadtrip.cjs.js.map +1 -1
  132. package/dist/cjs/{utils-5203d152.js → utils-0428be89.js} +2 -2
  133. package/dist/cjs/utils-0428be89.js.map +1 -0
  134. package/dist/cjs/{utils-a450bad3.js → utils-e284da2f.js} +2 -2
  135. package/dist/cjs/utils-e284da2f.js.map +1 -0
  136. package/dist/collection/collection-manifest.json +74 -74
  137. package/dist/collection/components/accordion/accordion.js +3 -3
  138. package/dist/collection/components/alert/alert.js +3 -2
  139. package/dist/collection/components/alert/alert.js.map +1 -1
  140. package/dist/collection/components/area-code/area-code.js +19 -38
  141. package/dist/collection/components/area-code/area-code.js.map +1 -1
  142. package/dist/collection/components/autocomplete/autocomplete.js +3 -2
  143. package/dist/collection/components/autocomplete/autocomplete.js.map +1 -1
  144. package/dist/collection/components/avatar/avatar.js +1 -1
  145. package/dist/collection/components/badge/badge.js +3 -2
  146. package/dist/collection/components/badge/badge.js.map +1 -1
  147. package/dist/collection/components/banner/banner.js +4 -3
  148. package/dist/collection/components/banner/banner.js.map +1 -1
  149. package/dist/collection/components/button/button.js +2 -2
  150. package/dist/collection/components/button-floating/button-floating.js +2 -2
  151. package/dist/collection/components/card/card.js +1 -1
  152. package/dist/collection/components/carousel/carousel.js +34 -18
  153. package/dist/collection/components/carousel/carousel.js.map +1 -1
  154. package/dist/collection/components/carousel-item/carousel-item.js +1 -1
  155. package/dist/collection/components/checkbox/checkbox.js +3 -3
  156. package/dist/collection/components/chip/chip.js +3 -3
  157. package/dist/collection/components/col/col.js +1 -1
  158. package/dist/collection/components/collapse/collapse.js +1 -1
  159. package/dist/collection/components/counter/counter.js +1 -1
  160. package/dist/collection/components/dialog/dialog.js +8 -5
  161. package/dist/collection/components/dialog/dialog.js.map +1 -1
  162. package/dist/collection/components/drawer/drawer.js +9 -6
  163. package/dist/collection/components/drawer/drawer.js.map +1 -1
  164. package/dist/collection/components/dropdown/dropdown.js +1 -1
  165. package/dist/collection/components/duration/duration.js +5 -3
  166. package/dist/collection/components/duration/duration.js.map +1 -1
  167. package/dist/collection/components/flap/flap.js +1 -1
  168. package/dist/collection/components/global-navigation/global-navigation.js +2 -2
  169. package/dist/collection/components/grid/grid.js +1 -1
  170. package/dist/collection/components/icon/icon.js +5 -4
  171. package/dist/collection/components/icon/icon.js.map +1 -1
  172. package/dist/collection/components/icon/request.js +1 -1
  173. package/dist/collection/components/icon/svg/vehicle-car-search-color.svg +1 -1
  174. package/dist/collection/components/icon/utils.js +1 -1
  175. package/dist/collection/components/icon/validate.js +1 -1
  176. package/dist/collection/components/illustration/illustration.js +3 -3
  177. package/dist/collection/components/illustration/request.js +1 -1
  178. package/dist/collection/components/illustration/utils.js +1 -1
  179. package/dist/collection/components/illustration/validate.js +1 -1
  180. package/dist/collection/components/img/img.js +1 -1
  181. package/dist/collection/components/input/input.js +9 -5
  182. package/dist/collection/components/input/input.js.map +1 -1
  183. package/dist/collection/components/input-group/input-group.js +1 -1
  184. package/dist/collection/components/item/item.js +2 -2
  185. package/dist/collection/components/label/label.js +1 -1
  186. package/dist/collection/components/list/list.js +1 -1
  187. package/dist/collection/components/modal/modal.js +6 -4
  188. package/dist/collection/components/modal/modal.js.map +1 -1
  189. package/dist/collection/components/navbar/navbar.js +2 -2
  190. package/dist/collection/components/navbar-item/navbar-item.js +1 -1
  191. package/dist/collection/components/phone-number-input/phone-number-input.js +27 -19
  192. package/dist/collection/components/phone-number-input/phone-number-input.js.map +1 -1
  193. package/dist/collection/components/plate-number/plate-number.js +6 -4
  194. package/dist/collection/components/plate-number/plate-number.js.map +1 -1
  195. package/dist/collection/components/profil-dropdown/profil-dropdown.js +1 -1
  196. package/dist/collection/components/progress/progress.js +1 -1
  197. package/dist/collection/components/progress-indicator-horizontal/progress-indicator-horizontal.js +1 -1
  198. package/dist/collection/components/progress-indicator-vertical/progress-indicator-vertical.js +1 -1
  199. package/dist/collection/components/progress-indicator-vertical-item/progress-indicator-vertical-item.js +1 -1
  200. package/dist/collection/components/progress-tracker/progress-tracker.js +1 -1
  201. package/dist/collection/components/progress-tracker-item/progress-tracker-item.js +1 -1
  202. package/dist/collection/components/radio/radio.js +2 -2
  203. package/dist/collection/components/radio-group/radio-group.js +1 -1
  204. package/dist/collection/components/range/range.js +2 -2
  205. package/dist/collection/components/rating/rating.js +2 -2
  206. package/dist/collection/components/row/row.js +1 -1
  207. package/dist/collection/components/segmented-button/segmented-button.js +1 -1
  208. package/dist/collection/components/segmented-button-bar/segmented-button-bar.js +2 -2
  209. package/dist/collection/components/segmented-buttons/segmented-buttons.js +11 -6
  210. package/dist/collection/components/segmented-buttons/segmented-buttons.js.map +1 -1
  211. package/dist/collection/components/select/select.css +7 -3
  212. package/dist/collection/components/select/select.js +3 -2
  213. package/dist/collection/components/select/select.js.map +1 -1
  214. package/dist/collection/components/select-filter/select-filter.js +4 -3
  215. package/dist/collection/components/select-filter/select-filter.js.map +1 -1
  216. package/dist/collection/components/skeleton/skeleton.js +1 -1
  217. package/dist/collection/components/spinner/spinner.js +1 -1
  218. package/dist/collection/components/switch/switch.js +4 -3
  219. package/dist/collection/components/switch/switch.js.map +1 -1
  220. package/dist/collection/components/tab/tab.js +3 -2
  221. package/dist/collection/components/tab/tab.js.map +1 -1
  222. package/dist/collection/components/tab-bar/tab-bar.js +2 -2
  223. package/dist/collection/components/tab-button/tab-button.js +1 -1
  224. package/dist/collection/components/table/table.js +1 -1
  225. package/dist/collection/components/tabs/tabs.js +11 -6
  226. package/dist/collection/components/tabs/tabs.js.map +1 -1
  227. package/dist/collection/components/tag/tag.js +2 -2
  228. package/dist/collection/components/text/text.js +1 -1
  229. package/dist/collection/components/textarea/textarea.js +5 -3
  230. package/dist/collection/components/textarea/textarea.js.map +1 -1
  231. package/dist/collection/components/toast/toast.js +8 -5
  232. package/dist/collection/components/toast/toast.js.map +1 -1
  233. package/dist/collection/components/toggle/toggle.js +4 -3
  234. package/dist/collection/components/toggle/toggle.js.map +1 -1
  235. package/dist/collection/components/toolbar/toolbar.js +1 -1
  236. package/dist/collection/components/toolbar-title/toolbar-title.js +1 -1
  237. package/dist/collection/components/toolbar-title-page/toolbar-title-page.js +1 -1
  238. package/dist/collection/components/tooltip/tooltip.js +5 -3
  239. package/dist/collection/components/tooltip/tooltip.js.map +1 -1
  240. package/dist/collection/global/app.js +1 -1
  241. package/dist/esm/app-0d73779c.js +7 -0
  242. package/dist/esm/app-0d73779c.js.map +1 -0
  243. package/dist/esm/{focus-visible-75a2ea2a.js → focus-visible-32bc70bb.js} +1 -1
  244. package/dist/esm/focus-visible-32bc70bb.js.map +1 -0
  245. package/dist/esm/{index-4b484f35.js → index-6f4c3286.js} +409 -190
  246. package/dist/esm/index-6f4c3286.js.map +1 -0
  247. package/dist/esm/{index-8f45025b.js → index-891decf5.js} +1 -1
  248. package/dist/esm/index-891decf5.js.map +1 -0
  249. package/dist/esm/index.js +3 -3
  250. package/dist/esm/loader.js +5 -30
  251. package/dist/esm/loader.js.map +1 -1
  252. package/dist/esm/polyfill-dc7c89b2.js +7 -0
  253. package/dist/esm/polyfill-dc7c89b2.js.map +1 -0
  254. package/dist/esm/road-accordion.entry.js +3 -3
  255. package/dist/esm/road-accordion.entry.js.map +1 -1
  256. package/dist/esm/road-alert.entry.js +1 -1
  257. package/dist/esm/road-alert.entry.js.map +1 -1
  258. package/dist/esm/road-area-code.entry.js +9 -13
  259. package/dist/esm/road-area-code.entry.js.map +1 -1
  260. package/dist/esm/road-autocomplete.entry.js +1 -1
  261. package/dist/esm/road-autocomplete.entry.js.map +1 -1
  262. package/dist/esm/road-avatar.entry.js +1 -1
  263. package/dist/esm/road-avatar.entry.js.map +1 -1
  264. package/dist/esm/road-badge_14.entry.js +5 -5
  265. package/dist/esm/road-badge_14.entry.js.map +1 -1
  266. package/dist/esm/road-banner.entry.js +2 -2
  267. package/dist/esm/road-banner.entry.js.map +1 -1
  268. package/dist/esm/road-button-floating.entry.js +2 -2
  269. package/dist/esm/road-button-floating.entry.js.map +1 -1
  270. package/dist/esm/road-card.entry.js +1 -1
  271. package/dist/esm/road-card.entry.js.map +1 -1
  272. package/dist/esm/road-carousel-item.entry.js +1 -1
  273. package/dist/esm/road-carousel-item.entry.js.map +1 -1
  274. package/dist/esm/road-carousel.entry.js +2 -2
  275. package/dist/esm/road-carousel.entry.js.map +1 -1
  276. package/dist/esm/road-checkbox.entry.js +3 -3
  277. package/dist/esm/road-checkbox.entry.js.map +1 -1
  278. package/dist/esm/road-chip.entry.js +3 -3
  279. package/dist/esm/road-chip.entry.js.map +1 -1
  280. package/dist/esm/road-collapse.entry.js +1 -1
  281. package/dist/esm/road-collapse.entry.js.map +1 -1
  282. package/dist/esm/road-dialog.entry.js +2 -2
  283. package/dist/esm/road-dialog.entry.js.map +1 -1
  284. package/dist/esm/road-dropdown.entry.js +1 -1
  285. package/dist/esm/road-dropdown.entry.js.map +1 -1
  286. package/dist/esm/road-duration.entry.js +1 -1
  287. package/dist/esm/road-duration.entry.js.map +1 -1
  288. package/dist/esm/road-flap.entry.js +1 -1
  289. package/dist/esm/road-flap.entry.js.map +1 -1
  290. package/dist/esm/road-global-navigation.entry.js +2 -2
  291. package/dist/esm/road-global-navigation.entry.js.map +1 -1
  292. package/dist/esm/road-illustration.entry.js +2 -2
  293. package/dist/esm/road-illustration.entry.js.map +1 -1
  294. package/dist/esm/road-img.entry.js +1 -1
  295. package/dist/esm/road-img.entry.js.map +1 -1
  296. package/dist/esm/road-modal.entry.js +2 -2
  297. package/dist/esm/road-modal.entry.js.map +1 -1
  298. package/dist/esm/road-navbar-item.entry.js +1 -1
  299. package/dist/esm/road-navbar-item.entry.js.map +1 -1
  300. package/dist/esm/road-navbar.entry.js +2 -2
  301. package/dist/esm/road-navbar.entry.js.map +1 -1
  302. package/dist/esm/road-phone-number-input.entry.js +22 -16
  303. package/dist/esm/road-phone-number-input.entry.js.map +1 -1
  304. package/dist/esm/road-plate-number.entry.js +2 -2
  305. package/dist/esm/road-plate-number.entry.js.map +1 -1
  306. package/dist/esm/road-profil-dropdown.entry.js +1 -1
  307. package/dist/esm/road-profil-dropdown.entry.js.map +1 -1
  308. package/dist/esm/road-progress-indicator-horizontal.entry.js +1 -1
  309. package/dist/esm/road-progress-indicator-horizontal.entry.js.map +1 -1
  310. package/dist/esm/road-progress-indicator-vertical-item.entry.js +1 -1
  311. package/dist/esm/road-progress-indicator-vertical-item.entry.js.map +1 -1
  312. package/dist/esm/road-progress-indicator-vertical.entry.js +1 -1
  313. package/dist/esm/road-progress-indicator-vertical.entry.js.map +1 -1
  314. package/dist/esm/road-progress-tracker-item.entry.js +1 -1
  315. package/dist/esm/road-progress-tracker-item.entry.js.map +1 -1
  316. package/dist/esm/road-progress-tracker.entry.js +1 -1
  317. package/dist/esm/road-progress-tracker.entry.js.map +1 -1
  318. package/dist/esm/road-progress.entry.js +1 -1
  319. package/dist/esm/road-progress.entry.js.map +1 -1
  320. package/dist/esm/road-radio-group.entry.js +1 -1
  321. package/dist/esm/road-radio-group.entry.js.map +1 -1
  322. package/dist/esm/road-radio.entry.js +2 -2
  323. package/dist/esm/road-radio.entry.js.map +1 -1
  324. package/dist/esm/road-range.entry.js +2 -2
  325. package/dist/esm/road-range.entry.js.map +1 -1
  326. package/dist/esm/road-rating.entry.js +2 -2
  327. package/dist/esm/road-rating.entry.js.map +1 -1
  328. package/dist/esm/road-segmented-button-bar.entry.js +2 -2
  329. package/dist/esm/road-segmented-button-bar.entry.js.map +1 -1
  330. package/dist/esm/road-segmented-button.entry.js +1 -1
  331. package/dist/esm/road-segmented-button.entry.js.map +1 -1
  332. package/dist/esm/road-segmented-buttons.entry.js +1 -1
  333. package/dist/esm/road-segmented-buttons.entry.js.map +1 -1
  334. package/dist/esm/road-select-filter.entry.js +1 -1
  335. package/dist/esm/road-select-filter.entry.js.map +1 -1
  336. package/dist/esm/road-select.entry.js +2 -2
  337. package/dist/esm/road-select.entry.js.map +1 -1
  338. package/dist/esm/road-skeleton.entry.js +1 -1
  339. package/dist/esm/road-skeleton.entry.js.map +1 -1
  340. package/dist/esm/road-spinner.entry.js +1 -1
  341. package/dist/esm/road-spinner.entry.js.map +1 -1
  342. package/dist/esm/road-switch.entry.js +2 -2
  343. package/dist/esm/road-switch.entry.js.map +1 -1
  344. package/dist/esm/road-tab-bar.entry.js +2 -2
  345. package/dist/esm/road-tab-bar.entry.js.map +1 -1
  346. package/dist/esm/road-tab-button.entry.js +1 -1
  347. package/dist/esm/road-tab-button.entry.js.map +1 -1
  348. package/dist/esm/road-tab.entry.js +1 -1
  349. package/dist/esm/road-tab.entry.js.map +1 -1
  350. package/dist/esm/road-table.entry.js +1 -1
  351. package/dist/esm/road-table.entry.js.map +1 -1
  352. package/dist/esm/road-tabs.entry.js +1 -1
  353. package/dist/esm/road-tabs.entry.js.map +1 -1
  354. package/dist/esm/road-tag.entry.js +2 -2
  355. package/dist/esm/road-tag.entry.js.map +1 -1
  356. package/dist/esm/road-text.entry.js +1 -1
  357. package/dist/esm/road-text.entry.js.map +1 -1
  358. package/dist/esm/road-textarea.entry.js +1 -1
  359. package/dist/esm/road-textarea.entry.js.map +1 -1
  360. package/dist/esm/road-toast.entry.js +2 -2
  361. package/dist/esm/road-toast.entry.js.map +1 -1
  362. package/dist/esm/road-toggle.entry.js +2 -2
  363. package/dist/esm/road-toggle.entry.js.map +1 -1
  364. package/dist/esm/road-toolbar-title-page.entry.js +1 -1
  365. package/dist/esm/road-toolbar-title-page.entry.js.map +1 -1
  366. package/dist/esm/road-toolbar-title.entry.js +1 -1
  367. package/dist/esm/road-toolbar-title.entry.js.map +1 -1
  368. package/dist/esm/road-tooltip.entry.js +1 -1
  369. package/dist/esm/road-tooltip.entry.js.map +1 -1
  370. package/dist/esm/roadtrip.js +8 -104
  371. package/dist/esm/roadtrip.js.map +1 -1
  372. package/dist/esm/{utils-ff713b72.js → utils-c701b3c5.js} +2 -2
  373. package/dist/esm/utils-c701b3c5.js.map +1 -0
  374. package/dist/esm/{utils-7f4988b4.js → utils-e14866b1.js} +2 -2
  375. package/dist/esm/utils-e14866b1.js.map +1 -0
  376. package/dist/html.html-data.json +71 -75
  377. package/dist/loader/index.d.ts +1 -1
  378. package/dist/roadtrip/index.esm.js +1 -1
  379. package/dist/roadtrip/p-02e5c9b9.js +2 -0
  380. package/dist/roadtrip/p-02e5c9b9.js.map +1 -0
  381. package/dist/roadtrip/{p-a32c7889.entry.js → p-07acda2d.entry.js} +2 -2
  382. package/dist/roadtrip/p-07acda2d.entry.js.map +1 -0
  383. package/dist/roadtrip/{p-c259efd7.js → p-08ff1520.js} +2 -2
  384. package/dist/roadtrip/p-08ff1520.js.map +1 -0
  385. package/dist/roadtrip/p-0d2e2bd5.entry.js +2 -0
  386. package/dist/roadtrip/p-0d2e2bd5.entry.js.map +1 -0
  387. package/dist/roadtrip/{p-73df1bef.entry.js → p-0d843c2f.entry.js} +2 -2
  388. package/dist/roadtrip/p-0d843c2f.entry.js.map +1 -0
  389. package/dist/roadtrip/{p-48596f8f.entry.js → p-0f707073.entry.js} +2 -2
  390. package/dist/roadtrip/p-0f707073.entry.js.map +1 -0
  391. package/dist/roadtrip/{p-ff52872b.entry.js → p-12deb278.entry.js} +2 -2
  392. package/dist/roadtrip/p-12deb278.entry.js.map +1 -0
  393. package/dist/roadtrip/p-16ae7b09.entry.js +2 -0
  394. package/dist/roadtrip/p-16ae7b09.entry.js.map +1 -0
  395. package/dist/roadtrip/p-1ccae339.js +2 -0
  396. package/dist/roadtrip/p-1ccae339.js.map +1 -0
  397. package/dist/roadtrip/{p-93030cec.entry.js → p-1dabbcf4.entry.js} +2 -2
  398. package/dist/roadtrip/p-1dabbcf4.entry.js.map +1 -0
  399. package/dist/roadtrip/{p-4993da93.entry.js → p-228cd0a9.entry.js} +2 -2
  400. package/dist/roadtrip/p-228cd0a9.entry.js.map +1 -0
  401. package/dist/roadtrip/{p-8f802447.entry.js → p-23b7a51a.entry.js} +2 -2
  402. package/dist/roadtrip/p-23b7a51a.entry.js.map +1 -0
  403. package/dist/roadtrip/{p-0bcf6d63.entry.js → p-259c14bf.entry.js} +2 -2
  404. package/dist/roadtrip/p-259c14bf.entry.js.map +1 -0
  405. package/dist/roadtrip/{p-cd2e8f0a.entry.js → p-29291680.entry.js} +2 -2
  406. package/dist/roadtrip/p-29291680.entry.js.map +1 -0
  407. package/dist/roadtrip/{p-35ffaa87.entry.js → p-2a663f88.entry.js} +2 -2
  408. package/dist/roadtrip/p-2a663f88.entry.js.map +1 -0
  409. package/dist/roadtrip/p-2a6add06.entry.js +2 -0
  410. package/dist/roadtrip/p-2a6add06.entry.js.map +1 -0
  411. package/dist/roadtrip/{p-a484102a.entry.js → p-2b8890d2.entry.js} +2 -2
  412. package/dist/roadtrip/p-2b8890d2.entry.js.map +1 -0
  413. package/dist/roadtrip/p-2c6c964c.entry.js +2 -0
  414. package/dist/roadtrip/p-2c6c964c.entry.js.map +1 -0
  415. package/dist/roadtrip/{p-66a9a6e8.entry.js → p-2d66c347.entry.js} +2 -2
  416. package/dist/roadtrip/p-2d66c347.entry.js.map +1 -0
  417. package/dist/roadtrip/{p-21c20210.entry.js → p-387df35b.entry.js} +2 -2
  418. package/dist/roadtrip/p-387df35b.entry.js.map +1 -0
  419. package/dist/roadtrip/p-3a1da784.entry.js +2 -0
  420. package/dist/roadtrip/p-3a1da784.entry.js.map +1 -0
  421. package/dist/roadtrip/{p-29ff2bcd.entry.js → p-3ae65dd3.entry.js} +2 -2
  422. package/dist/roadtrip/p-3ae65dd3.entry.js.map +1 -0
  423. package/dist/roadtrip/{p-1caeda78.entry.js → p-3ae697d0.entry.js} +2 -2
  424. package/dist/roadtrip/p-3ae697d0.entry.js.map +1 -0
  425. package/dist/roadtrip/{p-ebe3c26a.entry.js → p-3c0f880b.entry.js} +2 -2
  426. package/dist/roadtrip/p-3c0f880b.entry.js.map +1 -0
  427. package/dist/roadtrip/p-3f838866.entry.js +2 -0
  428. package/dist/roadtrip/{p-7589e2bb.entry.js.map → p-3f838866.entry.js.map} +1 -1
  429. package/dist/roadtrip/{p-7c4b331c.entry.js → p-446a0bdd.entry.js} +2 -2
  430. package/dist/roadtrip/p-446a0bdd.entry.js.map +1 -0
  431. package/dist/roadtrip/{p-1baffcc2.entry.js → p-4f719c90.entry.js} +2 -2
  432. package/dist/roadtrip/p-4f719c90.entry.js.map +1 -0
  433. package/dist/roadtrip/{p-b34aba1a.js → p-5b56c57a.js} +2 -2
  434. package/dist/roadtrip/p-5b56c57a.js.map +1 -0
  435. package/dist/roadtrip/{p-5f4779b1.entry.js → p-5ea7d274.entry.js} +2 -2
  436. package/dist/roadtrip/p-5ea7d274.entry.js.map +1 -0
  437. package/dist/roadtrip/{p-43bdbf0a.entry.js → p-5ee02be9.entry.js} +2 -2
  438. package/dist/roadtrip/p-5ee02be9.entry.js.map +1 -0
  439. package/dist/roadtrip/p-6475c1af.js +3 -0
  440. package/dist/roadtrip/p-6475c1af.js.map +1 -0
  441. package/dist/roadtrip/{p-37ab7c7f.js → p-73fe2357.js} +1 -1
  442. package/dist/roadtrip/p-73fe2357.js.map +1 -0
  443. package/dist/roadtrip/{p-e68a3ae5.entry.js → p-785bcbdf.entry.js} +2 -2
  444. package/dist/roadtrip/p-785bcbdf.entry.js.map +1 -0
  445. package/dist/roadtrip/{p-ee0196ea.entry.js → p-7ac13838.entry.js} +2 -2
  446. package/dist/roadtrip/p-7ac13838.entry.js.map +1 -0
  447. package/dist/roadtrip/{p-9432708d.entry.js → p-7d6a3545.entry.js} +2 -2
  448. package/dist/roadtrip/p-7d6a3545.entry.js.map +1 -0
  449. package/dist/roadtrip/{p-b7d3dc1a.entry.js → p-7efd47c7.entry.js} +2 -2
  450. package/dist/roadtrip/p-7efd47c7.entry.js.map +1 -0
  451. package/dist/roadtrip/p-80f116bd.entry.js +2 -0
  452. package/dist/roadtrip/p-80f116bd.entry.js.map +1 -0
  453. package/dist/roadtrip/{p-0d99a5e7.entry.js → p-8359b71f.entry.js} +2 -2
  454. package/dist/roadtrip/p-8359b71f.entry.js.map +1 -0
  455. package/dist/roadtrip/p-86219824.entry.js +2 -0
  456. package/dist/roadtrip/p-86219824.entry.js.map +1 -0
  457. package/dist/roadtrip/{p-5a4f9085.entry.js → p-8f19a8a3.entry.js} +2 -2
  458. package/dist/roadtrip/p-8f19a8a3.entry.js.map +1 -0
  459. package/dist/roadtrip/{p-b4dc061d.entry.js → p-9896b270.entry.js} +2 -2
  460. package/dist/roadtrip/p-9896b270.entry.js.map +1 -0
  461. package/dist/roadtrip/p-9c86d7cd.entry.js +2 -0
  462. package/dist/roadtrip/p-9c86d7cd.entry.js.map +1 -0
  463. package/dist/roadtrip/{p-3604d557.entry.js → p-a38be966.entry.js} +2 -2
  464. package/dist/roadtrip/p-a38be966.entry.js.map +1 -0
  465. package/dist/roadtrip/{p-2d01d350.entry.js → p-a5f7b2f1.entry.js} +2 -2
  466. package/dist/roadtrip/p-a5f7b2f1.entry.js.map +1 -0
  467. package/dist/roadtrip/{p-c8e9807b.entry.js → p-aac728cd.entry.js} +2 -2
  468. package/dist/roadtrip/p-aac728cd.entry.js.map +1 -0
  469. package/dist/roadtrip/{p-6598e293.entry.js → p-b1ba207d.entry.js} +2 -2
  470. package/dist/roadtrip/p-b1ba207d.entry.js.map +1 -0
  471. package/dist/roadtrip/{p-093973f5.entry.js → p-b2f014a6.entry.js} +2 -2
  472. package/dist/roadtrip/p-b2f014a6.entry.js.map +1 -0
  473. package/dist/roadtrip/{p-9419bdaf.entry.js → p-b555fa35.entry.js} +2 -2
  474. package/dist/roadtrip/p-b555fa35.entry.js.map +1 -0
  475. package/dist/roadtrip/{p-8e216f6a.entry.js → p-b8fb46b2.entry.js} +2 -2
  476. package/dist/roadtrip/p-b8fb46b2.entry.js.map +1 -0
  477. package/dist/roadtrip/p-bb6453af.entry.js +2 -0
  478. package/dist/roadtrip/p-bb6453af.entry.js.map +1 -0
  479. package/dist/roadtrip/{p-439e1124.entry.js → p-bcb6f48c.entry.js} +2 -2
  480. package/dist/roadtrip/p-bcb6f48c.entry.js.map +1 -0
  481. package/dist/roadtrip/{p-1974c993.entry.js → p-bf8336f1.entry.js} +2 -2
  482. package/dist/roadtrip/p-bf8336f1.entry.js.map +1 -0
  483. package/dist/roadtrip/{p-9036a1e6.entry.js → p-c29ce7c5.entry.js} +2 -2
  484. package/dist/roadtrip/p-c29ce7c5.entry.js.map +1 -0
  485. package/dist/roadtrip/p-ca775aae.entry.js +2 -0
  486. package/dist/roadtrip/p-ca775aae.entry.js.map +1 -0
  487. package/dist/roadtrip/p-d5d248f0.entry.js +2 -0
  488. package/dist/roadtrip/p-d5d248f0.entry.js.map +1 -0
  489. package/dist/roadtrip/{p-7ec2d494.js → p-d637bb99.js} +2 -2
  490. package/dist/roadtrip/p-d637bb99.js.map +1 -0
  491. package/dist/roadtrip/{p-4fd8c4db.entry.js → p-e2962889.entry.js} +2 -2
  492. package/dist/roadtrip/p-e2962889.entry.js.map +1 -0
  493. package/dist/roadtrip/p-e345ea12.entry.js +2 -0
  494. package/dist/roadtrip/p-e345ea12.entry.js.map +1 -0
  495. package/dist/roadtrip/{p-9dd06f01.entry.js → p-f13ca352.entry.js} +2 -2
  496. package/dist/roadtrip/p-f13ca352.entry.js.map +1 -0
  497. package/dist/roadtrip/{p-b259fee3.entry.js → p-f2bf9a16.entry.js} +2 -2
  498. package/dist/roadtrip/p-f2bf9a16.entry.js.map +1 -0
  499. package/dist/roadtrip/{p-cb254685.entry.js → p-f37fb739.entry.js} +2 -2
  500. package/dist/roadtrip/p-f37fb739.entry.js.map +1 -0
  501. package/dist/roadtrip/{p-650eb7fb.entry.js → p-fbc784aa.entry.js} +2 -2
  502. package/dist/roadtrip/p-fbc784aa.entry.js.map +1 -0
  503. package/dist/roadtrip/{p-91e92e99.entry.js → p-fcaa01f5.entry.js} +2 -2
  504. package/dist/roadtrip/p-fcaa01f5.entry.js.map +1 -0
  505. package/dist/roadtrip/{p-295a97d7.entry.js → p-fcf97829.entry.js} +2 -2
  506. package/dist/roadtrip/p-fcf97829.entry.js.map +1 -0
  507. package/dist/roadtrip/{p-ff473633.entry.js → p-fdf158a0.entry.js} +2 -2
  508. package/dist/roadtrip/p-fdf158a0.entry.js.map +1 -0
  509. package/dist/roadtrip/roadtrip.esm.js +1 -1
  510. package/dist/roadtrip/roadtrip.esm.js.map +1 -1
  511. package/dist/roadtrip/svg/vehicle-car-search-color.svg +1 -1
  512. package/dist/types/components/area-code/area-code.d.ts +4 -7
  513. package/dist/types/components.d.ts +571 -12
  514. package/dist/types/stencil-public-runtime.d.ts +38 -5
  515. package/hydrate/index.d.ts +6 -6
  516. package/hydrate/index.js +277 -216
  517. package/package.json +2 -2
  518. package/dist/cjs/app-d9e5adfa.js.map +0 -1
  519. package/dist/cjs/css-shim-68410b74.js +0 -8
  520. package/dist/cjs/css-shim-68410b74.js.map +0 -1
  521. package/dist/cjs/dom-225fc508.js +0 -77
  522. package/dist/cjs/dom-225fc508.js.map +0 -1
  523. package/dist/cjs/focus-visible-6771892b.js.map +0 -1
  524. package/dist/cjs/index-e4bd5b5f.js.map +0 -1
  525. package/dist/cjs/index-fd07207a.js.map +0 -1
  526. package/dist/cjs/polyfill-9453e116.js.map +0 -1
  527. package/dist/cjs/shadow-css-3c339190.js +0 -391
  528. package/dist/cjs/shadow-css-3c339190.js.map +0 -1
  529. package/dist/cjs/utils-5203d152.js.map +0 -1
  530. package/dist/cjs/utils-a450bad3.js.map +0 -1
  531. package/dist/esm/app-a8a6f02a.js +0 -7
  532. package/dist/esm/app-a8a6f02a.js.map +0 -1
  533. package/dist/esm/css-shim-fa54d62f.js +0 -6
  534. package/dist/esm/css-shim-fa54d62f.js.map +0 -1
  535. package/dist/esm/dom-8de30773.js +0 -75
  536. package/dist/esm/dom-8de30773.js.map +0 -1
  537. package/dist/esm/focus-visible-75a2ea2a.js.map +0 -1
  538. package/dist/esm/index-4b484f35.js.map +0 -1
  539. package/dist/esm/index-8f45025b.js.map +0 -1
  540. package/dist/esm/polyfill-ab80527b.js +0 -7
  541. package/dist/esm/polyfill-ab80527b.js.map +0 -1
  542. package/dist/esm/polyfills/css-shim.js +0 -1
  543. package/dist/esm/shadow-css-af2290df.js +0 -389
  544. package/dist/esm/shadow-css-af2290df.js.map +0 -1
  545. package/dist/esm/utils-7f4988b4.js.map +0 -1
  546. package/dist/esm/utils-ff713b72.js.map +0 -1
  547. package/dist/roadtrip/p-00cfef9b.js +0 -22
  548. package/dist/roadtrip/p-00cfef9b.js.map +0 -1
  549. package/dist/roadtrip/p-093973f5.entry.js.map +0 -1
  550. package/dist/roadtrip/p-0bcf6d63.entry.js.map +0 -1
  551. package/dist/roadtrip/p-0d99a5e7.entry.js.map +0 -1
  552. package/dist/roadtrip/p-125c777f.entry.js +0 -2
  553. package/dist/roadtrip/p-125c777f.entry.js.map +0 -1
  554. package/dist/roadtrip/p-16285738.entry.js +0 -2
  555. package/dist/roadtrip/p-16285738.entry.js.map +0 -1
  556. package/dist/roadtrip/p-170a82e1.entry.js +0 -2
  557. package/dist/roadtrip/p-170a82e1.entry.js.map +0 -1
  558. package/dist/roadtrip/p-1974c993.entry.js.map +0 -1
  559. package/dist/roadtrip/p-198f586b.entry.js +0 -2
  560. package/dist/roadtrip/p-198f586b.entry.js.map +0 -1
  561. package/dist/roadtrip/p-1baffcc2.entry.js.map +0 -1
  562. package/dist/roadtrip/p-1caeda78.entry.js.map +0 -1
  563. package/dist/roadtrip/p-214218dd.entry.js +0 -2
  564. package/dist/roadtrip/p-214218dd.entry.js.map +0 -1
  565. package/dist/roadtrip/p-21c20210.entry.js.map +0 -1
  566. package/dist/roadtrip/p-295a97d7.entry.js.map +0 -1
  567. package/dist/roadtrip/p-298a51a3.js +0 -2
  568. package/dist/roadtrip/p-298a51a3.js.map +0 -1
  569. package/dist/roadtrip/p-29ff2bcd.entry.js.map +0 -1
  570. package/dist/roadtrip/p-2d01d350.entry.js.map +0 -1
  571. package/dist/roadtrip/p-35ffaa87.entry.js.map +0 -1
  572. package/dist/roadtrip/p-3604d557.entry.js.map +0 -1
  573. package/dist/roadtrip/p-37ab7c7f.js.map +0 -1
  574. package/dist/roadtrip/p-38597e21.entry.js +0 -2
  575. package/dist/roadtrip/p-38597e21.entry.js.map +0 -1
  576. package/dist/roadtrip/p-439e1124.entry.js.map +0 -1
  577. package/dist/roadtrip/p-43bdbf0a.entry.js.map +0 -1
  578. package/dist/roadtrip/p-48596f8f.entry.js.map +0 -1
  579. package/dist/roadtrip/p-4993da93.entry.js.map +0 -1
  580. package/dist/roadtrip/p-4fd8c4db.entry.js.map +0 -1
  581. package/dist/roadtrip/p-50daca95.js +0 -13
  582. package/dist/roadtrip/p-50daca95.js.map +0 -1
  583. package/dist/roadtrip/p-564f4f31.entry.js +0 -2
  584. package/dist/roadtrip/p-564f4f31.entry.js.map +0 -1
  585. package/dist/roadtrip/p-5a4f9085.entry.js.map +0 -1
  586. package/dist/roadtrip/p-5f4779b1.entry.js.map +0 -1
  587. package/dist/roadtrip/p-62c563db.entry.js +0 -2
  588. package/dist/roadtrip/p-62c563db.entry.js.map +0 -1
  589. package/dist/roadtrip/p-650eb7fb.entry.js.map +0 -1
  590. package/dist/roadtrip/p-6598e293.entry.js.map +0 -1
  591. package/dist/roadtrip/p-66a9a6e8.entry.js.map +0 -1
  592. package/dist/roadtrip/p-73df1bef.entry.js.map +0 -1
  593. package/dist/roadtrip/p-7589e2bb.entry.js +0 -2
  594. package/dist/roadtrip/p-7c4b331c.entry.js.map +0 -1
  595. package/dist/roadtrip/p-7ec2d494.js.map +0 -1
  596. package/dist/roadtrip/p-8e216f6a.entry.js.map +0 -1
  597. package/dist/roadtrip/p-8f802447.entry.js.map +0 -1
  598. package/dist/roadtrip/p-9036a1e6.entry.js.map +0 -1
  599. package/dist/roadtrip/p-91e92e99.entry.js.map +0 -1
  600. package/dist/roadtrip/p-93030cec.entry.js.map +0 -1
  601. package/dist/roadtrip/p-9419bdaf.entry.js.map +0 -1
  602. package/dist/roadtrip/p-9432708d.entry.js.map +0 -1
  603. package/dist/roadtrip/p-9dd06f01.entry.js.map +0 -1
  604. package/dist/roadtrip/p-a32c7889.entry.js.map +0 -1
  605. package/dist/roadtrip/p-a484102a.entry.js.map +0 -1
  606. package/dist/roadtrip/p-abdbf6ac.js +0 -3
  607. package/dist/roadtrip/p-abdbf6ac.js.map +0 -1
  608. package/dist/roadtrip/p-b259fee3.entry.js.map +0 -1
  609. package/dist/roadtrip/p-b2cc540b.entry.js +0 -2
  610. package/dist/roadtrip/p-b2cc540b.entry.js.map +0 -1
  611. package/dist/roadtrip/p-b34aba1a.js.map +0 -1
  612. package/dist/roadtrip/p-b4dc061d.entry.js.map +0 -1
  613. package/dist/roadtrip/p-b5727aae.entry.js +0 -2
  614. package/dist/roadtrip/p-b5727aae.entry.js.map +0 -1
  615. package/dist/roadtrip/p-b7d3dc1a.entry.js.map +0 -1
  616. package/dist/roadtrip/p-c259efd7.js.map +0 -1
  617. package/dist/roadtrip/p-c56fe023.entry.js +0 -2
  618. package/dist/roadtrip/p-c56fe023.entry.js.map +0 -1
  619. package/dist/roadtrip/p-c8e9807b.entry.js.map +0 -1
  620. package/dist/roadtrip/p-cb254685.entry.js.map +0 -1
  621. package/dist/roadtrip/p-cd2e8f0a.entry.js.map +0 -1
  622. package/dist/roadtrip/p-e68a3ae5.entry.js.map +0 -1
  623. package/dist/roadtrip/p-e8c090a5.js +0 -2
  624. package/dist/roadtrip/p-e8c090a5.js.map +0 -1
  625. package/dist/roadtrip/p-ebe3c26a.entry.js.map +0 -1
  626. package/dist/roadtrip/p-ee0196ea.entry.js.map +0 -1
  627. package/dist/roadtrip/p-f671758f.entry.js +0 -2
  628. package/dist/roadtrip/p-f671758f.entry.js.map +0 -1
  629. package/dist/roadtrip/p-fa98320c.js +0 -2
  630. package/dist/roadtrip/p-fa98320c.js.map +0 -1
  631. package/dist/roadtrip/p-ff473633.entry.js.map +0 -1
  632. package/dist/roadtrip/p-ff52872b.entry.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"names":["tooltipCss","Tooltip","this","onClick","hasTrigger","isOpen","close","open","onMouseOver","onMouseOut","tooltipIds","async","triggerType","triggers","trigger","split","includes","render","h","Host","position","tooltipId","part","id","class","tooltip","role","content","name"],"sources":["./src/components/tooltip/tooltip.css?tag=road-tooltip&encapsulation=shadow","./src/components/tooltip/tooltip.tsx"],"sourcesContent":["/*\n * Tooltip\n *\n * Index\n * - Tooltip\n * - Position\n */\n\n/**\n * @prop --max-width: The maximum width of the tooltip.\n * @prop --z-index: The z-index of the tooltip.\n * @prop --width: width of the tooltip.\n */\n\n/* TOOLTIP\n -------------------- */\n\n:host {\n --max-width: 16rem;\n --z-index: 1;\n --width: auto;\n\n position: relative;\n display: inline-block;\n}\n\n:host([trigger=\"hover\"]) .tooltip {\n display: none;\n}\n\n@media (min-width: 1200px) {\n\n :host([trigger=\"hover\"]) .tooltip {\n display: block;\n }\n}\n\n.tooltip {\n position: absolute;\n top: -0.5rem;\n left: 50%;\n z-index: 1;\n width: var(--width);\n min-width: 6rem;\n max-width: var(--max-width);\n padding: 0.5rem;\n font-family: var(--road-font);\n font-size: var(--road-body-small);\n color: var(--road-on-surface);\n text-align: center;\n pointer-events: none;\n background: var(--road-surface);\n border: 1px solid var(--road-outline-weak);\n border-radius: 0.25rem;\n box-shadow: var(--road-elevation-low);\n opacity: 0;\n transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;\n transform: translateX(-50%) translateY(-100%);\n}\n\n:host([contentalign=\"left\"]) .tooltip {\n text-align: left;\n}\n\n.tooltip.tooltip-text-left::after {\n text-align: left;\n}\n\n.tooltip-open {\n opacity: 1;\n}\n\n/* POSITION\n -------------------- */\n\n/**\n * Top\n */\n\n:host([data-tooltip-position=\"top\"]) .tooltip {\n left: 50%;\n transform: translateX(-50%) translateY(-70%);\n}\n\n:host([data-tooltip-position=\"top\"]) .tooltip-open {\n left: 50%;\n transform: translateX(-50%) translateY(-100%);\n}\n\n/**\n * Left\n */\n\n:host([data-tooltip-position=\"left\"]) .tooltip {\n top: 50%;\n left: 0%;\n margin-right: 0.5rem;\n transform: translateX(-94%) translateY(-55%);\n}\n\n:host([data-tooltip-position=\"left\"]) .tooltip-open {\n transform: translateX(-103%) translateY(-55%);\n}\n\n/**\n * Bottom\n */\n\n:host([data-tooltip-position=\"bottom\"]) .tooltip {\n top: 100%;\n left: 50%;\n margin-top: 0.5rem;\n transform: translateX(-50%) translateY(-40%);\n}\n\n:host([data-tooltip-position=\"bottom\"]) .tooltip-open {\n transform: translateX(-50%) translateY(-6%);\n}\n\n/**\n * Right\n */\n\n:host([data-tooltip-position=\"right\"]) .tooltip {\n top: 50%;\n left: 100%;\n margin-left: 0.5rem;\n transform: translateX(-14%) translateY(-55%);\n}\n\n:host([data-tooltip-position=\"right\"]) .tooltip-open {\n transform: translateX(-4%) translateY(-55%);\n}\n","import { Component, Host, h, Prop, Method, Element } from '@stencil/core';\n\n/**\n * @slot tooltip-content - content of the tooltip, if you need to add html content, use this slot, otherwise use directly the content prop.\n *\n * @part tooltip - tooltip container\n */\n\n@Component({\n tag: 'road-tooltip',\n styleUrl: 'tooltip.css',\n shadow: true,\n})\nexport class Tooltip {\n\n @Element() el!: HTMLRoadTooltipElement;\n\n /**\n * The id of tooltip\n */\n @Prop() tooltipId: string = `road-tooltip-${++tooltipIds}`;\n\n /**\n * The tooltip's content.\n */\n @Prop() content = '';\n\n /**\n * The position of the tooltip.\n */\n @Prop() position:\n | 'top'\n | 'right'\n | 'bottom'\n | 'left' = 'top';\n\n /**\n * The content align of the tooltip.\n */\n @Prop() contentAlign:\n | 'center'\n | 'left' = 'center';\n\n /**\n * Indicates whether or not the tooltip is open. You can use this or the open/close methods.\n */\n @Prop({ mutable: true }) isOpen = false;\n\n /**\n * Controls how the tooltip is activated. Possible options include `click`, `hover`. Multiple\n * options can be passed by separating them with a space. When manual is used, the tooltip must be activated\n * programmatically.\n */\n @Prop() trigger: string = 'hover';\n\n /**\n * Open the tooltip.\n */\n @Method()\n async open() {\n this.isOpen = true;\n }\n\n /**\n * Close the tooltip.\n */\n @Method()\n async close() {\n this.isOpen = false;\n }\n\n private onClick = () => {\n if (this.hasTrigger('click')) {\n this.isOpen ? this.close() : this.open();\n }\n };\n\n private onMouseOver = () => {\n if (this.hasTrigger('hover')) {\n this.open();\n }\n };\n\n private onMouseOut = () => {\n if (this.hasTrigger('hover')) {\n this.close();\n }\n };\n\n private hasTrigger(triggerType: string) {\n const triggers = this.trigger.split(' ');\n return triggers.includes(triggerType);\n }\n\n render() {\n return (\n <Host\n onMouseOver={this.onMouseOver}\n onMouseOut={this.onMouseOut}\n onClick={this.onClick}\n data-tooltip-position={this.position}\n >\n <slot aria-describedby={this.tooltipId} />\n\n <div\n part=\"tooltip\"\n id={this.tooltipId}\n class={{\n tooltip: true,\n 'tooltip-open': this.isOpen,\n }}\n role=\"tooltip\"\n aria-hidden={!this.isOpen}\n >\n {this.content}\n <slot name=\"tooltip-content\" />\n </div>\n </Host>\n );\n }\n}\n\nlet tooltipIds = 0;\n"],"mappings":"yDAAA,MAAMA,EAAa,usD,MCaNC,EAAO,M,yBA0DVC,KAAAC,QAAU,KAChB,GAAID,KAAKE,WAAW,SAAU,CAC5BF,KAAKG,OAASH,KAAKI,QAAUJ,KAAKK,M,GAI9BL,KAAAM,YAAc,KACpB,GAAIN,KAAKE,WAAW,SAAU,CAC5BF,KAAKK,M,GAIDL,KAAAO,WAAa,KACnB,GAAIP,KAAKE,WAAW,SAAU,CAC5BF,KAAKI,O,kBAjEmB,kBAAkBI,I,aAK5B,G,cASL,M,kBAOA,S,YAKqB,M,aAOR,O,CAM1BC,aACET,KAAKG,OAAS,I,CAOhBM,cACET,KAAKG,OAAS,K,CAqBRD,WAAWQ,GACjB,MAAMC,EAAWX,KAAKY,QAAQC,MAAM,KACpC,OAAOF,EAASG,SAASJ,E,CAG3BK,SACE,OACEC,EAACC,EAAI,CACHX,YAAaN,KAAKM,YAClBC,WAAYP,KAAKO,WACjBN,QAASD,KAAKC,QAAO,wBACED,KAAKkB,UAE5BF,EAAA,2BAAwBhB,KAAKmB,YAE7BH,EAAA,OACEI,KAAK,UACLC,GAAIrB,KAAKmB,UACTG,MAAO,CACLC,QAAS,KACT,eAAgBvB,KAAKG,QAEvBqB,KAAK,UAAS,eACAxB,KAAKG,QAElBH,KAAKyB,QACNT,EAAA,QAAMU,KAAK,qB,2BAOrB,IAAIlB,EAAa,E"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["toggleCss","toggle","this","onClick","checked","onFocus","roadfocus","emit","roadFocus","onBlur","roadBlur","roadblur","toggleIds","toggleId","checkedChanged","isChecked","roadchange","value","roadChange","render","labelId","textLabel","h","class","id","htmlFor","label","colorClass","color","undefined","isSpacedClass","isSpaced","righttoggleClass","hasLeftLabel","Host","type","name","disabled","off","on"],"sources":["./src/components/toggle/toggle.css?tag=road-toggle&encapsulation=scoped","./src/components/toggle/toggle.tsx"],"sourcesContent":["/*\n * Toggle\n *\n * For accessibility, we provide a style for focus only on Tab,\n * for that add the javascript polyfill for focus-visible\n * (https://github.com/WICG/focus-visible).\n *\n * Index\n * - Toggle\n * - Label\n * - Lever\n * - Feedback\n * - Position\n */\n\n/**\n * @prop --toggle-lever-width: width of the lever\n */\n\n/* toggle\n -------------------- */\n\n:host {\n --toggle-lever-width: 4.5rem;\n\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n font-size: var(--road-label-medium);\n color: var(--road-on-surface);\n}\n\n/**\n * Hide input\n */\n\n.form-toggle-input {\n position: absolute;\n z-index: -1;\n opacity: 0;\n}\n\n/* LABEL\n -------------------- */\n\n.form-toggle-label {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n/* LEVER\n -------------------- */\n\n.form-toggle-lever {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n width: var(--toggle-lever-width);\n height: 2rem;\n padding: 0.5rem 0.625rem;\n margin-right: 0.75rem;\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1.6;\n content: \"\";\n background: var(--road-on-surface-extra-weak);\n border: 0.125rem solid transparent;\n border-radius: 1.125rem;\n transition: background 0.2s ease-in-out;\n}\n\n/**\n * Text in the toggle widget\n */\n\n.form-toggle-lever::before {\n font-size: 0.625rem;\n font-weight: 700;\n color: var(--road-surface);\n text-transform: uppercase;\n content: attr(data-off);\n}\n\n/**\n * Round lever in the widget\n */\n\n.form-toggle-lever::after {\n position: absolute;\n top: 0.0625rem;\n left: 0.0625rem;\n display: block;\n width: 1.625rem;\n height: 1.625rem;\n content: \"\";\n background: var(--road-on-success-surface-inverse);\n border-radius: 50%;\n box-shadow: var(--road-elevation-low);\n transition: transform 0.2s ease-in-out;\n}\n\n/**\n * Checked state\n */\n\n.form-toggle-input:checked ~ .form-toggle-label .form-toggle-lever {\n justify-content: flex-start;\n background: var(--road-success-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-label .form-toggle-lever::before {\n color: var(--road-surface);\n content: attr(data-on);\n}\n\n.form-toggle-input:checked ~ .form-toggle-label .form-toggle-lever::after {\n transform: translateX(calc(var(--toggle-lever-width) - 2rem));\n}\n\n/**\n * Focus on Tab\n */\n\n.form-toggle-input.focus-visible ~ .form-toggle-label .form-toggle-lever {\n box-shadow: 0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-primary);\n}\n\n/* FEEDBACK\n -------------------- */\n\n/**\n * Secondary\n */\n\n.form-toggle-input:checked ~ .form-toggle-secondary .form-toggle-lever {\n background: var(--road-secondary);\n}\n\n.form-toggle-input:checked ~ .form-toggle-secondary .form-toggle-lever::before {\n color: var(--road-surface);\n}\n\n/**\n * Info\n */\n\n.form-toggle-input:checked ~ .form-toggle-info .form-toggle-lever {\n background: var(--road-info-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-info .form-toggle-lever::before {\n color: var(--road-surface);\n}\n\n/**\n * Success\n */\n\n.form-toggle-input:checked ~ .form-toggle-success .form-toggle-lever {\n background: var(--road-success-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-success .form-toggle-lever::before {\n color: var(--road-surface);\n}\n\n/**\n * Warning\n */\n\n.form-toggle-input:checked ~ .form-toggle-warning .form-toggle-lever {\n background: var(--road-warning-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-warning .form-toggle-lever::before {\n color: var(--road-on-warning-surface-inverse);\n}\n\n/**\n * Danger\n */\n\n.form-toggle-input:checked ~ .form-toggle-danger .form-toggle-lever {\n background: var(--road-danger-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-danger .form-toggle-lever::before {\n color: var(--road-surface);\n}\n\n/* POSITION\n -------------------- */\n\n.form-toggle-right {\n margin-right: 0;\n margin-left: 0.75rem;\n}\n\n.form-toggle-spaced {\n display: flex;\n justify-content: space-between;\n}\n","import { Component, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\nimport '../../utils/polyfill';\n\nimport { FeedbackColors } from '../../interface';\n\n@Component({\n tag: 'road-toggle',\n styleUrl: 'toggle.css',\n scoped: true,\n})\nexport class toggle {\n\n /**\n * The id of toggle\n */\n @Prop() toggleId: string = `road-toggle-${toggleIds++}`;\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name: string = this.toggleId;\n\n /**\n * If `true`, the toggle is checked.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * If `true`, the user cannot interact with the toggle.\n */\n @Prop() disabled = false;\n\n /**\n * Label for the field\n */\n @Prop() label: string = `${this.toggleId}-label`;\n\n /**\n * Set the color of alert. e.g. info, success, warning, danger\n */\n @Prop() color?: 'success' | FeedbackColors = 'success';\n\n /**\n * If `true`, the label is at left of the toggle\n */\n @Prop() hasLeftLabel: boolean = false;\n\n /**\n * Add space between label and toggle element\n */\n @Prop() isSpaced: boolean = false;\n\n /**\n * Value the form will get\n */\n @Prop() value: string = 'on';\n\n /**\n * Text display for \"`on`\" state in the toggle lever\n */\n @Prop() on: string = \"yes\";\n\n /**\n * Text display for \"`off`\" state in the toggle lever\n */\n @Prop() off: string = \"no\";\n\n /**\n * Emitted when the checked property has changed.\n */\n @Event() roadchange!: EventEmitter<{\n checked: boolean;\n value: string | undefined | null\n }>;\n /** @internal */\n @Event() roadChange!: EventEmitter<{\n checked: boolean;\n value: string | undefined | null\n }>;\n\n /**\n * Emitted when the toggle has focus.\n */\n @Event() roadfocus!: EventEmitter<void>;\n /** @internal */\n @Event() roadFocus!: EventEmitter<void>;\n\n /**\n * Emitted when the toggle loses focus.\n */\n @Event() roadblur!: EventEmitter<void>;\n /** @internal */\n @Event() roadBlur!: EventEmitter<void>;\n\n @Watch('checked')\n checkedChanged(isChecked: boolean) {\n this.roadchange.emit({\n checked: isChecked,\n value: this.value,\n });\n this.roadChange.emit({\n checked: isChecked,\n value: this.value,\n });\n }\n\n private onClick = () => {\n this.checked = !this.checked;\n };\n\n private onFocus = () => {\n this.roadfocus.emit();\n this.roadFocus.emit();\n };\n\n private onBlur = () => {\n this.roadBlur.emit();\n this.roadblur.emit();\n };\n\n render() {\n const labelId = this.toggleId + '-label';\n const textLabel = <label class=\"form-toggle-label\" id={labelId} htmlFor={this.toggleId}>{this.label}</label>;\n const colorClass = this.color !== undefined ? 'form-toggle-' + this.color : '';\n const isSpacedClass = this.isSpaced && 'form-toggle-spaced';\n const righttoggleClass = this.hasLeftLabel ? 'form-toggle-right' : '';\n\n return (\n <Host>\n <input\n class=\"form-toggle-input\"\n type=\"checkbox\"\n id={this.toggleId}\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n aria-checked={`${this.checked}`}\n aria-disabled={this.disabled ? 'true' : null}\n aria-labelledby={labelId}\n onClick={this.onClick}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n />\n <label class={`form-toggle-label ${isSpacedClass} ${colorClass}`} htmlFor={this.toggleId}>\n {this.hasLeftLabel && textLabel}\n <div class={`form-toggle-lever ${righttoggleClass}`} data-off={this.off} data-on={this.on}></div>\n {this.hasLeftLabel ? '' : textLabel}\n </label>\n </Host>\n );\n }\n}\n\nlet toggleIds = 0;\n"],"mappings":"iFAAA,MAAMA,EAAY,umH,MCULC,EAAM,M,uPAgGTC,KAAAC,QAAU,KAChBD,KAAKE,SAAWF,KAAKE,OAAO,EAGtBF,KAAAG,QAAU,KAChBH,KAAKI,UAAUC,OACfL,KAAKM,UAAUD,MAAM,EAGfL,KAAAO,OAAS,KACfP,KAAKQ,SAASH,OACdL,KAAKS,SAASJ,MAAM,E,cAtGK,eAAeK,M,UAKnBV,KAAKW,S,aAKO,M,cAKhB,M,WAKK,GAAGX,KAAKW,iB,WAKa,U,kBAKb,M,cAKJ,M,WAKJ,K,QAKH,M,SAKC,I,CA8BtBC,eAAeC,GACbb,KAAKc,WAAWT,KAAK,CACnBH,QAASW,EACTE,MAAOf,KAAKe,QAEdf,KAAKgB,WAAWX,KAAK,CACnBH,QAASW,EACTE,MAAOf,KAAKe,O,CAkBhBE,SACE,MAAMC,EAAUlB,KAAKW,SAAW,SAChC,MAAMQ,EAAYC,EAAA,SAAOC,MAAM,oBAAoBC,GAAIJ,EAASK,QAASvB,KAAKW,UAAWX,KAAKwB,OAC9F,MAAMC,EAAazB,KAAK0B,QAAUC,UAAY,eAAiB3B,KAAK0B,MAAQ,GAC5E,MAAME,EAAgB5B,KAAK6B,UAAY,qBACvC,MAAMC,EAAmB9B,KAAK+B,aAAe,oBAAsB,GAEnE,OACEX,EAACY,EAAI,KACHZ,EAAA,SACEC,MAAM,oBACNY,KAAK,WACLX,GAAItB,KAAKW,SACTuB,KAAMlC,KAAKkC,KACXhC,QAASF,KAAKE,QACdiC,SAAUnC,KAAKmC,SACfpB,MAAOf,KAAKe,MAAK,eACH,GAAGf,KAAKE,UAAS,gBAChBF,KAAKmC,SAAW,OAAS,KAAI,kBAC3BjB,EACjBjB,QAASD,KAAKC,QACdE,QAASH,KAAKG,QACdI,OAAQP,KAAKO,SAEfa,EAAA,SAAOC,MAAO,qBAAqBO,KAAiBH,IAAcF,QAASvB,KAAKW,UAC7EX,KAAK+B,cAAgBZ,EACtBC,EAAA,OAAKC,MAAO,qBAAqBS,IAAkB,WAAY9B,KAAKoC,IAAG,UAAWpC,KAAKqC,KACtFrC,KAAK+B,aAAe,GAAKZ,G,4DAOpC,IAAIT,EAAY,E"}
@@ -1,13 +0,0 @@
1
- /**
2
- * @license
3
- * Copyright Google Inc. All Rights Reserved.
4
- *
5
- * Use of this source code is governed by an MIT-style license that can be
6
- * found in the LICENSE file at https://angular.io/license
7
- *
8
- * This file is a port of shadowCSS from webcomponents.js to TypeScript.
9
- * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js
10
- * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts
11
- */
12
- const t=t=>{const s=[];let n=0;t=t.replace(/(\[[^\]]*\])/g,((t,o)=>{const c=`__ph-${n}__`;s.push(o);n++;return c}));const o=t.replace(/(:nth-[-\w]+)(\([^)]+\))/g,((t,o,c)=>{const e=`__ph-${n}__`;s.push(c);n++;return o+e}));const c={content:o,placeholders:s};return c};const s=(t,s)=>s.replace(/__ph-(\d+)__/g,((s,n)=>t[+n]));const n="-shadowcsshost";const o="-shadowcssslotted";const c="-shadowcsscontext";const e=")(?:\\(("+"(?:\\([^)(]*\\)|[^)(]*)+?"+")\\))?([^,{]*)";const r=new RegExp("("+n+e,"gim");const l=new RegExp("("+c+e,"gim");const i=new RegExp("("+o+e,"gim");const u=n+"-no-combinator";const g=/-shadowcsshost-no-combinator([^\s]*)/;const f=[/::shadow/g,/::content/g];const a="([>\\s~+[.,{:][\\s\\S]*)?$";const h=/-shadowcsshost/gim;const d=/:host/gim;const p=/::slotted/gim;const $=/:host-context/gim;const m=/\/\*\s*[\s\S]*?\*\//g;const _=t=>t.replace(m,"");const w=/\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g;const x=t=>t.match(w)||[];const S=/(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g;const b=/([{}])/g;const R=/(^.*?[^\\])??((:+)(.*)|$)/;const E="{";const k="}";const L="%BLOCK%";const B=(t,s)=>{const n=C(t);let o=0;return n.escapedString.replace(S,((...t)=>{const c=t[2];let e="";let r=t[4];let l="";if(r&&r.startsWith("{"+L)){e=n.blocks[o++];r=r.substring(L.length+1);l="{"}const i={selector:c,content:e};const u=s(i);return`${t[1]}${u.selector}${t[3]}${l}${u.content}${r}`}))};const C=t=>{const s=t.split(b);const n=[];const o=[];let c=0;let e=[];for(let l=0;l<s.length;l++){const t=s[l];if(t===k){c--}if(c>0){e.push(t)}else{if(e.length>0){o.push(e.join(""));n.push(L);e=[]}n.push(t)}if(t===E){c++}}if(e.length>0){o.push(e.join(""));n.push(L)}const r={escapedString:n.join(""),blocks:o};return r};const K=t=>{t=t.replace($,c).replace(d,n).replace(p,o);return t};const O=(t,s,n)=>t.replace(s,((...t)=>{if(t[2]){const s=t[2].split(",");const o=[];for(let c=0;c<s.length;c++){const e=s[c].trim();if(!e)break;o.push(n(u,e,t[3]))}return o.join(",")}else{return u+t[3]}}));const T=(t,s,o)=>t+s.replace(n,"")+o;const M=t=>O(t,r,T);const U=(t,s,o)=>{if(s.indexOf(n)>-1){return T(t,s,o)}else{return t+s+o+", "+s+" "+t+o}};const j=(t,s)=>{const n="."+s+" > ";const o=[];t=t.replace(i,((...t)=>{if(t[2]){const s=t[2].trim();const c=t[3];const e=n+s+c;let r="";for(let n=t[4]-1;n>=0;n--){const s=t[5][n];if(s==="}"||s===","){break}r=s+r}const l=r+e;const i=`${r.trimRight()}${e.trim()}`;if(l.trim()!==i.trim()){const t=`${i}, ${l}`;o.push({orgSelector:l,updatedSelector:t})}return e}else{return u+t[3]}}));return{selectors:o,cssText:t}};const q=t=>O(t,l,U);const v=t=>f.reduce(((t,s)=>t.replace(s," ")),t);const y=t=>{const s=/\[/g;const n=/\]/g;t=t.replace(s,"\\[").replace(n,"\\]");return new RegExp("^("+t+")"+a,"m")};const z=(t,s)=>{const n=y(s);return!n.test(t)};const A=(t,s)=>t.replace(R,((t,n="",o,c="",e="")=>n+s+c+e));const D=(t,s,n)=>{h.lastIndex=0;if(h.test(t)){const s=`.${n}`;return t.replace(g,((t,n)=>A(n,s))).replace(h,s+" ")}return s+" "+t};const F=(n,o,c)=>{const e=/\[is=([^\]]*)\]/g;o=o.replace(e,((t,...s)=>s[0]));const r="."+o;const l=t=>{let s=t.trim();if(!s){return""}if(t.indexOf(u)>-1){s=D(t,o,c)}else{const n=t.replace(h,"");if(n.length>0){s=A(n,r)}}return s};const i=t(n);n=i.content;let g="";let f=0;let a;const d=/( |>|\+|~(?!=))\s*/g;const p=n.indexOf(u)>-1;let $=!p;while((a=d.exec(n))!==null){const t=a[1];const s=n.slice(f,a.index).trim();$=$||s.indexOf(u)>-1;const o=$?l(s):s;g+=`${o} ${t} `;f=d.lastIndex}const m=n.substring(f);$=$||m.indexOf(u)>-1;g+=$?l(m):m;return s(i.placeholders,g)};const G=(t,s,n,o)=>t.split(",").map((t=>{if(o&&t.indexOf("."+o)>-1){return t.trim()}if(z(t,s)){return F(t,s,n).trim()}else{return t.trim()}})).join(", ");const H=(t,s,n,o,c)=>B(t,(t=>{let c=t.selector;let e=t.content;if(t.selector[0]!=="@"){c=G(t.selector,s,n,o)}else if(t.selector.startsWith("@media")||t.selector.startsWith("@supports")||t.selector.startsWith("@page")||t.selector.startsWith("@document")){e=H(t.content,s,n,o)}const r={selector:c.replace(/\s{2,}/g," ").trim(),content:e};return r}));const I=(t,s,n,o,c)=>{t=K(t);t=M(t);t=q(t);const e=j(t,o);t=e.cssText;t=v(t);if(s){t=H(t,s,n,o)}t=t.replace(/-shadowcsshost-no-combinator/g,`.${n}`);t=t.replace(/>\s*\*\s+([^{, ]+)/gm," $1 ");return{cssText:t.trim(),slottedSelectors:e.selectors}};const J=(t,s,n)=>{const o=s+"-h";const c=s+"-s";const e=x(t);t=_(t);const r=[];if(n){const s=t=>{const s=`/*!@___${r.length}___*/`;const n=`/*!@${t.selector}*/`;r.push({placeholder:s,comment:n});t.selector=s+t.selector;return t};t=B(t,(t=>{if(t.selector[0]!=="@"){return s(t)}else if(t.selector.startsWith("@media")||t.selector.startsWith("@supports")||t.selector.startsWith("@page")||t.selector.startsWith("@document")){t.content=B(t.content,s);return t}return t}))}const l=I(t,s,o,c);t=[l.cssText,...e].join("\n");if(n){r.forEach((({placeholder:s,comment:n})=>{t=t.replace(s,n)}))}l.slottedSelectors.forEach((s=>{t=t.replace(s.orgSelector,s.updatedSelector)}));return t};export{J as scopeCss};
13
- //# sourceMappingURL=p-50daca95.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["safeSelector","selector","placeholders","index","replace","_","keep","replaceBy","push","content","pseudo","exp","ss","restoreSafeSelector","_polyfillHost","_polyfillSlotted","_polyfillHostContext","_parenSuffix","_cssColonHostRe","RegExp","_cssColonHostContextRe","_cssColonSlottedRe","_polyfillHostNoCombinator","_polyfillHostNoCombinatorRe","_shadowDOMSelectorsRe","_selectorReSuffix","_polyfillHostRe","_colonHostRe","_colonSlottedRe","_colonHostContextRe","_commentRe","stripComments","input","_commentWithHashRe","extractCommentsWithHash","match","_ruleRe","_curlyRe","_selectorPartsRe","OPEN_CURLY","CLOSE_CURLY","BLOCK_PLACEHOLDER","processRules","ruleCallback","inputWithEscapedBlocks","escapeBlocks","nextBlockIndex","escapedString","m","suffix","contentPrefix","startsWith","blocks","substring","length","cssRule","rule","inputParts","split","resultParts","escapedBlocks","bracketCount","currentBlockParts","partIndex","part","join","strEscapedBlocks","insertPolyfillHostInCssText","convertColonRule","cssText","regExp","partReplacer","parts","r","i","p","trim","colonHostPartReplacer","host","convertColonHost","colonHostContextPartReplacer","indexOf","convertColonSlotted","slotScopeId","slotClass","selectors","compound","slottedSelector","prefixSelector","char","orgSelector","addedSelector","trimRight","updatedSelector","convertColonHostContext","convertShadowDOMSelectors","reduce","result","pattern","makeScopeMatcher","scopeSelector","lre","rre","selectorNeedsScoping","re","test","injectScopingSelector","scopingSelector","before","_colonGroup","colon","after","applySimpleSelectorScope","hostSelector","lastIndex","applyStrictSelectorScope","isRe","className","_scopeSelectorPart","scopedP","t","safeContent","scopedSelector","startIndex","res","sep","hasHost","shouldScope","exec","separator","slice","scopedPart","scopeSelectorText","slotSelector","map","shallowPart","scopeSelectors","commentOriginalSelector","scopeCssText","scopeId","hostScopeId","slotted","slottedSelectors","scopeCss","commentsWithHash","orgSelectors","processCommentedSelector","placeholder","comment","scoped","forEach"],"sources":["./node_modules/@stencil/core/internal/client/shadow-css.js"],"sourcesContent":["/*\n Stencil Client Platform v3.4.2 | MIT Licensed | https://stenciljs.com\n */\n/**\n * @license\n * Copyright Google Inc. All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n *\n * This file is a port of shadowCSS from webcomponents.js to TypeScript.\n * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js\n * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts\n */\nconst safeSelector = (selector) => {\n const placeholders = [];\n let index = 0;\n // Replaces attribute selectors with placeholders.\n // The WS in [attr=\"va lue\"] would otherwise be interpreted as a selector separator.\n selector = selector.replace(/(\\[[^\\]]*\\])/g, (_, keep) => {\n const replaceBy = `__ph-${index}__`;\n placeholders.push(keep);\n index++;\n return replaceBy;\n });\n // Replaces the expression in `:nth-child(2n + 1)` with a placeholder.\n // WS and \"+\" would otherwise be interpreted as selector separators.\n const content = selector.replace(/(:nth-[-\\w]+)(\\([^)]+\\))/g, (_, pseudo, exp) => {\n const replaceBy = `__ph-${index}__`;\n placeholders.push(exp);\n index++;\n return pseudo + replaceBy;\n });\n const ss = {\n content,\n placeholders,\n };\n return ss;\n};\nconst restoreSafeSelector = (placeholders, content) => {\n return content.replace(/__ph-(\\d+)__/g, (_, index) => placeholders[+index]);\n};\nconst _polyfillHost = '-shadowcsshost';\nconst _polyfillSlotted = '-shadowcssslotted';\n// note: :host-context pre-processed to -shadowcsshostcontext.\nconst _polyfillHostContext = '-shadowcsscontext';\nconst _parenSuffix = ')(?:\\\\((' + '(?:\\\\([^)(]*\\\\)|[^)(]*)+?' + ')\\\\))?([^,{]*)';\nconst _cssColonHostRe = new RegExp('(' + _polyfillHost + _parenSuffix, 'gim');\nconst _cssColonHostContextRe = new RegExp('(' + _polyfillHostContext + _parenSuffix, 'gim');\nconst _cssColonSlottedRe = new RegExp('(' + _polyfillSlotted + _parenSuffix, 'gim');\nconst _polyfillHostNoCombinator = _polyfillHost + '-no-combinator';\nconst _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\\s]*)/;\nconst _shadowDOMSelectorsRe = [/::shadow/g, /::content/g];\nconst _selectorReSuffix = '([>\\\\s~+[.,{:][\\\\s\\\\S]*)?$';\nconst _polyfillHostRe = /-shadowcsshost/gim;\nconst _colonHostRe = /:host/gim;\nconst _colonSlottedRe = /::slotted/gim;\nconst _colonHostContextRe = /:host-context/gim;\nconst _commentRe = /\\/\\*\\s*[\\s\\S]*?\\*\\//g;\nconst stripComments = (input) => {\n return input.replace(_commentRe, '');\n};\nconst _commentWithHashRe = /\\/\\*\\s*#\\s*source(Mapping)?URL=[\\s\\S]+?\\*\\//g;\nconst extractCommentsWithHash = (input) => {\n return input.match(_commentWithHashRe) || [];\n};\nconst _ruleRe = /(\\s*)([^;\\{\\}]+?)(\\s*)((?:{%BLOCK%}?\\s*;?)|(?:\\s*;))/g;\nconst _curlyRe = /([{}])/g;\nconst _selectorPartsRe = /(^.*?[^\\\\])??((:+)(.*)|$)/;\nconst OPEN_CURLY = '{';\nconst CLOSE_CURLY = '}';\nconst BLOCK_PLACEHOLDER = '%BLOCK%';\nconst processRules = (input, ruleCallback) => {\n const inputWithEscapedBlocks = escapeBlocks(input);\n let nextBlockIndex = 0;\n return inputWithEscapedBlocks.escapedString.replace(_ruleRe, (...m) => {\n const selector = m[2];\n let content = '';\n let suffix = m[4];\n let contentPrefix = '';\n if (suffix && suffix.startsWith('{' + BLOCK_PLACEHOLDER)) {\n content = inputWithEscapedBlocks.blocks[nextBlockIndex++];\n suffix = suffix.substring(BLOCK_PLACEHOLDER.length + 1);\n contentPrefix = '{';\n }\n const cssRule = {\n selector,\n content,\n };\n const rule = ruleCallback(cssRule);\n return `${m[1]}${rule.selector}${m[3]}${contentPrefix}${rule.content}${suffix}`;\n });\n};\nconst escapeBlocks = (input) => {\n const inputParts = input.split(_curlyRe);\n const resultParts = [];\n const escapedBlocks = [];\n let bracketCount = 0;\n let currentBlockParts = [];\n for (let partIndex = 0; partIndex < inputParts.length; partIndex++) {\n const part = inputParts[partIndex];\n if (part === CLOSE_CURLY) {\n bracketCount--;\n }\n if (bracketCount > 0) {\n currentBlockParts.push(part);\n }\n else {\n if (currentBlockParts.length > 0) {\n escapedBlocks.push(currentBlockParts.join(''));\n resultParts.push(BLOCK_PLACEHOLDER);\n currentBlockParts = [];\n }\n resultParts.push(part);\n }\n if (part === OPEN_CURLY) {\n bracketCount++;\n }\n }\n if (currentBlockParts.length > 0) {\n escapedBlocks.push(currentBlockParts.join(''));\n resultParts.push(BLOCK_PLACEHOLDER);\n }\n const strEscapedBlocks = {\n escapedString: resultParts.join(''),\n blocks: escapedBlocks,\n };\n return strEscapedBlocks;\n};\nconst insertPolyfillHostInCssText = (selector) => {\n selector = selector\n .replace(_colonHostContextRe, _polyfillHostContext)\n .replace(_colonHostRe, _polyfillHost)\n .replace(_colonSlottedRe, _polyfillSlotted);\n return selector;\n};\nconst convertColonRule = (cssText, regExp, partReplacer) => {\n // m[1] = :host(-context), m[2] = contents of (), m[3] rest of rule\n return cssText.replace(regExp, (...m) => {\n if (m[2]) {\n const parts = m[2].split(',');\n const r = [];\n for (let i = 0; i < parts.length; i++) {\n const p = parts[i].trim();\n if (!p)\n break;\n r.push(partReplacer(_polyfillHostNoCombinator, p, m[3]));\n }\n return r.join(',');\n }\n else {\n return _polyfillHostNoCombinator + m[3];\n }\n });\n};\nconst colonHostPartReplacer = (host, part, suffix) => {\n return host + part.replace(_polyfillHost, '') + suffix;\n};\nconst convertColonHost = (cssText) => {\n return convertColonRule(cssText, _cssColonHostRe, colonHostPartReplacer);\n};\nconst colonHostContextPartReplacer = (host, part, suffix) => {\n if (part.indexOf(_polyfillHost) > -1) {\n return colonHostPartReplacer(host, part, suffix);\n }\n else {\n return host + part + suffix + ', ' + part + ' ' + host + suffix;\n }\n};\nconst convertColonSlotted = (cssText, slotScopeId) => {\n const slotClass = '.' + slotScopeId + ' > ';\n const selectors = [];\n cssText = cssText.replace(_cssColonSlottedRe, (...m) => {\n if (m[2]) {\n const compound = m[2].trim();\n const suffix = m[3];\n const slottedSelector = slotClass + compound + suffix;\n let prefixSelector = '';\n for (let i = m[4] - 1; i >= 0; i--) {\n const char = m[5][i];\n if (char === '}' || char === ',') {\n break;\n }\n prefixSelector = char + prefixSelector;\n }\n const orgSelector = prefixSelector + slottedSelector;\n const addedSelector = `${prefixSelector.trimRight()}${slottedSelector.trim()}`;\n if (orgSelector.trim() !== addedSelector.trim()) {\n const updatedSelector = `${addedSelector}, ${orgSelector}`;\n selectors.push({\n orgSelector,\n updatedSelector,\n });\n }\n return slottedSelector;\n }\n else {\n return _polyfillHostNoCombinator + m[3];\n }\n });\n return {\n selectors,\n cssText,\n };\n};\nconst convertColonHostContext = (cssText) => {\n return convertColonRule(cssText, _cssColonHostContextRe, colonHostContextPartReplacer);\n};\nconst convertShadowDOMSelectors = (cssText) => {\n return _shadowDOMSelectorsRe.reduce((result, pattern) => result.replace(pattern, ' '), cssText);\n};\nconst makeScopeMatcher = (scopeSelector) => {\n const lre = /\\[/g;\n const rre = /\\]/g;\n scopeSelector = scopeSelector.replace(lre, '\\\\[').replace(rre, '\\\\]');\n return new RegExp('^(' + scopeSelector + ')' + _selectorReSuffix, 'm');\n};\nconst selectorNeedsScoping = (selector, scopeSelector) => {\n const re = makeScopeMatcher(scopeSelector);\n return !re.test(selector);\n};\nconst injectScopingSelector = (selector, scopingSelector) => {\n return selector.replace(_selectorPartsRe, (_, before = '', _colonGroup, colon = '', after = '') => {\n return before + scopingSelector + colon + after;\n });\n};\nconst applySimpleSelectorScope = (selector, scopeSelector, hostSelector) => {\n // In Android browser, the lastIndex is not reset when the regex is used in String.replace()\n _polyfillHostRe.lastIndex = 0;\n if (_polyfillHostRe.test(selector)) {\n const replaceBy = `.${hostSelector}`;\n return selector\n .replace(_polyfillHostNoCombinatorRe, (_, selector) => injectScopingSelector(selector, replaceBy))\n .replace(_polyfillHostRe, replaceBy + ' ');\n }\n return scopeSelector + ' ' + selector;\n};\nconst applyStrictSelectorScope = (selector, scopeSelector, hostSelector) => {\n const isRe = /\\[is=([^\\]]*)\\]/g;\n scopeSelector = scopeSelector.replace(isRe, (_, ...parts) => parts[0]);\n const className = '.' + scopeSelector;\n const _scopeSelectorPart = (p) => {\n let scopedP = p.trim();\n if (!scopedP) {\n return '';\n }\n if (p.indexOf(_polyfillHostNoCombinator) > -1) {\n scopedP = applySimpleSelectorScope(p, scopeSelector, hostSelector);\n }\n else {\n // remove :host since it should be unnecessary\n const t = p.replace(_polyfillHostRe, '');\n if (t.length > 0) {\n scopedP = injectScopingSelector(t, className);\n }\n }\n return scopedP;\n };\n const safeContent = safeSelector(selector);\n selector = safeContent.content;\n let scopedSelector = '';\n let startIndex = 0;\n let res;\n const sep = /( |>|\\+|~(?!=))\\s*/g;\n // If a selector appears before :host it should not be shimmed as it\n // matches on ancestor elements and not on elements in the host's shadow\n // `:host-context(div)` is transformed to\n // `-shadowcsshost-no-combinatordiv, div -shadowcsshost-no-combinator`\n // the `div` is not part of the component in the 2nd selectors and should not be scoped.\n // Historically `component-tag:host` was matching the component so we also want to preserve\n // this behavior to avoid breaking legacy apps (it should not match).\n // The behavior should be:\n // - `tag:host` -> `tag[h]` (this is to avoid breaking legacy apps, should not match anything)\n // - `tag :host` -> `tag [h]` (`tag` is not scoped because it's considered part of a\n // `:host-context(tag)`)\n const hasHost = selector.indexOf(_polyfillHostNoCombinator) > -1;\n // Only scope parts after the first `-shadowcsshost-no-combinator` when it is present\n let shouldScope = !hasHost;\n while ((res = sep.exec(selector)) !== null) {\n const separator = res[1];\n const part = selector.slice(startIndex, res.index).trim();\n shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;\n const scopedPart = shouldScope ? _scopeSelectorPart(part) : part;\n scopedSelector += `${scopedPart} ${separator} `;\n startIndex = sep.lastIndex;\n }\n const part = selector.substring(startIndex);\n shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;\n scopedSelector += shouldScope ? _scopeSelectorPart(part) : part;\n // replace the placeholders with their original values\n return restoreSafeSelector(safeContent.placeholders, scopedSelector);\n};\nconst scopeSelector = (selector, scopeSelectorText, hostSelector, slotSelector) => {\n return selector\n .split(',')\n .map((shallowPart) => {\n if (slotSelector && shallowPart.indexOf('.' + slotSelector) > -1) {\n return shallowPart.trim();\n }\n if (selectorNeedsScoping(shallowPart, scopeSelectorText)) {\n return applyStrictSelectorScope(shallowPart, scopeSelectorText, hostSelector).trim();\n }\n else {\n return shallowPart.trim();\n }\n })\n .join(', ');\n};\nconst scopeSelectors = (cssText, scopeSelectorText, hostSelector, slotSelector, commentOriginalSelector) => {\n return processRules(cssText, (rule) => {\n let selector = rule.selector;\n let content = rule.content;\n if (rule.selector[0] !== '@') {\n selector = scopeSelector(rule.selector, scopeSelectorText, hostSelector, slotSelector);\n }\n else if (rule.selector.startsWith('@media') ||\n rule.selector.startsWith('@supports') ||\n rule.selector.startsWith('@page') ||\n rule.selector.startsWith('@document')) {\n content = scopeSelectors(rule.content, scopeSelectorText, hostSelector, slotSelector);\n }\n const cssRule = {\n selector: selector.replace(/\\s{2,}/g, ' ').trim(),\n content,\n };\n return cssRule;\n });\n};\nconst scopeCssText = (cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) => {\n cssText = insertPolyfillHostInCssText(cssText);\n cssText = convertColonHost(cssText);\n cssText = convertColonHostContext(cssText);\n const slotted = convertColonSlotted(cssText, slotScopeId);\n cssText = slotted.cssText;\n cssText = convertShadowDOMSelectors(cssText);\n if (scopeId) {\n cssText = scopeSelectors(cssText, scopeId, hostScopeId, slotScopeId);\n }\n cssText = cssText.replace(/-shadowcsshost-no-combinator/g, `.${hostScopeId}`);\n cssText = cssText.replace(/>\\s*\\*\\s+([^{, ]+)/gm, ' $1 ');\n return {\n cssText: cssText.trim(),\n slottedSelectors: slotted.selectors,\n };\n};\nconst scopeCss = (cssText, scopeId, commentOriginalSelector) => {\n const hostScopeId = scopeId + '-h';\n const slotScopeId = scopeId + '-s';\n const commentsWithHash = extractCommentsWithHash(cssText);\n cssText = stripComments(cssText);\n const orgSelectors = [];\n if (commentOriginalSelector) {\n const processCommentedSelector = (rule) => {\n const placeholder = `/*!@___${orgSelectors.length}___*/`;\n const comment = `/*!@${rule.selector}*/`;\n orgSelectors.push({ placeholder, comment });\n rule.selector = placeholder + rule.selector;\n return rule;\n };\n cssText = processRules(cssText, (rule) => {\n if (rule.selector[0] !== '@') {\n return processCommentedSelector(rule);\n }\n else if (rule.selector.startsWith('@media') ||\n rule.selector.startsWith('@supports') ||\n rule.selector.startsWith('@page') ||\n rule.selector.startsWith('@document')) {\n rule.content = processRules(rule.content, processCommentedSelector);\n return rule;\n }\n return rule;\n });\n }\n const scoped = scopeCssText(cssText, scopeId, hostScopeId, slotScopeId);\n cssText = [scoped.cssText, ...commentsWithHash].join('\\n');\n if (commentOriginalSelector) {\n orgSelectors.forEach(({ placeholder, comment }) => {\n cssText = cssText.replace(placeholder, comment);\n });\n }\n scoped.slottedSelectors.forEach((slottedSelector) => {\n cssText = cssText.replace(slottedSelector.orgSelector, slottedSelector.updatedSelector);\n });\n return cssText;\n};\n\nexport { scopeCss };\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{r as c,e,h as o,H as r}from"./p-abdbf6ac.js";import{c as a,b as i}from"./p-37ab7c7f.js";import"./p-e8c090a5.js";const s='.sc-road-checkbox-h{position:relative;display:block;margin-bottom:1.5rem;font-family:var(--road-font, sans-serif);font-size:var(--road-font-size-16);line-height:1.5;color:var(--road-on-surface)}.form-check-input.sc-road-checkbox{position:absolute;z-index:-1;opacity:0}.form-check-label.sc-road-checkbox{position:relative;display:inline-flex;margin:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.form-check-label.sc-road-checkbox::before{box-sizing:border-box;display:block;flex-shrink:0;width:1.25rem;height:1.25rem;margin:0 0.75rem 0 0;content:"";background:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0.25rem;transition:border 0.2s ease-in-out, background 0.2s ease-in-out}.form-check-icon.sc-road-checkbox{position:absolute;top:0;left:0;box-sizing:border-box;display:block;width:1.25rem;height:1.25rem;color:var(--road-primary-contrast);opacity:0;transition:opacity 0.2s ease-in-out}@media (hover: hover){.form-check-input.sc-road-checkbox:not(:disabled)~.form-check-label.sc-road-checkbox:hover::before{border-color:var(--road-input-surface-variant)}.form-check-input.sc-road-checkbox:not(:disabled):checked~.form-check-label.sc-road-checkbox:hover::before,.form-check-input.sc-road-checkbox:not(:disabled):indeterminate~.form-check-label.sc-road-checkbox:hover::before{background:var(--road-input-surface-variant)}}.form-check-input.sc-road-checkbox:checked~.form-check-label.sc-road-checkbox .form-check-icon.sc-road-checkbox,.form-check-input.sc-road-checkbox:indeterminate~.form-check-label.sc-road-checkbox .form-check-icon.sc-road-checkbox{opacity:1}.form-check-input.sc-road-checkbox:checked~.form-check-label.sc-road-checkbox::before,.form-check-input.sc-road-checkbox:indeterminate~.form-check-label.sc-road-checkbox::before{background:var(--road-input-surface);border-color:var(--road-input-surface)}.form-check-input.focus-visible.sc-road-checkbox~.form-check-label.sc-road-checkbox::before{box-shadow:0 0 0 0.125rem var(--road-grey-000), 0 0 0 0.1875rem var(--road-primary-700)}.form-check-input.focus-visible.sc-road-checkbox:checked~.form-check-label.sc-road-checkbox::before,.form-check-input.focus-visible.sc-road-checkbox:indeterminate~.form-check-label.sc-road-checkbox::before{background:var(--road-input-surface-variant);border-color:var(--road-input-surface-variant)}.form-check-input.sc-road-checkbox:disabled~.form-check-label.sc-road-checkbox,.form-check-input[readonly].sc-road-checkbox~.form-check-label.sc-road-checkbox{cursor:not-allowed}.form-check-input.sc-road-checkbox:disabled~.form-check-label.sc-road-checkbox::before,.form-check-input[readonly].sc-road-checkbox~.form-check-label.sc-road-checkbox::before{background:var(--road-surface-disabled);border:none}.form-check-input.sc-road-checkbox:disabled~.form-check-label.sc-road-checkbox .form-check-icon.sc-road-checkbox,.form-check-input[readonly].sc-road-checkbox~.form-check-label.sc-road-checkbox .form-check-icon.sc-road-checkbox{fill:var(--road-on-surface-disabled)}.invalid-feedback.sc-road-checkbox{display:none;flex:0 0 100%;width:100%;margin-top:0.5rem;font-size:var(--road-font-size-12);color:var(--road-danger-default)}.form-check-input.is-invalid.sc-road-checkbox~.form-check-label.sc-road-checkbox::before,.was-validated.sc-road-checkbox .form-check-input.sc-road-checkbox:invalid~.form-check-label.sc-road-checkbox::before{border-color:var(--road-danger-outline)}.form-check-input.is-invalid.sc-road-checkbox~.invalid-feedback.sc-road-checkbox,.was-validated.sc-road-checkbox .form-check-input.sc-road-checkbox:invalid~.invalid-feedback.sc-road-checkbox{display:block}.form-checkbox-inverse.sc-road-checkbox{display:flex;flex-direction:row-reverse;justify-content:space-between}.form-checkbox-inverse.sc-road-checkbox::before{margin:0 0 0 1rem}.form-checkbox-inverse.sc-road-checkbox .form-check-icon.sc-road-checkbox{right:0;left:auto}.helper.sc-road-checkbox{margin-top:0.5rem;font-size:0.75rem;color:var(--road-grey-500)}';const h=class{constructor(o){c(this,o);this.roadchange=e(this,"roadchange",7);this.roadChange=e(this,"roadChange",7);this.roadfocus=e(this,"roadfocus",7);this.roadFocus=e(this,"roadFocus",7);this.roadblur=e(this,"roadblur",7);this.roadBlur=e(this,"roadBlur",7);this.onClick=()=>{this.checked=!this.checked;this.indeterminate=false};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.onBlur=()=>{this.roadblur.emit();this.roadBlur.emit()};this.checkboxId=`road-checkbox-${t++}`;this.name=this.checkboxId;this.required=false;this.checked=false;this.indeterminate=false;this.disabled=false;this.value="on";this.label=`${this.checkboxId}-label`;this.inverse=false;this.error=undefined;this.helper=undefined}checkedChanged(c){this.roadchange.emit({checked:c,value:this.value});this.roadChange.emit({checked:c,value:this.value})}render(){const c=this.checkboxId+"-label";const e=this.inverse&&"form-checkbox-inverse";const s=this.error!==undefined&&!this.checked&&this.error!==""?"is-invalid":"";return o(r,null,o("input",{class:`form-check-input ${s}`,type:"checkbox",id:this.checkboxId,name:this.name,required:this.required,disabled:this.disabled,indeterminate:this.indeterminate,checked:this.checked,value:this.value,"aria-checked":`${this.checked}`,"aria-disabled":this.disabled?"true":null,"aria-labelledby":c,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur}),o("label",{class:`form-check-label ${e}`,id:c,htmlFor:this.checkboxId},o("div",null,this.label,o("slot",null)),this.checked&&!this.indeterminate&&o("road-icon",{class:"form-check-icon",icon:a}),this.indeterminate&&o("road-icon",{class:"form-check-icon",icon:i})),this.error&&this.error!==""&&o("p",{class:"invalid-feedback"},this.error),this.helper&&this.helper!==""&&o("p",{class:"helper"},this.helper))}static get watchers(){return{checked:["checkedChanged"]}}};let t=0;h.style=s;export{h as road_checkbox};
2
- //# sourceMappingURL=p-564f4f31.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["checkboxCss","Checkbox","this","onClick","checked","indeterminate","onFocus","roadfocus","emit","roadFocus","onBlur","roadblur","roadBlur","checkboxIds","checkboxId","checkedChanged","isChecked","roadchange","value","roadChange","render","labelId","inverseClass","inverse","isInvalidClass","error","undefined","h","Host","class","type","id","name","required","disabled","htmlFor","label","icon","checkWide","navigationAddLess","helper"],"sources":["./src/components/checkbox/checkbox.css?tag=road-checkbox&encapsulation=scoped","./src/components/checkbox/checkbox.tsx"],"sourcesContent":["/*\n * Checkbox\n *\n * For accessibility, we provide a style for focus only on Tab,\n * for that add the javascript polyfill for focus-visible\n * (https://github.com/WICG/focus-visible).\n *\n * Index\n * - Checkbox\n * - Label\n * - Error\n * - Helper\n * - Position\n */\n\n\n/* CHECKBOX\n -------------------- */\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1.5rem;\n font-family: var(--road-font, sans-serif);\n font-size: var(--road-font-size-16);\n line-height: 1.5;\n color: var(--road-on-surface);\n}\n\n/**\n * Hide input\n */\n\n.form-check-input {\n position: absolute;\n z-index: -1;\n opacity: 0;\n}\n\n/* LABEL\n -------------------- */\n\n.form-check-label {\n position: relative;\n display: inline-flex;\n margin: 0;\n cursor: pointer;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n.form-check-label::before {\n box-sizing: border-box;\n display: block;\n flex-shrink: 0;\n width: 1.25rem;\n height: 1.25rem;\n margin: 0 0.75rem 0 0;\n content: \"\";\n background: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n transition: border 0.2s ease-in-out, background 0.2s ease-in-out;\n}\n\n.form-check-icon {\n position: absolute;\n top: 0;\n left: 0;\n box-sizing: border-box;\n display: block;\n width: 1.25rem;\n height: 1.25rem;\n color: var(--road-primary-contrast);\n opacity: 0;\n transition: opacity 0.2s ease-in-out;\n}\n\n/**\n * Hover state\n */\n\n@media (hover: hover) {\n\n .form-check-input:not(:disabled) ~ .form-check-label:hover::before {\n border-color: var(--road-input-surface-variant);\n }\n\n .form-check-input:not(:disabled):checked ~ .form-check-label:hover::before,\n .form-check-input:not(:disabled):indeterminate ~ .form-check-label:hover::before {\n background: var(--road-input-surface-variant);\n }\n}\n\n/**\n * Checked state\n */\n\n.form-check-input:checked ~ .form-check-label .form-check-icon,\n.form-check-input:indeterminate ~ .form-check-label .form-check-icon {\n opacity: 1;\n}\n\n.form-check-input:checked ~ .form-check-label::before,\n.form-check-input:indeterminate ~ .form-check-label::before {\n background: var(--road-input-surface);\n border-color: var(--road-input-surface);\n}\n\n/**\n * Focus on Tab\n */\n\n.form-check-input.focus-visible ~ .form-check-label::before {\n box-shadow: 0 0 0 0.125rem var(--road-grey-000), 0 0 0 0.1875rem var(--road-primary-700);\n}\n\n.form-check-input.focus-visible:checked ~ .form-check-label::before,\n.form-check-input.focus-visible:indeterminate ~ .form-check-label::before {\n background: var(--road-input-surface-variant);\n border-color: var(--road-input-surface-variant);\n}\n\n/**\n * Disabled state\n */\n\n.form-check-input:disabled ~ .form-check-label,\n.form-check-input[readonly] ~ .form-check-label {\n cursor: not-allowed;\n}\n\n.form-check-input:disabled ~ .form-check-label::before,\n.form-check-input[readonly] ~ .form-check-label::before {\n background: var(--road-surface-disabled);\n border: none;\n}\n\n.form-check-input:disabled ~ .form-check-label .form-check-icon,\n.form-check-input[readonly] ~ .form-check-label .form-check-icon {\n fill: var(--road-on-surface-disabled);\n}\n\n/* ERROR\n -------------------- */\n\n.invalid-feedback {\n display: none;\n flex: 0 0 100%;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-font-size-12);\n color: var(--road-danger-default);\n}\n\n.form-check-input.is-invalid ~ .form-check-label::before,\n.was-validated .form-check-input:invalid ~ .form-check-label::before {\n border-color: var(--road-danger-outline);\n}\n\n.form-check-input.is-invalid ~ .invalid-feedback,\n.was-validated .form-check-input:invalid ~ .invalid-feedback {\n display: block;\n}\n\n/* POSITION\n -------------------- */\n\n.form-checkbox-inverse {\n display: flex;\n flex-direction: row-reverse;\n justify-content: space-between;\n}\n\n.form-checkbox-inverse::before {\n margin: 0 0 0 1rem;\n}\n\n.form-checkbox-inverse .form-check-icon {\n right: 0;\n left: auto;\n}\n\n/* HELPER\n -------------------- */\n\n.helper {\n margin-top: 0.5rem;\n font-size: 0.75rem;\n color: var(--road-grey-500);\n}\n","import { Component, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\nimport { checkWide, navigationAddLess } from '../../../icons';\n\nimport './../../utils/polyfill';\n\n/**\n * @slot - Adding additional elements next to the label (e.g. number of items in filters).\n */\n\n@Component({\n tag: 'road-checkbox',\n styleUrl: 'checkbox.css',\n scoped: true,\n})\nexport class Checkbox {\n\n /**\n * The id of checkbox\n */\n @Prop() checkboxId: string = `road-checkbox-${checkboxIds++}`;\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name: string = this.checkboxId;\n\n /**\n * If `true`, the user must fill in a value before submitting a form.\n */\n @Prop() required: boolean = false;\n\n /**\n * If `true`, the checkbox is checked.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n */\n @Prop() indeterminate: boolean = false;\n\n /**\n * If `true`, the user cannot interact with the checkbox.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Value the form will get\n */\n @Prop() value: string = 'on';\n\n /**\n * Label for the field\n */\n @Prop() label: string = `${this.checkboxId}-label`;\n\n /**\n * If `true`, the label and the checkbox are inverse and spaced\n */\n @Prop() inverse: boolean = false;\n\n /**\n * Error message for the field\n */\n @Prop() error?: string;\n\n /**\n * Helper message for the field\n */\n @Prop() helper?: string;\n\n /**\n * Emitted when the checked property has changed.\n */\n @Event() roadchange!: EventEmitter<{\n checked: boolean,\n value: string | undefined | null\n }>;\n /** @internal */\n @Event() roadChange!: EventEmitter<{\n checked: boolean,\n value: string | undefined | null\n }>;\n\n /**\n * Emitted when the checkbox has focus.\n */\n @Event() roadfocus!: EventEmitter<void>;\n /** @internal */\n @Event() roadFocus!: EventEmitter<void>;\n\n /**\n * Emitted when the checkbox loses focus.\n */\n @Event() roadblur!: EventEmitter<void>;\n /** @internal */\n @Event() roadBlur!: EventEmitter<void>;\n\n @Watch('checked')\n checkedChanged(isChecked: boolean) {\n this.roadchange.emit({\n checked: isChecked,\n value: this.value,\n });\n this.roadChange.emit({\n checked: isChecked,\n value: this.value,\n });\n }\n\n private onClick = () => {\n this.checked = !this.checked;\n this.indeterminate = false;\n };\n\n private onFocus = () => {\n this.roadfocus.emit();\n this.roadFocus.emit();\n };\n\n private onBlur = () => {\n this.roadblur.emit();\n this.roadBlur.emit();\n };\n\n render() {\n const labelId = this.checkboxId + '-label';\n const inverseClass = this.inverse && 'form-checkbox-inverse';\n const isInvalidClass = this.error !== undefined && !this.checked && this.error !== '' ? 'is-invalid' : '';\n\n return (\n <Host>\n <input\n class={`form-check-input ${isInvalidClass}`}\n type=\"checkbox\"\n id={this.checkboxId}\n name={this.name}\n required={this.required}\n disabled={this.disabled}\n indeterminate={this.indeterminate}\n checked={this.checked}\n value={this.value}\n aria-checked={`${this.checked}`}\n aria-disabled={this.disabled ? 'true' : null}\n aria-labelledby={labelId}\n onClick={this.onClick}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n />\n <label class={`form-check-label ${inverseClass}`} id={labelId} htmlFor={this.checkboxId}>\n <div>\n {this.label}<slot/>\n </div>\n {this.checked && !this.indeterminate && <road-icon class=\"form-check-icon\" icon={checkWide}></road-icon>}\n {this.indeterminate && <road-icon class=\"form-check-icon\" icon={navigationAddLess}></road-icon>}\n </label>\n {this.error && this.error !== '' && <p class=\"invalid-feedback\">{this.error}</p>}\n {this.helper && this.helper !== '' && <p class=\"helper\">{this.helper}</p>}\n </Host>\n );\n }\n}\n\nlet checkboxIds = 0;\n"],"mappings":"uHAAA,MAAMA,EAAc,44H,MCcPC,EAAQ,M,uPAgGXC,KAAAC,QAAU,KAChBD,KAAKE,SAAWF,KAAKE,QACrBF,KAAKG,cAAgB,KAAK,EAGpBH,KAAAI,QAAU,KAChBJ,KAAKK,UAAUC,OACfN,KAAKO,UAAUD,MAAM,EAGfN,KAAAQ,OAAS,KACfR,KAAKS,SAASH,OACdN,KAAKU,SAASJ,MAAM,E,gBAvGO,iBAAiBK,M,UAKvBX,KAAKY,W,cAKA,M,aAKO,M,mBAKD,M,cAKN,M,WAKJ,K,WAKA,GAAGZ,KAAKY,mB,aAKL,M,2CAwC3BC,eAAeC,GACbd,KAAKe,WAAWT,KAAK,CACnBJ,QAASY,EACTE,MAAOhB,KAAKgB,QAEdhB,KAAKiB,WAAWX,KAAK,CACnBJ,QAASY,EACTE,MAAOhB,KAAKgB,O,CAmBhBE,SACE,MAAMC,EAAUnB,KAAKY,WAAa,SAClC,MAAMQ,EAAepB,KAAKqB,SAAW,wBACrC,MAAMC,EAAiBtB,KAAKuB,QAAUC,YAAcxB,KAAKE,SAAWF,KAAKuB,QAAU,GAAK,aAAe,GAEvG,OACEE,EAACC,EAAI,KACHD,EAAA,SACEE,MAAO,oBAAoBL,IAC3BM,KAAK,WACLC,GAAI7B,KAAKY,WACTkB,KAAM9B,KAAK8B,KACXC,SAAU/B,KAAK+B,SACfC,SAAUhC,KAAKgC,SACf7B,cAAeH,KAAKG,cACpBD,QAASF,KAAKE,QACdc,MAAOhB,KAAKgB,MAAK,eACH,GAAGhB,KAAKE,UAAS,gBAChBF,KAAKgC,SAAW,OAAS,KAAI,kBAC3Bb,EACjBlB,QAASD,KAAKC,QACdG,QAASJ,KAAKI,QACdI,OAAQR,KAAKQ,SAEfiB,EAAA,SAAOE,MAAO,oBAAoBP,IAAgBS,GAAIV,EAASc,QAASjC,KAAKY,YAC3Ea,EAAA,WACGzB,KAAKkC,MAAMT,EAAA,cAEbzB,KAAKE,UAAYF,KAAKG,eAAiBsB,EAAA,aAAWE,MAAM,kBAAkBQ,KAAMC,IAChFpC,KAAKG,eAAiBsB,EAAA,aAAWE,MAAM,kBAAkBQ,KAAME,KAEjErC,KAAKuB,OAASvB,KAAKuB,QAAU,IAAME,EAAA,KAAGE,MAAM,oBAAoB3B,KAAKuB,OACrEvB,KAAKsC,QAAUtC,KAAKsC,SAAW,IAAMb,EAAA,KAAGE,MAAM,UAAU3B,KAAKsC,Q,4DAMtE,IAAI3B,EAAc,E"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["spinnerCss","Spinner","render","sizeClass","this","size","undefined","colorClass","color","h","class","viewBox","cx","cy","r"],"sources":["./src/components/spinner/spinner.css?tag=road-spinner&encapsulation=shadow","./src/components/spinner/spinner.tsx"],"sourcesContent":["/*\n * Spinner\n *\n * Index\n * - Spinner\n * - Circle\n * - Animation\n */\n\n:host {\n display: block;\n}\n\n/* SPINNER\n -------------------- */\n\n.spinner {\n transform-origin: center;\n animation: road-rotate 2s linear infinite;\n}\n\n.spinner.spinner--small{\n width: 1rem;\n height: 1rem;\n}\n\n.spinner.spinner--medium{\n width: 2rem;\n height: 2rem;\n}\n\n.spinner.spinner--large {\n width: 3rem;\n height: 3rem;\n}\n\n.spinner.spinner--xl {\n width: 8rem;\n height: 8rem;\n}\n\n/* CIRCLE\n -------------------- */\n\n.spinner-circle {\n animation: road-dash 1.5s ease-in-out infinite;\n fill: none;\n stroke: var(--road-primary);\n stroke-width: 3;\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n stroke-linecap: round;\n}\n\n.spinner-circle.spinner-circle--dark {\n stroke: var(--road-grey-0);\n}\n\n.spinner-circle.spinner-circle--light {\n stroke: var(--road-grey-90);\n}\n\n/* ANIMATION\n -------------------- */\n\n@keyframes road-rotate {\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n@keyframes road-dash {\n\n 0% {\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n }\n\n 50% {\n stroke-dasharray: 90, 200;\n stroke-dashoffset: -35px;\n }\n\n 100% {\n stroke-dashoffset: -125px;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'road-spinner',\n styleUrl: 'spinner.css',\n shadow: true,\n})\nexport class Spinner {\n\n /**\n * The button size.\n */\n @Prop({ reflect: true }) size?: 'small' | 'medium' | 'large' | 'xl' = 'large';\n\n /**\n * The color spinner.\n */\n @Prop({ reflect: true }) color?: 'default' | 'light' | 'dark' = 'default';\n\n render() {\n const sizeClass = this.size !== undefined ? `spinner spinner--${this.size}` : 'spinner';\n const colorClass = this.size !== undefined ? `spinner-circle spinner-circle--${this.color}` : 'spinner-circle';\n\n\n return (\n <svg class={`${sizeClass}`} viewBox=\"25 25 50 50\">\n <circle class={`${colorClass}`} cx=\"50\" cy=\"50\" r=\"20\"></circle>\n </svg>\n );\n }\n\n}\n"],"mappings":"sCAAA,MAAMA,EAAa,4xB,MCONC,EAAO,M,mCAKqD,Q,WAKL,S,CAEhEC,SACE,MAAMC,EAAYC,KAAKC,OAASC,UAAY,oBAAoBF,KAAKC,OAAS,UAC9E,MAAME,EAAaH,KAAKC,OAASC,UAAY,kCAAkCF,KAAKI,QAAU,iBAG9F,OACEC,EAAA,OAAKC,MAAO,GAAGP,IAAaQ,QAAQ,eAClCF,EAAA,UAAQC,MAAO,GAAGH,IAAcK,GAAG,KAAKC,GAAG,KAAKC,EAAE,O"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["plateNumberCss","PlateNumber","this","countries","country","letter","placeholder","onInput","ev","input","target","value","toUpperCase","roadinput","emit","roadInput","onBlur","roadblur","roadBlur","onFocus","roadfocus","roadFocus","valueChanged","roadchange","toString","roadChange","getValue","render","motorbikeClass","motorbike","h","class","toLowerCase","slot","icon","licensePlateStarEu","filter","item","disabled","readOnly","readonly","maxlength","rows"],"sources":["./src/components/plate-number/plate-number.css?tag=road-plate-number&encapsulation=scoped","./src/components/plate-number/plate-number.tsx"],"sourcesContent":["/*\n * Plate Number\n *\n * Index\n * - Plate Number\n * - Input\n */\n\n/* PLATE NUMBER\n -------------------- */\n\n:host {\n display: block;\n}\n\n.plate-number {\n --margin-bottom: 0;\n}\n\n.plate-number-start,\n.plate-number-end {\n width: 1.75rem;\n height: calc(3rem - 0.25rem);\n background: var(--road-info-50);\n}\n\n.input-group-prepend {\n margin-right: -1px;\n}\n\n.input-group-prepend,\n.input-group-append {\n padding: 0;\n}\n\n.plate-number-start {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0;\n margin-right: 0;\n margin-left: 1px;\n color: var(--road-icon-inverse);\n border-radius: 0.125rem 0 0 0.125rem;\n}\n\n.plate-number-icon {\n width: 1.25rem;\n height: 1.25rem;\n color: #f3db53;\n}\n\n.plate-number-location {\n font-size: var(--road-button-medium);\n font-weight: 700;\n}\n\n.plate-number-end {\n margin-right: 1px;\n border-radius: 0 0.125rem 0.125rem 0;\n}\n\n.plate-number-be .plate-number-input {\n color: var(--road-on-danger-surface);\n}\n\n.plate-number-be .plate-number-input,\n.plate-number-be .input-group-append,\n.plate-number-be .input-group-prepend {\n border-color: var(--road-danger-outline);\n}\n\n/* INPUT\n -------------------- */\n\n.plate-number-input {\n position: relative;\n display: block;\n height: 3rem;\n margin: 0;\n font-family: var(--road-font, sans-serif);\n font-size: var(--road-heading-04);\n font-weight: 700;\n color: var(--road-on-surface);\n text-align: center;\n background: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0;\n outline: 0;\n box-shadow: none;\n appearance: none;\n}\n\n.plate-number-input::placeholder {\n color: var(--road-on-surface-extra-weak);\n opacity: 1;\n}\n\n/**\n * Disabled state\n */\n\n.plate-number-input:disabled {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background: var(--road-surface-disabled);\n opacity: 1;\n}\n\n.plate-number-input:disabled ~ .input-group-prepend,\n.plate-number-input:disabled ~ .input-group-append {\n cursor: not-allowed;\n background: var(--road-surface-disabled);\n}\n\n/**\n * Hover state\n */\n\n@media (hover: hover) {\n\n .plate-number-input:not(:disabled):not([readonly]):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/**\n * Focus state\n */\n\n.plate-number-input:not([readonly]):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/* MOTORBIKE\n -------------------- */\n\n.motorbike-plate .plate-number-input {\n height: 6rem;\n padding: 0.75rem 1rem 0;\n resize: none;\n border-left: 0;\n}\n\n.motorbike-plate .input-group-prepend,\n.motorbike-plate .input-group-append {\n align-items: flex-start;\n height: 6rem;\n padding: 0;\n}\n\n.motorbike-plate .plate-number-start {\n margin-top: 1px;\n border-radius: 0.125rem 0 0;\n}\n\n.motorbike-plate .plate-number-end {\n margin-top: 1px;\n border-radius: 0 0.125rem 0 0;\n}\n","import { Component, h, Prop, Event, EventEmitter, Watch } from '@stencil/core';\nimport { licensePlateStarEu } from '../../../icons';\n\n@Component({\n tag: 'road-plate-number',\n styleUrl: 'plate-number.css',\n scoped: true,\n})\nexport class PlateNumber {\n\n private countries = [\n {\n country: 'FR',\n letter: 'F',\n placeholder: 'AT-857-YY',\n },\n {\n country: 'BE',\n letter: 'B',\n placeholder: '1-AAA-001',\n },\n {\n country: 'IT',\n letter: 'I',\n placeholder: 'AT 814TX',\n },\n {\n country: 'ES',\n letter: 'E',\n placeholder: '9512 HVY',\n },\n {\n country: 'PT',\n letter: 'P',\n placeholder: '13 24 PZ',\n },\n {\n country: 'PL',\n letter: 'PL',\n placeholder: 'GD 921KF',\n },\n {\n country: 'AT',\n letter: 'A',\n placeholder: 'FF 10 FF',\n },\n {\n country: 'DE',\n letter: 'D',\n placeholder: 'RA KL 8136',\n }\n ];\n\n /**\n * country of the plate\n */\n @Prop() country: 'FR' | 'BE' | 'IT' | 'ES' | 'PT' | 'PL' | 'AT' | 'DE' = 'FR';\n\n /**\n * If `true`, the user cannot interact with the input.\n */\n @Prop() disabled = false;\n\n /**\n * overwrite the default placeholder\n */\n @Prop() placeholder?: string;\n\n /**\n * If `true`, the user cannot modify the value.\n */\n @Prop() readonly = false;\n\n /**\n * The value of the input.\n */\n @Prop({ mutable: true }) value?: string | number | null = '';\n\n /**\n * Enable motorbike display\n */\n @Prop() motorbike?: boolean;\n\n /**\n * Update the native input element when the value changes\n */\n @Watch('value')\n protected valueChanged() {\n this.roadchange.emit({ value: this.value == null ? this.value : this.value.toString() });\n this.roadChange.emit({ value: this.value == null ? this.value : this.value.toString() });\n }\n\n /**\n * Emitted when a keyboard input occurred.\n */\n @Event() roadinput!: EventEmitter<KeyboardEvent>;\n /** @internal */\n @Event() roadInput!: EventEmitter<KeyboardEvent>;\n\n /**\n * Emitted when the value has changed.\n */\n @Event() roadchange!: EventEmitter<{\n value: string | undefined | null;\n }>;\n /** @internal */\n @Event() roadChange!: EventEmitter<{\n value: string | undefined | null;\n }>;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() roadblur!: EventEmitter<void>;\n /** @internal */\n @Event() roadBlur!: EventEmitter<void>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() roadfocus!: EventEmitter<void>;\n /** @internal */\n @Event() roadFocus!: EventEmitter<void>;\n\n private getValue(): string {\n return typeof this.value === 'number'\n ? this.value.toString()\n : (this.value || '').toString();\n }\n\n private onInput = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n input.value = input.value.toUpperCase() || \"\";\n }\n this.roadinput.emit(ev as KeyboardEvent);\n this.roadInput.emit(ev as KeyboardEvent);\n };\n\n private onBlur = () => {\n this.roadblur.emit();\n this.roadBlur.emit();\n };\n\n private onFocus = () => {\n this.roadfocus.emit();\n this.roadFocus.emit();\n };\n\n render() {\n const value = this.getValue();\n const motorbikeClass = this.motorbike ? 'motorbike-plate' : '';\n\n return (\n <road-input-group class={`plate-number plate-number-${this.country.toLowerCase()} ${motorbikeClass}`}>\n <label slot=\"prepend\" class=\"input-group-prepend\">\n <div class=\"plate-number-start\">\n <road-icon class=\"plate-number-icon\" icon={licensePlateStarEu}></road-icon>\n <div class=\"plate-number-location\">\n {this.countries\n .filter(item => item.country === this.country)[0].letter}\n </div>\n </div>\n </label>\n {this.motorbike\n ? (\n <textarea\n class=\"form-control plate-number-input mb-0\"\n disabled={this.disabled}\n placeholder={this.placeholder != null ? this.placeholder : this.countries.filter(item => item.country === this.country)[0].placeholder}\n readOnly={this.readonly}\n maxlength=\"9\"\n rows={2}\n onInput={this.onInput}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n >\n </textarea>\n )\n : (\n <input\n class=\"plate-number-input mb-0\"\n disabled={this.disabled}\n placeholder={this.placeholder != null ? this.placeholder : this.countries.filter(item => item.country === this.country)[0].placeholder}\n readOnly={this.readonly}\n value={value}\n onInput={this.onInput}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n />\n )}\n <label slot=\"append\" class=\"input-group-append\">\n <div class=\"plate-number-end\"></div>\n </label>\n </road-input-group>\n );\n }\n\n}"],"mappings":"sFAAA,MAAMA,EAAiB,++F,MCQVC,EAAW,M,iUAEdC,KAAAC,UAAY,CAClB,CACEC,QAAS,KACTC,OAAQ,IACRC,YAAa,aAEf,CACEF,QAAS,KACTC,OAAQ,IACRC,YAAa,aAEf,CACEF,QAAS,KACTC,OAAQ,IACRC,YAAa,YAEf,CACEF,QAAS,KACTC,OAAQ,IACRC,YAAa,YAEf,CACEF,QAAS,KACTC,OAAQ,IACRC,YAAa,YAEf,CACEF,QAAS,KACTC,OAAQ,KACRC,YAAa,YAEf,CACEF,QAAS,KACTC,OAAQ,IACRC,YAAa,YAEf,CACEF,QAAS,KACTC,OAAQ,IACRC,YAAa,eAiFTJ,KAAAK,QAAWC,IACjB,MAAMC,EAAQD,EAAGE,OACjB,GAAID,EAAO,CACTA,EAAME,MAAQF,EAAME,MAAMC,eAAiB,E,CAE7CV,KAAKW,UAAUC,KAAKN,GACpBN,KAAKa,UAAUD,KAAKN,EAAoB,EAGlCN,KAAAc,OAAS,KACfd,KAAKe,SAASH,OACdZ,KAAKgB,SAASJ,MAAM,EAGdZ,KAAAiB,QAAU,KAChBjB,KAAKkB,UAAUN,OACfZ,KAAKmB,UAAUP,MAAM,E,aA1FkD,K,cAKtD,M,yCAUA,M,WAKuC,G,yBAW/CQ,eACRpB,KAAKqB,WAAWT,KAAK,CAAEH,MAAOT,KAAKS,OAAS,KAAOT,KAAKS,MAAQT,KAAKS,MAAMa,aAC3EtB,KAAKuB,WAAWX,KAAK,CAAEH,MAAOT,KAAKS,OAAS,KAAOT,KAAKS,MAAQT,KAAKS,MAAMa,Y,CAmCtEE,WACN,cAAcxB,KAAKS,QAAU,SACzBT,KAAKS,MAAMa,YACVtB,KAAKS,OAAS,IAAIa,U,CAsBzBG,SACE,MAAMhB,EAAQT,KAAKwB,WACnB,MAAME,EAAiB1B,KAAK2B,UAAY,kBAAoB,GAE5D,OACEC,EAAA,oBAAkBC,MAAO,6BAA6B7B,KAAKE,QAAQ4B,iBAAiBJ,KAClFE,EAAA,SAAOG,KAAK,UAAUF,MAAM,uBAC1BD,EAAA,OAAKC,MAAM,sBACTD,EAAA,aAAWC,MAAM,oBAAoBG,KAAMC,IAC3CL,EAAA,OAAKC,MAAM,yBACR7B,KAAKC,UACHiC,QAAOC,GAAQA,EAAKjC,UAAYF,KAAKE,UAAS,GAAGC,UAIzDH,KAAK2B,UAEFC,EAAA,YACEC,MAAM,uCACNO,SAAUpC,KAAKoC,SACfhC,YAAaJ,KAAKI,aAAe,KAAOJ,KAAKI,YAAeJ,KAAKC,UAAUiC,QAAOC,GAAQA,EAAKjC,UAAYF,KAAKE,UAAS,GAAGE,YAC5HiC,SAAUrC,KAAKsC,SACfC,UAAU,IACVC,KAAM,EACNnC,QAASL,KAAKK,QACdS,OAAQd,KAAKc,OACbG,QAASjB,KAAKiB,UAKhBW,EAAA,SACEC,MAAM,0BACNO,SAAUpC,KAAKoC,SACfhC,YAAaJ,KAAKI,aAAe,KAAOJ,KAAKI,YAAeJ,KAAKC,UAAUiC,QAAOC,GAAQA,EAAKjC,UAAYF,KAAKE,UAAS,GAAGE,YAC5HiC,SAAUrC,KAAKsC,SACf7B,MAAOA,EACPJ,QAASL,KAAKK,QACdS,OAAQd,KAAKc,OACbG,QAASjB,KAAKiB,UAGpBW,EAAA,SAAOG,KAAK,SAASF,MAAM,sBACzBD,EAAA,OAAKC,MAAM,sB"}
@@ -1,2 +0,0 @@
1
- import{r as t,e,h as i,H as o,f as r}from"./p-abdbf6ac.js";const n=':host{position:relative;box-sizing:border-box;display:flex;flex:1;flex-basis:0;flex-direction:column;flex-grow:1;align-items:center;justify-content:center;text-align:center;white-space:nowrap}@media (min-width: 1200px){:host{flex-grow:inherit;width:100%;padding:0.5rem}}:host(.tab-selected),:host(.tab-selected) road-tooltip road-icon{color:var(--road-on-button-tertiary);fill:var(--road-on-button-tertiary)}:host(.tab-selected)::after{position:absolute;bottom:-12px;left:0;display:block;width:100%;height:4px;color:var(--road-on-button-tertiary);content:"";background-color:var(--road-on-button-tertiary)}@media (min-width: 1200px){:host(.tab-selected)::after{bottom:auto;left:0;width:4px;height:100%}}:host(.focus-visible) ::slotted(road-icon),:host(.focus-visible) ::slotted(road-icon)::after,:host(.focus-visible) ::slotted(road-label),:host(.focus-visible) ::slotted(road-label)::after,:host(:hover) ::slotted(road-icon),:host(:hover) ::slotted(road-icon)::after,:host(:hover) ::slotted(road-label),:host(:hover) ::slotted(road-label)::after{color:var(--road-on-button-tertiary)}.button-native{position:relative;box-sizing:border-box;display:flex;flex-direction:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%;margin:0;overflow:visible;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:inherit;text-decoration:none;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;cursor:pointer;background:transparent;border-color:initial;border-style:initial;border-width:0;border-radius:inherit;border-image:initial;outline:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.button-inner{position:relative;z-index:1;display:flex;flex-flow:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%}::slotted(road-icon){display:block;width:2rem;height:2rem;margin-right:auto;margin-bottom:0.25rem;margin-left:auto;fill:currentColor}@media (min-width: 1200px){:host ::slotted(road-tooltip){width:100%}}::slotted(road-label){position:relative;box-sizing:border-box;display:flex;flex:1;flex-direction:column;font-size:var(--road-label-small);font-weight:700;text-align:center;white-space:nowrap}@media (min-width: 1200px){::slotted(road-label){display:block}}::slotted(road-badge){position:absolute;top:4px;left:calc(50% + 0.375rem);z-index:1;box-sizing:border-box;height:auto;font-size:var(--road-font-size-10);font-weight:400}';const a=class{constructor(i){t(this,i);this.roadnavbaritemclick=e(this,"roadnavbaritemclick",7);this.roadNavbarItemClick=e(this,"roadNavbarItemClick",7);this.onKeyUp=t=>{if(t.key==="Enter"||t.key===" "){this.selectTab(t)}};this.onClick=t=>{this.selectTab(t)};this.disabled=false;this.download=undefined;this.href=undefined;this.rel=undefined;this.selected=false;this.tab=undefined;this.target=undefined}onNavbarChanged(t){this.selected=this.tab===t.detail.tab}selectTab(t){if(this.tab!==undefined){if(!this.disabled){this.roadnavbaritemclick.emit({tab:this.tab,href:this.href,selected:this.selected});this.roadNavbarItemClick.emit({tab:this.tab,href:this.href,selected:this.selected})}if(this.href===undefined){t.preventDefault()}}}render(){const{href:t,rel:e,target:r,selected:n,tab:a}=this;const s={download:this.download,href:t,rel:e,target:r};return i(o,{onClick:this.onClick,onKeyup:this.onKeyUp,role:"tab",tabindex:"0","aria-selected":n?"true":null,id:a!==undefined?`navbar-item-${a}`:null,class:{"navbar-item":true,"tab-selected":n}},i("a",Object.assign({},s,{tabIndex:-1,class:"button-native",part:"native"}),i("span",{class:"button-inner"},i("slot",null))))}get el(){return r(this)}};a.style=n;export{a as road_navbar_item};
2
- //# sourceMappingURL=p-62c563db.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["navbarItemCss","NavbarItem","this","onKeyUp","ev","key","selectTab","onClick","onNavbarChanged","selected","tab","detail","undefined","disabled","roadnavbaritemclick","emit","href","roadNavbarItemClick","preventDefault","render","rel","target","attrs","download","h","Host","onKeyup","role","tabindex","id","class","Object","assign","tabIndex","part"],"sources":["./src/components/navbar-item/navbar-item.css?tag=road-navbar-item&encapsulation=shadow","./src/components/navbar-item/navbar-item.tsx"],"sourcesContent":["/*\n * Navbar item\n *\n * Index\n * - Native\n * - Inner\n * - Icon\n * - Badge\n */\n\n\n:host {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n flex-basis: 0;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: center;\n text-align: center;\n white-space: nowrap;\n}\n\n@media (min-width: 1200px) {\n\n :host {\n flex-grow: inherit;\n width: 100%;\n padding: 0.5rem;\n }\n\n}\n\n/**\n * Selected state\n */\n\n:host(.tab-selected),\n:host(.tab-selected) road-tooltip road-icon {\n color: var(--road-on-button-tertiary);\n fill: var(--road-on-button-tertiary);\n}\n\n:host(.tab-selected)::after {\n position: absolute;\n bottom: -12px;\n left: 0;\n display: block;\n width: 100%;\n height: 4px;\n color: var(--road-on-button-tertiary);\n content: \"\";\n background-color: var(--road-on-button-tertiary);\n}\n\n@media (min-width: 1200px) {\n\n :host(.tab-selected)::after {\n bottom: auto;\n left: 0;\n width: 4px;\n height: 100%;\n }\n\n}\n\n\n/**\n * Focus on Tab state\n */\n\n:host(.focus-visible) ::slotted(road-icon),\n:host(.focus-visible) ::slotted(road-icon)::after,\n:host(.focus-visible) ::slotted(road-label),\n:host(.focus-visible) ::slotted(road-label)::after,\n:host(:hover) ::slotted(road-icon),\n:host(:hover) ::slotted(road-icon)::after,\n:host(:hover) ::slotted(road-label),\n:host(:hover) ::slotted(road-label)::after {\n color: var(--road-on-button-tertiary);\n}\n\n\n/* NATIVE\n -------------------- */\n\n.button-native {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex-direction: inherit;\n align-items: inherit;\n justify-content: inherit;\n width: 100%;\n height: 100%;\n margin: 0;\n overflow: visible;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n color: inherit;\n text-align: inherit;\n text-decoration: none;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n cursor: pointer;\n background: transparent;\n border-color: initial;\n border-style: initial;\n border-width: 0;\n border-radius: inherit;\n border-image: initial;\n outline: 0;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n/* INNER\n -------------------- */\n\n.button-inner {\n position: relative;\n z-index: 1;\n display: flex;\n flex-flow: inherit;\n align-items: inherit;\n justify-content: inherit;\n width: 100%;\n height: 100%;\n}\n\n/* ICON\n -------------------- */\n\n::slotted(road-icon) {\n display: block;\n width: 2rem;\n height: 2rem;\n margin-right: auto;\n margin-bottom: 0.25rem;\n margin-left: auto;\n fill: currentColor;\n}\n\n/* TOOLTIP\n -------------------- */\n\n@media (min-width: 1200px) {\n\n :host ::slotted(road-tooltip) {\n width: 100%;\n }\n\n}\n\n/* LABEL\n -------------------- */\n\n::slotted(road-label) {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex: 1;\n flex-direction: column;\n font-size: var(--road-label-small);\n font-weight: 700;\n text-align: center;\n white-space: nowrap;\n}\n\n@media (min-width: 1200px) {\n\n ::slotted(road-label) {\n display: block;\n }\n}\n\n/* BADGE\n -------------------- */\n\n::slotted(road-badge) {\n position: absolute;\n top: 4px;\n left: calc(50% + 0.375rem);\n z-index: 1;\n box-sizing: border-box;\n height: auto;\n font-size: var(--road-font-size-10);\n font-weight: 400;\n}\n","import { Component, Host, h, Element, Prop, Event, EventEmitter, Listen } from '@stencil/core';\n\n/**\n * @slot - Content of the item, it should be road-icon and road-label elements.\n *\n * @part native - The native HTML anchor element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-navbar-item',\n styleUrl: 'navbar-item.css',\n shadow: true,\n})\nexport class NavbarItem {\n\n @Element() el!: HTMLRoadNavbarItemElement;\n\n /**\n * If `true`, the user cannot interact with the tab button.\n */\n @Prop() disabled = false;\n\n /**\n * This attribute instructs browsers to download a URL instead of navigating to\n * it, so the user will be prompted to save it as a local file. If the attribute\n * has a value, it is used as the pre-filled file name in the Save prompt\n * (the user can still change the file name if they want).\n */\n @Prop() download: string | undefined;\n\n /**\n * Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered.\n */\n @Prop() href: string | undefined;\n\n /**\n * Specifies the relationship of the target object to the link object.\n * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n */\n @Prop() rel: string | undefined;\n\n /**\n * The selected tab component\n */\n @Prop({ mutable: true }) selected = false;\n\n /**\n * A tab id must be provided for each `road-tab`. It's used internally to reference\n * the selected tab.\n */\n @Prop() tab?: string;\n\n /**\n * Specifies where to display the linked URL.\n * Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n */\n @Prop() target: string | undefined;\n\n /**\n * Emitted when the tab bar is clicked\n * @internal\n */\n @Event() roadnavbaritemclick!: EventEmitter;\n /** @internal */\n @Event() roadNavbarItemClick!: EventEmitter;\n\n @Listen('roadNavbarChanged', { target: 'window' })\n @Listen('roadnavbarchanged', { target: 'window' })\n onNavbarChanged(ev: CustomEvent) {\n this.selected = this.tab === ev.detail.tab;\n }\n\n private selectTab(ev: Event | KeyboardEvent) {\n if (this.tab !== undefined) {\n if (!this.disabled) {\n this.roadnavbaritemclick.emit({\n tab: this.tab,\n href: this.href,\n selected: this.selected,\n });\n this.roadNavbarItemClick.emit({\n tab: this.tab,\n href: this.href,\n selected: this.selected,\n });\n }\n if(this.href === undefined) {\n ev.preventDefault();\n }\n }\n }\n\n private onKeyUp = (ev: KeyboardEvent) => {\n if (ev.key === 'Enter' || ev.key === ' ') {\n this.selectTab(ev);\n }\n };\n\n private onClick = (ev: Event) => {\n this.selectTab(ev);\n };\n\n render() {\n const { href, rel, target, selected, tab } = this;\n const attrs = {\n download: this.download,\n href,\n rel,\n target,\n };\n\n return (\n <Host\n onClick={this.onClick}\n onKeyup={this.onKeyUp}\n role=\"tab\"\n tabindex=\"0\"\n aria-selected={selected ? 'true' : null}\n id={tab !== undefined ? `navbar-item-${tab}` : null}\n class={{\n 'navbar-item': true,\n 'tab-selected': selected,\n }}\n >\n <a {...attrs} tabIndex={-1} class=\"button-native\" part=\"native\">\n <span class=\"button-inner\">\n <slot/>\n </span>\n </a>\n </Host>\n );\n }\n\n}\n"],"mappings":"2DAAA,MAAMA,EAAgB,q6E,MCaTC,EAAU,M,2IAiFbC,KAAAC,QAAWC,IACjB,GAAIA,EAAGC,MAAQ,SAAWD,EAAGC,MAAQ,IAAK,CACxCH,KAAKI,UAAUF,E,GAIXF,KAAAK,QAAWH,IACjBF,KAAKI,UAAUF,EAAG,E,cAjFD,M,6EAyBiB,M,yCAyBpCI,gBAAgBJ,GACdF,KAAKO,SAAWP,KAAKQ,MAAQN,EAAGO,OAAOD,G,CAGjCJ,UAAUF,GAChB,GAAIF,KAAKQ,MAAQE,UAAW,CAC1B,IAAKV,KAAKW,SAAU,CAClBX,KAAKY,oBAAoBC,KAAK,CAC5BL,IAAKR,KAAKQ,IACVM,KAAMd,KAAKc,KACXP,SAAUP,KAAKO,WAEjBP,KAAKe,oBAAoBF,KAAK,CAC5BL,IAAKR,KAAKQ,IACVM,KAAMd,KAAKc,KACXP,SAAUP,KAAKO,U,CAGnB,GAAGP,KAAKc,OAASJ,UAAW,CAC1BR,EAAGc,gB,GAeTC,SACE,MAAMH,KAAEA,EAAII,IAAEA,EAAGC,OAAEA,EAAMZ,SAAEA,EAAQC,IAAEA,GAAQR,KAC7C,MAAMoB,EAAQ,CACZC,SAAUrB,KAAKqB,SACfP,OACAI,MACAC,UAGF,OACEG,EAACC,EAAI,CACHlB,QAASL,KAAKK,QACdmB,QAASxB,KAAKC,QACdwB,KAAK,MACLC,SAAS,IAAG,gBACGnB,EAAW,OAAS,KACnCoB,GAAInB,IAAQE,UAAY,eAAeF,IAAQ,KAC/CoB,MAAO,CACL,cAAe,KACf,eAAgBrB,IAGlBe,EAAA,IAAAO,OAAAC,OAAA,GAAOV,EAAK,CAAEW,UAAW,EAAGH,MAAM,gBAAgBI,KAAK,WACrDV,EAAA,QAAMM,MAAM,gBACVN,EAAA,e"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["toolbarTitleCss","ToolbarTitle","render","h","class"],"sources":["./src/components/toolbar-title/toolbar-title.css?tag=road-toolbar-title&encapsulation=shadow","./src/components/toolbar-title/toolbar-title.tsx"],"sourcesContent":["/*\n * Toolbar Title\n *\n */\n\n:host {\n display: flex;\n flex: 1;\n align-items: center;\n width: 100%;\n height: 100%;\n padding-left: 1rem;\n}\n\n.toolbar-title {\n display: block;\n width: 100%;\n overflow: hidden;\n font-size: var(--road-font-size-18);\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n pointer-events: auto;\n}\n\n@media (min-width: 1200px) {\n\n .toolbar-title {\n font-size: var(--road-font-size-21);\n }\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * @slot - Text of the title.\n */\n\n@Component({\n tag: 'road-toolbar-title',\n styleUrl: 'toolbar-title.css',\n shadow: true,\n})\nexport class ToolbarTitle {\n\n render() {\n return (\n <div class=\"toolbar-title\">\n <slot/>\n </div>\n );\n }\n\n}\n"],"mappings":"2CAAA,MAAMA,EAAkB,gV,MCWXC,EAAY,M,yBAEvBC,SACE,OACEC,EAAA,OAAKC,MAAM,iBACTD,EAAA,a"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["validateContent","svgContent","div","document","createElement","innerHTML","i","childNodes","length","nodeName","toLowerCase","removeChild","svgElm","firstElementChild","svgClass","getAttribute","setAttribute","trim","isValid","elm","nodeType","attributes","val","value","isStr","indexOf","roadillustrationContent","Map","requests","getIllustrationSvgContent","url","sanitize","req","get","fetch","then","rsp","ok","text","set","Promise","resolve","illustrationCss","Illustration","componentWillLoad","this","waitUntilVisible","el","isVisible","loadIllustration","disconnectedCallback","io","disconnect","undefined","rootMargin","cb","lazy","window","IntersectionObserver","data","isIntersecting","observe","getUrl","has","illustrationSvgContent","ariaLabel","ariaHidden","label","getName","name","illustration","replace","render","sizeClass","size","rotateClass","rotate","h","Host","class"],"sources":["./src/components/illustration/validate.ts","./src/components/illustration/request.ts","./src/components/illustration/illustration.css?tag=road-illustration&encapsulation=shadow","./src/components/illustration/illustration.tsx"],"sourcesContent":["import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string) => {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') || '';\n svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());\n\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm as any)) {\n return div.innerHTML;\n }\n }\n return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n\n for (let i = 0; i < elm.attributes.length; i++) {\n const val = elm.attributes[i].value;\n if (isStr(val) && val.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i] as any)) {\n return false;\n }\n }\n }\n return true;\n};\n","import { validateContent } from './validate';\n\nexport const roadillustrationContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>();\n\nexport const getIllustrationSvgContent = (url: string, sanitize: boolean) => {\n // see if we already have a request for this url\n let req = requests.get(url);\n\n if (!req) {\n if (typeof fetch !== 'undefined' && typeof document !== 'undefined') {\n // we don't already have a request\n // @ts-ignore\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n svgContent = validateContent(svgContent);\n }\n roadillustrationContent.set(url, svgContent || '');\n });\n }\n roadillustrationContent.set(url, '');\n });\n\n // cache for the same requests\n requests.set(url, req);\n } else {\n // set to empty for ssr scenarios and resolve promise\n roadillustrationContent.set(url, '');\n return Promise.resolve();\n }\n }\n\n return req;\n};\n","/*\n * Illustration\n *\n * Index\n * - Sizes\n * - Colors\n * - Rotation\n */\n\n:host {\n box-sizing: content-box;\n display: inline-block;\n color: var(--road-icon);\n transition: fill 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n fill: currentColor;\n contain: strict;\n}\n\n:host svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n/* SIZES\n -------------------- */\n\n:host(.illustration-sm) {\n width: 4rem;\n height: 4rem;\n}\n\n:host(.illustration-md) {\n width: 8rem;\n height: 8rem;\n}\n\n:host(.illustration-lg) {\n width: 16rem;\n height: 16rem;\n}\n\n:host(.illustration-2x) {\n width: 32rem;\n height: 32rem;\n}\n\n/* ROTATION\n -------------------- */\n\n:host(.illustration-rotate-90) {\n transform: rotate(90deg);\n}\n\n:host(.illustration-rotate-180) {\n transform: rotate(180deg);\n}\n\n:host(.illustration-rotate-270) {\n transform: rotate(270deg);\n}\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getIllustrationSvgContent, roadillustrationContent } from './request';\nimport { getName, getUrl } from './utils';\n\n@Component({\n tag: 'road-illustration',\n assetsDirs: ['svg'],\n styleUrl: 'illustration.css',\n shadow: true,\n})\nexport class Illustration {\n private io?: IntersectionObserver;\n\n @Element() el!: HTMLRoadIllustrationElement;\n\n @State() private illustrationSvgContent?: string;\n\n @State() private isVisible = false;\n\n\n\n /**\n * Specifies the label to use for accessibility. Defaults to the illustration name.\n */\n @Prop({ mutable: true, reflect: true }) ariaLabel?: string;\n\n /**\n * Set the illustration to hidden, respectively `true`, to remove it from the accessibility tree.\n */\n @Prop({ reflect: true }) ariaHidden?: string;\n\n /**\n * Specifies which illustration to use from the built-in set of illustrations.\n */\n @Prop() name?: string;\n\n /**\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n /**\n * A combination of both `name` and `src`. If a `src` url is detected\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and set the `name` property.\n */\n @Prop() illustration?: any;\n\n /**\n * The size of the illustration.\n * Available options are: `\"sm\"`, `\"md\"`, `\"lg\"`, `\"2x\"`.\n */\n @Prop() size?: 'sm' | 'md' | 'lg' | '2x' = \"2x\";\n\n /**\n * The rotation of the illustration.\n * Available options are: `\"90\"`, `\"180\"`, `\"270\"`.\n */\n @Prop() rotate?: '90' | '180' | '270';\n\n /**\n * If enabled, road-illustration will be loaded lazily when it's visible in the viewport.\n * Default, `false`.\n */\n @Prop() lazy: boolean = false;\n\n /**\n * When set to `false`, SVG content that is HTTP fetched will not be checked\n * if the response SVG content has any `<script>` elements, or any attributes\n * that start with `on`, such as `onclick`.\n */\n @Prop() sanitize = true;\n\n componentWillLoad() {\n\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIllustration();\n });\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n private waitUntilVisible(el: HTMLRoadIllustrationElement, rootMargin: string, cb: () => void) {\n if (this.lazy && (window as any).IntersectionObserver) {\n const io = this.io = new (window as any).IntersectionObserver((data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n }, { rootMargin });\n\n io.observe(el);\n\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('illustration')\n loadIllustration() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (roadillustrationContent.has(url)) {\n // sync if it's already loaded\n this.illustrationSvgContent = roadillustrationContent.get(url);\n } else {\n // async if it hasn't been loaded\n getIllustrationSvgContent(url, this.sanitize).then(() => (this.illustrationSvgContent = roadillustrationContent.get(url)));\n }\n }\n }\n\n if (!this.ariaLabel && this.ariaHidden !== 'true') {\n const label = getName(this.name, this.illustration);\n // user did not provide a label\n // come up with the label based on the icon name\n if (label) {\n this.ariaLabel = label.replace(/-/g, ' ');\n }\n }\n }\n\n render() {\n const sizeClass = this.size !== undefined ? `illustration-${this.size}` : '';\n const rotateClass = this.rotate !== undefined ? `illustration-rotate-${this.rotate}` : '';\n\n return (\n <Host class={`${sizeClass} ${rotateClass}`} aria-hidden=\"true\">\n {(\n (this.illustrationSvgContent !== '')\n ? <div class=\"icon-inner\" innerHTML={this.illustrationSvgContent}></div>\n : <div class=\"icon-inner\"></div>\n )}\n </Host>\n );\n }\n}"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["progressTrackerItemCss","ProgressTrackerItem","render","h","Host"],"sources":["./src/components/progress-tracker-item/progress-tracker-item.css?tag=road-progress-tracker-item","./src/components/progress-tracker-item/progress-tracker-item.tsx"],"sourcesContent":["/*\n * Progress tracker itel\n *\n */\n\n/* PROGRESS TRACKER ITEM\n -------------------- */\n\nroad-progress-tracker-item {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n min-height: 65px;\n}\n\n.progress-tracker-item-content {\n display: inline-block;\n margin-left: 1rem;\n}\n\n/* PROGRESS TRACKER LINK\n -------------------- */\n\n.progress-tracker-link {\n position: relative;\n z-index: 1;\n display: flex;\n margin-top: 0.4rem;\n}\n\n/* PROGRESS TRACKER ICON\n -------------------- */\n\n.progress-tracker-circle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 0.75rem;\n height: 0.75rem;\n font-size: var(--road-button-medium);\n font-weight: 700;\n background: var(--road-surface);\n border: 2px solid var(--road-on-surface-disabled);\n border-radius: 50%;\n fill: currentColor;\n}\n\n.progress-tracker-substep-circle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 0.5rem;\n height: 0.5rem;\n margin-left: 0.13rem;\n font-size: var(--road-button-medium);\n font-weight: 700;\n background: var(--road-surface);\n border: 2px solid var(--road-on-surface-disabled);\n border-radius: 50%;\n fill: currentColor;\n}\n\n.progress-tracker-line {\n position: absolute;\n top: 8px;\n left: 0.35rem;\n z-index: -1;\n height: 100%;\n border-left: 1px solid var(--road-on-surface-disabled);\n}\n\nroad-progress-tracker-item:last-child .progress-tracker-line {\n border-left: 0;\n}\n\n.before-collapse .progress-tracker-line {\n border-left: 1px dashed var(--road-on-surface-disabled);\n}\n\nroad-collapse road-progress-tracker-item:last-child .progress-tracker-line {\n border-left: 0;\n}\n\n/* PROGRESS TRACKER TITLE\n -------------------- */\n\n.progress-tracker-title {\n display: block;\n font-size: var(--road-body-large);\n font-weight: 700;\n color: var(--road-on-surface-disabled);\n}\n\n.progress-tracker-substep-title {\n display: block;\n font-size: var(--road-body-small);\n font-weight: 700;\n color: var(--road-on-surface-disabled);\n}\n\n.progress-tracker-description{\n display: block;\n margin: 0 0 2rem;\n font-size: var(--road-body-small);\n font-weight: 400;\n color: var(--road-on-surface-disabled);\n}\n\n.progress-tracker-substep-description{\n display: block;\n margin: 0 0 2rem;\n font-size: var(--road-overline);\n font-weight: 400;\n color: var(--road-on-surface-disabled);\n}\n\n/* STEP COMPLETED\n -------------------- */\n\n.completed:not(:last-child)::after {\n background: var(--road-primary);\n}\n\n.completed .progress-tracker-circle,\n.completed .progress-tracker-substep-circle{\n background: var(--road-primary);\n border: 0;\n}\n\n/* STEP CURRENT\n -------------------- */\n\n.current .progress-tracker-circle,\n.current .progress-tracker-substep-circle,\n.in-progress .progress-tracker-circle,\n.in-progress .progress-tracker-substep-circle {\n background: var(--road-surface);\n border: 1px solid var(--road-primary);\n}\n\n.completed .progress-tracker-line,\n.in-progress .progress-tracker-line {\n border-left: 1px solid var(--road-primary);\n}\n\n.current .progress-tracker-title,\n.current .progress-tracker-substep-title,\n.in-progress .progress-tracker-title,\n.in-progress .progress-tracker-substep-title,\n.completed .progress-tracker-title,\n.completed .progress-tracker-substep-title {\n font-weight: 700;\n color: var(--road-on-surface);\n}\n\n.current .progress-tracker-description,\n.current .progress-tracker-substep-description,\n.in-progress .progress-tracker-description,\n.in-progress .progress-tracker-substep-description,\n.completed .progress-tracker-description,\n.completed .progress-tracker-substep-description {\n color: var(--road-on-surface-weak);\n}\n","import { Component, Host, h } from '@stencil/core';\n\n/**\n * @slot - Content of the progress tracker item\n * it should be `<div class=\"progress-tracker-link\">`\n *`<span class=\"progress-tracker-circle\"></span>`\n *`<span class=\"progress-tracker-line\"></span>`\n *`</div>`\n *`<div class=\"progress-tracker-item-content\">`\n *`<road-label class=\"progress-tracker-title\">Label</road-label>`\n *`<road-label class=\"progress-tracker-description\">Description</road-label>`\n *`</div>`\n */\n\n@Component({\n tag: 'road-progress-tracker-item',\n styleUrl: 'progress-tracker-item.css',\n})\nexport class ProgressTrackerItem {\n\n render() {\n return (\n <Host>\n <slot/>\n </Host>\n );\n }\n}\n"],"mappings":"6CAAA,MAAMA,EAAyB,m2F,MCkBlBC,EAAmB,M,yBAE9BC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,a"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["radioGroupCss","RadioGroup","this","onClick","ev","selectedRadio","target","closest","currentValue","value","newValue","allowEmptySelection","undefined","error","radioGroupIds","radioGroupId","valueChanged","roadchange","emit","roadChange","errorChanged","el","querySelectorAll","forEach","item","componentWillLoad","render","labelId","isInvalidClass","h","Host","role","class","ariaLabel","label","id","asterisk","helper"],"sources":["./src/components/radio-group/radio-group.css?tag=road-radio-group&encapsulation=scoped","./src/components/radio-group/radio-group.tsx"],"sourcesContent":["/*\n * Radio Group\n *\n * Index\n * - Radio Group\n * - Asterisk\n * - Error\n */\n\n/**\n * Error message for inline radio can only\n * be provided by adding a class\n * .is-invalid on the .form-group of this radio\n */\n\n/**\n * @prop --asterisk-color: color of the asterisk\n */\n\n/* RADIO\n -------------------- */\n\n:host {\n --asterisk-color: var(--road-on-surface);\n\n position: relative;\n display: block;\n margin-bottom: 1rem;\n}\n\n\n/* ASTERISK\n-------------------- */\n\n.asterisk {\n color: var(--asterisk-color);\n}\n\n/* ERROR\n-------------------- */\n\n:host(.is-invalid) .invalid-feedback {\n display: block;\n}\n\n.invalid-feedback {\n display: none;\n flex: 0 0 100%;\n width: 100%;\n margin: 0.5rem 0 0;\n font-size: var(--road-font-size-12);\n color: var(--road-on-danger-surface);\n}\n\n/* HELPER\n -------------------- */\n\n.helper {\n margin-top: 0.5rem;\n font-size: var(--road-font-size-12);\n color: var(--road-on-surface-weak);\n}\n","import { Component, Element, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\n\n/**\n * @slot - Used to add multiple radio components.\n */\n\n@Component({\n tag: 'road-radio-group',\n styleUrl: 'radio-group.css',\n scoped: true,\n})\nexport class RadioGroup {\n\n @Element() el!: HTMLRoadRadioGroupElement;\n\n /**\n * The id of checkbox\n */\n @Prop() radioGroupId: string = `road-radio-group-${radioGroupIds++}`;\n\n /**\n * If `true`, the radios can be deselected.\n */\n @Prop() allowEmptySelection = false;\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name: string = this.radioGroupId;\n\n /**\n * the value of the radio group.\n */\n @Prop({ mutable: true }) value?: any | null;\n\n /**\n * Label for the field\n */\n @Prop() label?: string;\n\n /**\n * add an asterisk to the label of the field\n */\n @Prop() asterisk?: boolean = false;\n\n /**\n * Label for the field\n */\n @Prop({reflect: true}) ariaLabel: string = `${this.radioGroupId}-label`;\n\n /**\n * Error message for the radio group\n */\n @Prop({ mutable: true }) error?: string;\n\n /**\n * Helper message for the radio group\n */\n @Prop() helper?: string;\n\n @Watch('value')\n valueChanged(value: any | undefined) {\n this.roadchange.emit({ value });\n this.roadChange.emit({ value });\n }\n\n /**\n * Emitted when the value has changed.\n */\n @Event() roadchange!: EventEmitter<{\n value: string | undefined | null\n }>;\n /** @internal */\n @Event() roadChange!: EventEmitter<{\n value: string | undefined | null\n }>;\n\n private onClick = (ev: Event) => {\n const selectedRadio = ev.target && (ev.target as HTMLElement).closest('road-radio');\n if (selectedRadio) {\n const currentValue = this.value;\n const newValue = (selectedRadio as HTMLRoadRadioElement).value;\n if (newValue !== currentValue) {\n this.value = newValue;\n } else if (this.allowEmptySelection) {\n this.value = undefined;\n }\n this.error = undefined;\n }\n };\n\n @Watch('error')\n errorChanged() {\n if (this.error !== undefined && this.error !== '') {\n this.el.querySelectorAll('road-radio').forEach(item => item.error = true);\n } else {\n this.el.querySelectorAll('road-radio').forEach(item => item.error = false);\n }\n }\n\n componentWillLoad() {\n if (this.error !== undefined && this.error !== '') {\n this.el.querySelectorAll('road-radio').forEach(item => item.error = true);\n }\n }\n\n render() {\n const labelId = `${this.radioGroupId}-label`;\n const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';\n\n return (\n <Host\n role=\"radiogroup\"\n class={`form-group ${isInvalidClass}`}\n aria-label={this.ariaLabel}\n onClick={this.onClick}\n >\n {this.label && <p class=\"text-content\" id={labelId}>{this.label} {this.asterisk && <span class=\"asterisk\">*</span>}</p>}\n <slot/>\n {this.error && this.error !== '' && <p class=\"invalid-feedback\">{this.error}</p>}\n {this.helper && this.helper !== '' && <p class=\"helper\">{this.helper}</p>}\n </Host>\n );\n }\n}\n\nlet radioGroupIds = 0;\n"],"mappings":"gEAAA,MAAMA,EAAgB,6hB,MCWTC,EAAU,M,uGAkEbC,KAAAC,QAAWC,IACjB,MAAMC,EAAgBD,EAAGE,QAAWF,EAAGE,OAAuBC,QAAQ,cACtE,GAAIF,EAAe,CACjB,MAAMG,EAAeN,KAAKO,MAC1B,MAAMC,EAAYL,EAAuCI,MACzD,GAAIC,IAAaF,EAAc,CAC7BN,KAAKO,MAAQC,C,MACR,GAAIR,KAAKS,oBAAqB,CACnCT,KAAKO,MAAQG,S,CAEfV,KAAKW,MAAQD,S,qBArEc,oBAAoBE,M,yBAKrB,M,UAKPZ,KAAKa,a,wDAeE,M,eAKa,GAAGb,KAAKa,qB,2CAanDC,aAAaP,GACXP,KAAKe,WAAWC,KAAK,CAAET,UACvBP,KAAKiB,WAAWD,KAAK,CAAET,S,CA6BzBW,eACE,GAAIlB,KAAKW,QAAUD,WAAaV,KAAKW,QAAU,GAAI,CACjDX,KAAKmB,GAAGC,iBAAiB,cAAcC,SAAQC,GAAQA,EAAKX,MAAQ,M,KAC/D,CACLX,KAAKmB,GAAGC,iBAAiB,cAAcC,SAAQC,GAAQA,EAAKX,MAAQ,O,EAIxEY,oBACE,GAAIvB,KAAKW,QAAUD,WAAaV,KAAKW,QAAU,GAAI,CACjDX,KAAKmB,GAAGC,iBAAiB,cAAcC,SAAQC,GAAQA,EAAKX,MAAQ,M,EAIxEa,SACE,MAAMC,EAAU,GAAGzB,KAAKa,qBACxB,MAAMa,EAAiB1B,KAAKW,QAAUD,WAAaV,KAAKW,QAAU,GAAK,aAAe,GAEtF,OACEgB,EAACC,EAAI,CACHC,KAAK,aACLC,MAAO,cAAcJ,IAAgB,aACzB1B,KAAK+B,UACjB9B,QAASD,KAAKC,SAEbD,KAAKgC,OAASL,EAAA,KAAGG,MAAM,eAAeG,GAAIR,GAAUzB,KAAKgC,MAAK,IAAGhC,KAAKkC,UAAYP,EAAA,QAAMG,MAAM,YAAU,MACzGH,EAAA,aACC3B,KAAKW,OAASX,KAAKW,QAAU,IAAMgB,EAAA,KAAGG,MAAM,oBAAoB9B,KAAKW,OACrEX,KAAKmC,QAAUnC,KAAKmC,SAAW,IAAMR,EAAA,KAAGG,MAAM,UAAU9B,KAAKmC,Q,uGAMtE,IAAIvB,EAAgB,E"}
@@ -1,2 +0,0 @@
1
- import{r as e,e as s,h as r,H as t}from"./p-abdbf6ac.js";const l='.sc-road-select-h{position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);color:var(--road-on-surface)}.form-select.sc-road-select{box-sizing:border-box;display:block;width:100%;height:3rem;padding:0.75rem 3rem 0 1rem;margin:0;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=") no-repeat right 1rem center/1.5rem 2rem;background-color:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0.25rem;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.form-select.sc-road-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000000}.form-select.sc-road-select::-ms-expand{display:none}.form-select.sc-road-select::placeholder{color:var(--road-on-surface-extra-weak)}@media (hover: hover){.form-select.sc-road-select:not(:disabled):hover{border-color:var(--road-input-outline-variant)}}.form-select.sc-road-select:focus~.form-select-label.sc-road-select,.form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.form-select.has-value.sc-road-select~.form-select-label.sc-road-select{transform:scale(0.625) translateY(-0.625rem)}.form-select.sc-road-select:not(:disabled):focus{border-color:var(--road-input-outline-variant);outline:0}.form-select.sc-road-select:disabled,.form-select[readonly].sc-road-select{color:var(--road-on-surface-disabled);cursor:not-allowed;background-color:var(--road-surface-disabled);opacity:1}.form-select-label.sc-road-select{position:absolute;top:0.75rem;left:1rem;display:block;font-size:var(--road-label-medium);line-height:1.5;color:var(--road-on-surface-extra-weak);pointer-events:none;transition:transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;transform-origin:0 0}.form-select.sc-road-select:required~.form-select-label.sc-road-select::after{color:var(--road-on-danger-surface);content:" *"}.select-xl.sc-road-select-h .form-select.sc-road-select{height:3.5rem;padding:1rem 1rem 0}.select-xl.sc-road-select-h .form-select-label.sc-road-select{top:1rem}.select-xl.sc-road-select-h .form-select.sc-road-select:focus~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select.has-value.sc-road-select~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[type="date"].sc-road-select~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[type="time"].sc-road-select~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-xl.sc-road-select-h .form-select.sc-road-select:placeholder-shown~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-md.sc-road-select-h .form-select.sc-road-select{height:2.5rem;padding:1rem 1rem 0;font-size:var(--road-body-small)}.select-md.sc-road-select-h .form-select-label.sc-road-select{top:0.5rem}.select-md.sc-road-select-h .form-select.sc-road-select:focus~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select.has-value.sc-road-select~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[type="date"].sc-road-select~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[type="time"].sc-road-select~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-md.sc-road-select-h .form-select.sc-road-select:placeholder-shown~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.invalid-feedback.sc-road-select{display:none;width:100%;margin-top:0.5rem;font-size:var(--road-body-small);color:var(--road-on-danger-surface)}.form-select.is-invalid.sc-road-select,.was-validated.sc-road-select .form-select.sc-road-select:invalid{border-color:var(--road-on-danger-surface)}.form-select.is-invalid.sc-road-select~.invalid-feedback.sc-road-select,.was-validated.sc-road-select .form-select.sc-road-select:invalid~.invalid-feedback.sc-road-select{display:block}';const a=class{constructor(r){e(this,r);this.roadchange=s(this,"roadchange",7);this.roadChange=s(this,"roadChange",7);this.roadfocus=s(this,"roadfocus",7);this.roadFocus=s(this,"roadFocus",7);this.roadblur=s(this,"roadblur",7);this.roadBlur=s(this,"roadBlur",7);this.onChange=e=>{const s=e.target;if(s){this.value=s.value||""}};this.onBlur=()=>{this.roadblur.emit();this.roadBlur.emit()};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.selectId=`road-select-${c++}`;this.options=[];this.autofocus=false;this.disabled=false;this.name=this.selectId;this.required=false;this.size=0;this.sizes="xl";this.label=`${this.selectId}-label`;this.error=undefined;this.value=undefined}valueChanged(){this.roadchange.emit({value:this.value});this.roadChange.emit({value:this.value})}render(){const e=this.selectId+"-label";const s=this.value&&this.value!==""?"has-value":"";const l=this.error!==undefined&&this.error!==""?"is-invalid":"";return r(t,{class:this.sizes&&`select-${this.sizes}`},r("select",{class:`form-select ${s} ${l}`,id:this.selectId,"aria-disabled":this.disabled?"true":null,autoFocus:this.autofocus,disabled:this.disabled,name:this.name,required:this.required,size:this.size,onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur},r("option",{selected:true,disabled:true,hidden:true,style:{display:"none"},value:""}),this.options&&this.options.map((e=>r("option",{value:e.value,selected:e.selected},e.label)))),r("label",{class:"form-select-label",id:e,htmlFor:this.selectId},this.label),this.error&&this.error!==""&&r("p",{class:"invalid-feedback"},this.error))}static get watchers(){return{value:["valueChanged"]}}};let c=0;a.style=l;export{a as road_select};
2
- //# sourceMappingURL=p-7589e2bb.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["accordionCss","Accordion","this","onClick","isOpen","render","accordionLight","isLight","accordionLightHeader","accordionLightContent","accordionLightSeparator","isLightSeparator","accordionSmall","isSmall","h","class","open","tabindex","role","name","icon","navigationChevron"],"sources":["./src/components/accordion/accordion.css?tag=road-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":["/*\n * Accordion\n *\n * For accessibility, we provide a style for focus only on Tab.\n * For enable this focus, load the javascript polyfill for focus-visible\n * (https://github.com/WICG/focus-visible).\n *\n * Index\n * - Accordion\n * - Button\n * - Content\n */\n\n/**\n * @prop --accordion-header-border: height of the border of the header\n * @prop --content-margin: margin of the accordion content\n * @prop --content-padding: padding of the accordion content\n * @prop --header-padding: padding of the accordion header\n * @prop --icon-color: color of the chevron icon\n * @prop --max-height: maximum height of the collapse content\n */\n\n:host {\n --accordion-header-border: 1px;\n --content-margin: 0 1rem 0.75rem;\n --content-padding: 0.75rem 0 0;\n --header-padding: 0.75rem 1rem;\n --icon-color: var(--road-icon);\n --max-height: none;\n\n display: block;\n margin-bottom: 1rem;\n}\n\n/* ACCORDION\n -------------------- */\n\n.accordion {\n --max-height: none;\n overflow: hidden;\n font-family: var(--road-font, sans-serif);\n font-size: var(--road-body-small);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: var(--road-surface);\n border: 1px solid;\n border-color: var(--road-outline-weak);\n border-radius: 0.25rem;\n transition: max-height 0.3s ease-in-out;\n}\n\n.accordion.accordion-light {\n border: 0;\n}\n\n/**\n * Open state\n */\n\n.accordion[open] {\n max-height: var(--max-height);\n}\n\n.accordion[open] .accordion-arrow {\n transform: rotate(-90deg);\n}\n\n.accordion[open] .accordion-content {\n padding: var(--content-padding);\n margin: var(--content-margin);\n}\n\n.accordion-light[open] .accordion-light-content {\n padding: 0.75rem 0;\n margin: 0 1rem 0.75rem;\n}\n\n.accordion-light[open] .accordion-light-header::after {\n display: none;\n}\n\n/* BUTTON\n -------------------- */\n\n.accordion-trigger {\n box-sizing: border-box;\n display: block;\n border: 1px solid transparent;\n border-radius: 0.25rem;\n outline: 0;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n.accordion-trigger::-webkit-details-marker { /* Remove chrome native arrow */\n display: none;\n}\n\n/**\n * Focus on Tab\n */\n\n.accordion-trigger.focus-visible {\n border-color: var(--road-primary);\n}\n\n/**\n * Active state\n */\n\n.accordion-trigger:active {\n background: var(--road-surface-inverse);\n}\n\n/**\n * .accordion-header is an additionnal div\n * because Safari doesn't support flexbox on <summary> element\n */\n\n.accordion-header {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n padding: var(--header-padding);\n font-size: var(--road-body-medium);\n font-weight: 700;\n cursor: pointer;\n user-select: none;\n}\n\n.accordion-light-header {\n position: relative;\n font-size: var(--road-body-large);\n}\n\n.accordion-light--small .accordion-light-header {\n font-size: var(--road-body-medium);\n}\n\n.accordion-light--border .accordion-light-header::after {\n position: absolute;\n bottom: 1px;\n width: 98.3%;\n height: 1px;\n content: \"\";\n background: var(--road-outline-weak);\n}\n\n/**\n * Custom arrow\n */\n\n.accordion-arrow {\n margin-left: auto;\n color: var(--icon-color);\n transform: rotate(90deg);\n}\n\n.accordion-light--small .accordion-arrow {\n width: 1.5rem;\n height: 1.5rem;\n}\n\n::slotted([slot=\"header\"]){\n display: flex;\n align-items: center;\n}\n\n:host(.accordion-icon-left){\n width: 1.5rem;\n height: 1.5rem;\n margin-right: 1rem;\n}\n\n/* CONTENT\n -------------------- */\n\n.accordion-content {\n padding: 0 0.5rem;\n margin: 0 1rem;\n overflow: hidden;\n font-size: var(--road-body-medium);\n border-top: var(--accordion-header-border) solid var(--road-outline-weak);\n}\n\n.accordion-light-content {\n border-top: 1px solid var(--road-outline-weak);\n}\n\n.accordion-light--border .accordion-light-content {\n border-top: 1px solid var(--road-outline-weak);\n border-bottom: 1px solid var(--road-outline-weak);\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { navigationChevron } from '../../../icons';\nimport './../../utils/polyfill';\n\n/**\n * @slot header - Content of the header.\n * @slot - Content hidden in the accordion.\n * @slot icon-left - Icon of the alert, it should be a road-icon element.\n * `<road-icon name=\"alert-info-outline\" class=\"mr-16\"></road-icon>`\n\n */\n\n@Component({\n tag: 'road-accordion',\n styleUrl: 'accordion.css',\n shadow: true,\n})\nexport class Accordion {\n\n /**\n * Set to `true` to open the accordion and to `false` to close it.\n */\n @Prop({ mutable: true }) isOpen : boolean = false;\n\n /**\n * Set to `true` to remove border the accordion and to `false` to add border it.\n */\n @Prop() isLight : boolean = false;\n\n /**\n * Set to `true` to add a border in the header and the content only for the light accordion.\n */\n @Prop() isLightSeparator : boolean = false;\n\n /**\n * Set to `true` to add the small version only for the light accordion.\n */\n @Prop() isSmall : boolean = false;\n\n /**\n * Toggle the display when clicking header\n */\n private onClick = () => {\n this.isOpen = !this.isOpen;\n };\n\n render() {\n\n const accordionLight = this.isLight ? 'accordion accordion-light' : 'accordion';\n const accordionLightHeader = this.isLight ? 'accordion-header accordion-light-header' : 'accordion-header';\n const accordionLightContent = this.isLight ? 'accordion-content accordion-light-content' : 'accordion-content';\n const accordionLightSeparator = this.isLightSeparator ? 'accordion accordion-light accordion-light--border' : 'accordion';\n const accordionSmall = this.isSmall ? 'accordion accordion-light accordion-light--small' : 'accordion';\n return (\n <details class={`${accordionLight} ${accordionSmall} ${accordionLightSeparator}`} open={this.isOpen}>\n <summary class=\"accordion-trigger\" aria-expanded={`${this.isOpen}`} tabindex=\"0\" role=\"button\" onClick={this.onClick}>\n <div class={accordionLightHeader}>\n <slot name=\"icon-left\"/>\n <slot name=\"header\"/>\n <road-icon class=\"accordion-arrow\" icon={navigationChevron}></road-icon>\n </div>\n </summary>\n <div class={accordionLightContent}>\n <slot/>\n </div>\n </details>\n );\n }\n}"],"mappings":"uGAAA,MAAMA,EAAe,k7E,MCiBRC,EAAS,M,yBAyBZC,KAAAC,QAAU,KAChBD,KAAKE,QAAUF,KAAKE,MAAM,E,YArBgB,M,aAKf,M,sBAKU,M,aAKT,K,CAS9BC,SAEE,MAAMC,EAAiBJ,KAAKK,QAAU,4BAA8B,YACpE,MAAMC,EAAuBN,KAAKK,QAAU,0CAA4C,mBACxF,MAAME,EAAwBP,KAAKK,QAAU,4CAA8C,oBAC3F,MAAMG,EAA0BR,KAAKS,iBAAmB,oDAAsD,YAC9G,MAAMC,EAAiBV,KAAKW,QAAU,mDAAqD,YAC3F,OACEC,EAAA,WAASC,MAAO,GAAGT,KAAkBM,KAAkBF,IAA2BM,KAAMd,KAAKE,QAC3FU,EAAA,WAASC,MAAM,oBAAmB,gBAAgB,GAAGb,KAAKE,SAAUa,SAAS,IAAIC,KAAK,SAASf,QAASD,KAAKC,SAC3GW,EAAA,OAAKC,MAAOP,GACVM,EAAA,QAAMK,KAAK,cACXL,EAAA,QAAMK,KAAK,WACXL,EAAA,aAAWC,MAAM,kBAAkBK,KAAMC,MAG7CP,EAAA,OAAKC,MAAON,GACVK,EAAA,c"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["CACHED_MAP","getIllustrationMap","window","Map","win","Ionicons","map","addIllustrations","illustrations","Object","keys","forEach","name","set","getUrl","i","url","getSrc","src","getName","illustration","getNamedUrl","illustrationName","get","getAssetPath","isSrc","isStr","toLower","trim","invalidChars","replace","str","length","test","val","toLowerCase"],"sources":["./src/components/illustration/utils.ts"],"sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { Illustration } from './illustration';\n\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const getIllustrationMap = (): Map<string, string> => {\n if (typeof window === 'undefined') {\n return new Map();\n } else {\n if (!CACHED_MAP) {\n const win = window as any;\n win.Ionicons = win.Ionicons || {};\n CACHED_MAP = win.Ionicons.map = win.Ionicons.map || new Map();\n }\n return CACHED_MAP;\n }\n};\n\nexport const addIllustrations = (illustrations: { [name: string]: string; }) => {\n const map = getIllustrationMap();\n Object.keys(illustrations).forEach(name => map.set(name, illustrations[name]));\n};\n\n\nexport const getUrl = (i: Illustration) => {\n let url = getSrc(i.src);\n if (url) {\n return url;\n }\n\n url = getName(i.name, i.illustration);\n if (url) {\n return getNamedUrl(url);\n }\n\n if (i.illustration) {\n url = getSrc(i.illustration);\n if (url) {\n return url;\n }\n }\n\n return null;\n};\n\n\nconst getNamedUrl = (illustrationName: string) => {\n const url = getIllustrationMap().get(illustrationName);\n if (url) {\n return url;\n }\n return getAssetPath(`svg/${illustrationName}.svg`);\n};\n\n\nexport const getName = (\n illustrationName: string | undefined,\n illustration: string | undefined\n) => {\n\n if (!illustrationName && illustration && !isSrc(illustration)) {\n illustrationName = illustration;\n }\n if (isStr(illustrationName)) {\n illustrationName = toLower(illustrationName);\n }\n\n if (!isStr(illustrationName) || illustrationName.trim() === '') {\n return null;\n }\n\n // only allow alpha characters and dash\n const invalidChars = illustrationName.replace(/[a-z]|-|\\d/gi, '');\n if (invalidChars !== '') {\n return null;\n }\n\n return illustrationName;\n};\n\nexport const getSrc = (src: string | undefined) => {\n if (isStr(src)) {\n src = src.trim();\n if (isSrc(src)) {\n return src;\n }\n }\n return null;\n};\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/|\\.)/.test(str);\n\nexport const isStr = (val: any): val is string => typeof val === 'string';\n\nexport const toLower = (val: string) => val.toLowerCase();"],"mappings":"oCAIA,IAAIA,EAEG,MAAMC,EAAqB,KAChC,UAAWC,SAAW,YAAa,CACjC,OAAO,IAAIC,G,KACN,CACL,IAAKH,EAAY,CACf,MAAMI,EAAMF,OACZE,EAAIC,SAAWD,EAAIC,UAAY,GAC/BL,EAAaI,EAAIC,SAASC,IAAMF,EAAIC,SAASC,KAAO,IAAIH,G,CAE1D,OAAOH,C,SAIEO,EAAoBC,IAC/B,MAAMF,EAAML,IACZQ,OAAOC,KAAKF,GAAeG,SAAQC,GAAQN,EAAIO,IAAID,EAAMJ,EAAcI,KAAO,E,MAInEE,EAAUC,IACrB,IAAIC,EAAMC,EAAOF,EAAEG,KACnB,GAAIF,EAAK,CACP,OAAOA,C,CAGTA,EAAMG,EAAQJ,EAAEH,KAAMG,EAAEK,cACxB,GAAIJ,EAAK,CACP,OAAOK,EAAYL,E,CAGrB,GAAID,EAAEK,aAAc,CAClBJ,EAAMC,EAAOF,EAAEK,cACf,GAAIJ,EAAK,CACP,OAAOA,C,EAIX,OAAO,IAAI,EAIb,MAAMK,EAAeC,IACnB,MAAMN,EAAMf,IAAqBsB,IAAID,GACrC,GAAIN,EAAK,CACP,OAAOA,C,CAET,OAAOQ,EAAa,OAAOF,QAAuB,E,MAIvCH,EAAU,CACrBG,EACAF,KAGA,IAAKE,GAAoBF,IAAiBK,EAAML,GAAe,CAC7DE,EAAmBF,C,CAErB,GAAIM,EAAMJ,GAAmB,CAC3BA,EAAmBK,EAAQL,E,CAG7B,IAAKI,EAAMJ,IAAqBA,EAAiBM,SAAW,GAAI,CAC9D,OAAO,I,CAIT,MAAMC,EAAeP,EAAiBQ,QAAQ,eAAgB,IAC9D,GAAID,IAAiB,GAAI,CACvB,OAAO,I,CAGT,OAAOP,CAAgB,EAGlB,MAAML,EAAUC,IACrB,GAAIQ,EAAMR,GAAM,CACdA,EAAMA,EAAIU,OACV,GAAIH,EAAMP,GAAM,CACd,OAAOA,C,EAGX,OAAO,IAAI,EAGN,MAAMO,EAASM,GAAgBA,EAAIC,OAAS,GAAK,UAAUC,KAAKF,G,MAE1DL,EAASQ,UAAmCA,IAAQ,SAE1D,MAAMP,EAAWO,GAAgBA,EAAIC,qB"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["textCss","Text","render","colorClass","this","color","undefined","h","Host","class"],"sources":["./src/components/text/text.css?tag=road-text&encapsulation=shadow","./src/components/text/text.tsx"],"sourcesContent":["/*\n * Text\n *\n * Index\n * - Colors\n */\n\n/* COLORS\n -------------------- */\n\n/**\n * Primary\n */\n\n:host(.text-primary) {\n color: var(--road-primary-10);\n}\n\n/**\n * Secondary\n */\n\n:host(.text-secondary) {\n color: var(--road-secondary);\n}\n\n/**\n * Accent\n */\n\n:host(.text-accent) {\n color: var(--road-secondary-50);\n}\n\n/**\n * Info\n */\n\n:host(.text-info) {\n color: var(--road-on-info-surface);\n}\n\n/**\n * Success\n */\n\n:host(.text-success) {\n color: var(--road-on-success-surface);\n}\n\n/**\n * Warning\n */\n\n:host(.text-warning) {\n color: var(--road-on-warning-surface);\n}\n\n/**\n * Danger\n */\n\n:host(.text-danger) {\n color: var(--road-on-danger-surface);\n}\n\n/**\n * Default\n */\n\n:host(.text-default) {\n color: var(--road-on-surface);\n}\n\n/**\n * Default second\n */\n\n:host(.text-default-second) {\n color: var(--road-grey-40);\n}\n\n/**\n * Disabled\n */\n\n:host(.text-disabled) {\n color: var(--road-grey-60);\n}\n\n/**\n * White\n */\n\n:host(.text-white) {\n color: var(--road-grey-100-new);\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n/**\n * @slot - Content of the text.\n */\n\n@Component({\n tag: 'road-text',\n styleUrl: 'text.css',\n shadow: true,\n})\nexport class Text {\n\n /**\n * Color of the text.\n */\n @Prop() color?: 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'danger' | 'default' | 'default-second' | 'disabled' | 'white' = 'default';\n\n render() {\n const colorClass = this.color !== undefined ? `text-${this.color}` : '';\n\n return (\n <Host class={`${colorClass}`}>\n <slot/>\n </Host>\n );\n }\n\n}\n"],"mappings":"kDAAA,MAAMA,EAAU,qkB,MCWHC,EAAI,M,oCAKwI,S,CAEvJC,SACE,MAAMC,EAAaC,KAAKC,QAAUC,UAAY,QAAQF,KAAKC,QAAU,GAErE,OACEE,EAACC,EAAI,CAACC,MAAO,GAAGN,KACdI,EAAA,a"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["toastCss","Toast","this","onClick","ev","stopPropagation","preventDefault","close","isOpenChanged","isOpen","timeout","setTimeout","async","onClose","emit","componentDidLoad","render","toastIsOpenClass","icon","color","alertInfoOutline","alertSuccessOutline","alertWarningOutline","alertDangerOutline","h","Host","class","role","label","type","navigationClose","size","name"],"sources":["./src/components/toast/toast.css?tag=road-toast&encapsulation=shadow","./src/components/toast/toast.tsx"],"sourcesContent":["/*\n * Toast\n *\n *\n * Index\n * - Container\n * - Toast\n * - Feedback color\n * - Feedback icon\n * - Close button\n */\n\n\n/* CONTAINER\n -------------------- */\n\n:host {\n position: fixed;\n right: 0;\n bottom: 1rem;\n left: 0;\n z-index: 1;\n display: flex;\n justify-content: center;\n width: 328px;\n margin: 0 auto;\n pointer-events: none;\n visibility: hidden;\n opacity: 0;\n transition: opacity .3s ease-in-out,visibility .15s,transform .3s ease-in-out;\n transform: translateY(-100%);\n}\n\n@media (min-width: 1200px) {\n\n :host {\n right: 1.5rem;\n bottom: 3rem;\n left: auto;\n width: auto;\n transform: translateX(100%);\n }\n}\n\n/**\n * Open state\n */\n\n:host(.toast-open) {\n visibility: visible;\n opacity: 1;\n transform: none;\n}\n\n/* TOAST\n -------------------- */\n\n.toast {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex: 0 0 100%;\n flex-flow: wrap;\n align-items: flex-start;\n width: 328px;\n padding: 0.75rem 2rem 0.6rem 1rem;\n font-family: var(--road-font);\n font-size: var(--road-body-medium);\n line-height: 1.4;\n color: var(--road-on-info-surface-inverse);\n text-align: left;\n background: var(--road-info-surface-inverse);\n border-radius: 0.25rem;\n}\n\n@media (min-width: 575px) {\n\n .toast {\n padding: 1rem;\n margin-right: auto;\n margin-left: auto;\n }\n}\n\n/* FEEDBACK COLOR\n -------------------- */\n\n/**\n * Danger\n */\n\n.toast-danger {\n color: var(--road-on-danger-surface-inverse);\n pointer-events: all;\n background: var(--road-danger-surface-inverse);\n}\n\n.toast-danger road-icon {\n color: var(--road-danger-icon-inverse);\n}\n\n/**\n * Warning\n */\n\n.toast-warning {\n color: var(--road-on-warning-surface-inverse);\n background: var(--road-warning-surface-inverse);\n}\n\n.toast-warning road-icon {\n color: var(--road-warning-icon-inverse);\n}\n\n/**\n * Success\n */\n\n.toast-success {\n color: var(--road-on-success-surface-inverse);\n background: var(--road-success-surface-inverse);\n}\n\n.toast-success road-icon {\n color: var(--road-success-icon-inverse);\n}\n\n/**\n * Info\n */\n\n.toast-info {\n color: var(--road-on-info-surface-inverse);\n background: var(--road-info-surface-inverse);\n}\n\n.toast-info road-icon {\n color: var(--road-info-icon-inverse);\n}\n\n/* FEEDBACK ICON\n -------------------- */\n\n.toast-icon {\n top: auto;\n left: 0.5rem;\n margin-top: -5px;\n margin-right: 0.5rem;\n}\n\n@media (min-width: 575px) {\n\n .toast-icon {\n position: relative;\n top: auto;\n left: auto;\n margin-right: 0.5rem;\n }\n}\n\n/* CLOSE BUTTON\n -------------------- */\n\n.toast-close {\n position: absolute;\n right: 0.5rem;\n padding: 0;\n color: inherit;\n cursor: pointer;\n background: none;\n border: 0;\n border-radius: 4px;\n fill: var(--road-info-icon-inverse);\n}\n\n.toast-warning .toast-close {\n fill: var(--road-warning-icon-inverse);\n}\n\n\n/**\n * Focus state\n */\n\n.toast-close:focus {\n border-color: var(--road-info-surface-inverse);\n outline: none;\n}\n\n/* TOAST LABEL\n -------------------- */\n\n.toast-label{\n width: 240px;\n margin: 0;\n}\n\n/* TOAST PORGRESS BAR\n -------------------- */\n\n:host ::slotted(road-progress) {\n position: absolute;\n bottom: -8px;\n left: 0;\n flex-basis: 100%;\n width: 100%;\n margin-top: 0.5rem;\n}\n\n/* ANIMATION\n -------------------- */\n\n\n@keyframes load {\n\n 0% {\n width: 0;\n }\n\n 100% {\n width: 100%;\n }\n}\n","import { Component, Event, EventEmitter, Host, Method, Prop, Watch, h } from '@stencil/core';\nimport { FeedbackColors } from '../../interface';\nimport { navigationClose, alertDangerOutline, alertInfoOutline, alertSuccessOutline, alertWarningOutline } from '../../../icons';\n\n\n/**\n *\n * @slot progress - the progress bar in the toast.\n * color=\"info\" for Info\n * color=\"success\" for success\n * color=\"warning\" for warning\n * color=\"danger\" for danger\n */\n\n@Component({\n tag: 'road-toast',\n styleUrl: 'toast.css',\n shadow: true,\n})\nexport class Toast {\n\n /**\n * Set `open` propertie to `true` to open the toast\n */\n @Prop({ mutable: true }) isOpen: boolean = false;\n\n /**\n * Set the color of the toast. e.g. info, success, warning, danger\n */\n @Prop() color: FeedbackColors = 'info';\n\n /**\n * Text display in the toast\n */\n @Prop() label?: string;\n\n /**\n * How many milliseconds to wait before hiding the toast. if `\"0\"`, it will show\n * until `close()` is called.\n */\n @Prop() timeout: number = 5000;\n\n /**\n * Indicate when closing the toast\n */\n @Event({ eventName: 'close' }) onClose!: EventEmitter<void>;\n\n /**\n * Watch the isOpen property to start the timeout before closing\n */\n @Watch('isOpen')\n isOpenChanged() {\n if (this.isOpen && this.timeout > 0) {\n setTimeout(() => this.close(), this.timeout);\n }\n }\n\n /**\n * Open the toast\n */\n @Method()\n async open() {\n this.isOpen = true;\n if(this.timeout > 0) {\n setTimeout(() => {\n this.close();\n }, this.timeout);\n }\n }\n\n /**\n * Close the toast\n */\n @Method()\n async close() {\n this.isOpen = false;\n this.onClose.emit();\n }\n\n /**\n * Close the dialog when clicking on the cross or layer\n */\n private onClick = (ev: UIEvent) => {\n ev.stopPropagation();\n ev.preventDefault();\n\n this.close();\n };\n\n componentDidLoad() {\n if (this.isOpen && this.timeout > 0) {\n setTimeout(() => this.close(), this.timeout);\n }\n }\n\n render() {\n const toastIsOpenClass = this.isOpen ? 'toast-open' : '';\n let icon;\n switch(this.color) {\n case 'info':\n icon = alertInfoOutline;\n break;\n case 'success':\n icon = alertSuccessOutline;\n break;\n case 'warning':\n icon = alertWarningOutline;\n break;\n case 'danger':\n icon = alertDangerOutline;\n break;\n default:\n icon = alertInfoOutline;\n break;\n }\n\n if (this.color =='danger') {\n this.timeout = 0\n }\n\n return (\n <Host class={`${toastIsOpenClass}`} role=\"alert\">\n <div class={`toast toast-${this.color}`}>\n <road-icon class=\"toast-icon\" icon={icon} aria-hidden=\"true\"></road-icon>\n <p class=\"toast-label\">{this.label}</p>\n <button type=\"button\" class=\"toast-close\" aria-label=\"Close\" onClick={this.onClick}>\n <road-icon icon={navigationClose} size=\"md\"></road-icon>\n </button>\n <slot name=\"progress\"/>\n </div>\n </Host>\n );\n }\n}"],"mappings":"oHAAA,MAAMA,EAAW,wrE,MCmBJC,EAAK,M,wDA+DRC,KAAAC,QAAWC,IACjBA,EAAGC,kBACHD,EAAGE,iBAEHJ,KAAKK,OAAO,E,YA9D6B,M,WAKX,O,kCAWN,G,CAW1BC,gBACE,GAAIN,KAAKO,QAAUP,KAAKQ,QAAU,EAAG,CACnCC,YAAW,IAAMT,KAAKK,SAASL,KAAKQ,Q,EAQxCE,aACEV,KAAKO,OAAS,KACd,GAAGP,KAAKQ,QAAU,EAAG,CACnBC,YAAW,KACTT,KAAKK,OAAO,GACXL,KAAKQ,Q,EAQZE,cACEV,KAAKO,OAAS,MACdP,KAAKW,QAAQC,M,CAafC,mBACE,GAAIb,KAAKO,QAAUP,KAAKQ,QAAU,EAAG,CACnCC,YAAW,IAAMT,KAAKK,SAASL,KAAKQ,Q,EAIxCM,SACE,MAAMC,EAAmBf,KAAKO,OAAS,aAAe,GACtD,IAAIS,EACJ,OAAOhB,KAAKiB,OACZ,IAAK,OACHD,EAAOE,EACP,MACF,IAAK,UACHF,EAAOG,EACP,MACF,IAAK,UACHH,EAAOI,EACP,MACF,IAAK,SACHJ,EAAOK,EACP,MACF,QACEL,EAAOE,EACP,MAGF,GAAIlB,KAAKiB,OAAQ,SAAU,CACzBjB,KAAKQ,QAAU,C,CAGjB,OACEc,EAACC,EAAI,CAACC,MAAO,GAAGT,IAAoBU,KAAK,SACvCH,EAAA,OAAKE,MAAO,eAAexB,KAAKiB,SAC9BK,EAAA,aAAWE,MAAM,aAAaR,KAAMA,EAAI,cAAc,SACtDM,EAAA,KAAGE,MAAM,eAAexB,KAAK0B,OAC7BJ,EAAA,UAAQK,KAAK,SAASH,MAAM,cAAa,aAAY,QAAQvB,QAASD,KAAKC,SACzEqB,EAAA,aAAWN,KAAMY,EAAiBC,KAAK,QAEzCP,EAAA,QAAMQ,KAAK,c"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["durationCss","Duration","handleClick","event","this","roadselected","emit","value","detail","toString","label","close","async","isOpen","render","h","position","header","class","Array","Math","floor","max","min","step","fill","map","item","index","button","toLocaleString","minimumIntegerDigits","useGrouping"],"sources":["./src/components/duration/duration.css?tag=road-duration&encapsulation=shadow","./src/components/duration/duration.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\nroad-drawer {\n --background: var(--road-surface-inverse);\n}\n\n.duration-values {\n flex-wrap: nowrap;\n width: 100%;\n padding: 2.625rem 0 2.625rem 3rem;\n scroll-snap-type: x proximity;\n overflow: scroll;\n}\n\n.duration-values > road-col:first-child {\n scroll-snap-align: center;\n}\n\n.duration-values > road-col:not(:first-child) {\n scroll-snap-align: start;\n}\n\nroad-card {\n --margin-bottom: 0;\n}\n\nroad-card::part(native) {\n padding: 1rem;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Method, Prop } from '@stencil/core';\n\n@Component({\n tag: 'road-duration',\n styleUrl: 'duration.css',\n shadow: true,\n})\nexport class Duration {\n\n /**\n * Current reference of the duration element\n */\n @Element() el!: HTMLRoadDurationElement;\n\n /**\n * Set isOpen property to true to open the duration widget\n */\n @Prop({ mutable: true }) isOpen: boolean = false;\n\n /**\n * title of the widget\n */\n @Prop() header: string = 'duration';\n\n /**\n * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.\n */\n @Prop() min: number = 15;\n\n /**\n * The maximum value, which must not be less than its minimum (min attribute) value in minutes.\n */\n @Prop() max: number = 300;\n\n /**\n * Works with the min and max attributes to limit the increments at which a value can be set in minutes.\n */\n @Prop() step: number = 15;\n\n @Listen('roadcardclick')\n handleClick(event: CustomEvent) {\n this.roadselected.emit({\n value: event.detail.value.toString(),\n label: event.detail.label,\n });\n this.close();\n }\n\n /**\n * Emitt the value and label of the selected option.\n */\n @Event() roadselected!: EventEmitter<{\n value: string | undefined | null,\n label: string\n }>;\n\n /**\n * Open the widget\n */\n @Method()\n async open() {\n this.isOpen = true;\n }\n\n /**\n * Close the widget\n */\n @Method()\n async close() {\n this.isOpen = false;\n }\n\n render() {\n return (\n <road-drawer is-open={this.isOpen} position=\"bottom\" drawer-title={this.header}>\n <road-grid>\n <road-row class=\"duration-values\">\n {Array(Math.floor((this.max - this.min) / this.step) + 1).fill(this.min).map(((item, index) => (item + index * this.step))).map(item =>\n <road-col class=\"col-3 col-md-2\">\n <road-card button value={item}>\n <road-label>\n {Math.floor(item / 60).toLocaleString(\"en-GB\", {minimumIntegerDigits: 2, useGrouping: false})}:{(item % 60).toLocaleString(\"en-GB\", {minimumIntegerDigits: 2, useGrouping: false})}\n </road-label>\n </road-card>\n </road-col>\n )}\n </road-row>\n </road-grid>\n </road-drawer>\n );\n }\n\n}\n"],"mappings":"oDAAA,MAAMA,EAAc,2Y,MCOPC,EAAQ,M,gFAUwB,M,YAKlB,W,SAKH,G,SAKA,I,UAKC,E,CAGvBC,YAAYC,GACVC,KAAKC,aAAaC,KAAK,CACrBC,MAAOJ,EAAMK,OAAOD,MAAME,WAC1BC,MAAOP,EAAMK,OAAOE,QAEtBN,KAAKO,O,CAePC,aACER,KAAKS,OAAS,I,CAOhBD,cACER,KAAKS,OAAS,K,CAGhBC,SACE,OACEC,EAAA,yBAAsBX,KAAKS,OAAQG,SAAS,SAAQ,eAAeZ,KAAKa,QACtEF,EAAA,iBACEA,EAAA,YAAUG,MAAM,mBACbC,MAAMC,KAAKC,OAAOjB,KAAKkB,IAAMlB,KAAKmB,KAAOnB,KAAKoB,MAAQ,GAAGC,KAAKrB,KAAKmB,KAAKG,KAAG,CAAGC,EAAMC,IAAWD,EAAOC,EAAQxB,KAAKoB,OAAQE,KAAIC,GAC9HZ,EAAA,YAAUG,MAAM,kBACdH,EAAA,aAAWc,OAAM,KAACtB,MAAOoB,GACvBZ,EAAA,kBACGK,KAAKC,MAAMM,EAAO,IAAIG,eAAe,QAAS,CAACC,qBAAsB,EAAGC,YAAa,QAAO,KAAIL,EAAO,IAAIG,eAAe,QAAS,CAACC,qBAAsB,EAAGC,YAAa,e"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["segmentedButtonsCss","Tabs","this","transitioning","onTabClicked","ev","tab","detail","select","async","tabs","length","componentWillRender","buttonBar","el","querySelector","selectedTab","undefined","getTab","shouldSwitch","setActive","tabSwitch","getSelected","Promise","resolve","reject","leavingTab","roadTabsWillChange","emit","active","roadTabsDidChange","Array","from","querySelectorAll","render","h","Host","onRoadSegmentedButtonClick","name","tabEl","find","t","console","error"],"sources":["./src/components/segmented-buttons/segmented-buttons.css?tag=road-segmented-buttons&encapsulation=shadow","./src/components/segmented-buttons/segmented-buttons.tsx"],"sourcesContent":["/*\n * Segmented buttons\n *\n */\n\n:host {\n position: relative;\n display: block;\n}\n","import { Component, Element, Event, EventEmitter, Host, Method, State, h } from '@stencil/core';\n\n/**\n * @slot - Content is placed between the named slots if provided without a slot.\n * @slot top - Content is placed at the top of the screen.\n */\n@Component({\n tag: 'road-segmented-buttons',\n styleUrl: 'segmented-buttons.css',\n shadow: true,\n})\nexport class Tabs {\n\n private transitioning = false;\n private leavingTab?: HTMLRoadTabElement;\n\n @Element() el!: HTMLRoadTabsElement;\n\n @State() selectedTab?: HTMLRoadTabElement;\n\n /**\n * Emitted when the navigation is about to transition to a new component.\n */\n @Event({ bubbles: false }) roadtabswillchange!: EventEmitter<{tab: string}>;\n /** @internal */\n @Event({ bubbles: false }) roadTabsWillChange!: EventEmitter<{tab: string}>;\n\n /**\n * Emitted when the navigation has finished transitioning to a new component.\n */\n @Event({ bubbles: false }) roadtabsdidchange!: EventEmitter<{tab: string}>;\n /** @internal */\n @Event({ bubbles: false }) roadTabsDidChange!: EventEmitter<{tab: string}>;\n\n async componentWillLoad() {\n const tabs = this.tabs;\n if (tabs.length > 0) {\n this.select(tabs[0]);\n }\n }\n\n componentWillRender() {\n const buttonBar = this.el.querySelector('road-segmented-button-bar');\n if (buttonBar) {\n const tab = this.selectedTab ? this.selectedTab.tab : undefined;\n buttonBar.selectedTab = tab;\n }\n }\n\n /**\n * Select a tab by the value of its `tab` property or an element reference.\n *\n * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.\n */\n @Method()\n async select(tab: string | HTMLRoadTabElement): Promise<boolean> {\n const selectedTab = getTab(this.tabs, tab);\n if (!this.shouldSwitch(selectedTab)) {\n return false;\n }\n await this.setActive(selectedTab);\n this.tabSwitch();\n\n return true;\n }\n\n /**\n * Get a specific tab by the value of its `tab` property or an element reference.\n *\n * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.\n */\n @Method()\n async getTab(tab: string | HTMLRoadTabElement): Promise<HTMLRoadTabElement | undefined> {\n return getTab(this.tabs, tab);\n }\n\n /**\n * Get the currently selected tab.\n */\n @Method()\n getSelected(): Promise<string | undefined> {\n return Promise.resolve(this.selectedTab ? this.selectedTab.tab : undefined);\n }\n\n private setActive(selectedTab: HTMLRoadTabElement): Promise<void> {\n if (this.transitioning) {\n return Promise.reject('transitioning already happening');\n }\n\n this.transitioning = true;\n this.leavingTab = this.selectedTab;\n this.selectedTab = selectedTab;\n this.roadTabsWillChange.emit({ tab: selectedTab.tab });\n selectedTab.active = true;\n return Promise.resolve();\n }\n\n private tabSwitch() {\n const selectedTab = this.selectedTab;\n const leavingTab = this.leavingTab;\n\n this.leavingTab = undefined;\n this.transitioning = false;\n if (!selectedTab) {\n return;\n }\n\n if (leavingTab !== selectedTab) {\n if (leavingTab) {\n leavingTab.active = false;\n }\n this.roadTabsDidChange.emit({ tab: selectedTab.tab });\n }\n }\n\n private shouldSwitch(selectedTab: HTMLRoadTabElement | undefined): selectedTab is HTMLRoadTabElement {\n const leavingTab = this.selectedTab;\n return selectedTab !== undefined && selectedTab !== leavingTab && !this.transitioning;\n }\n\n private get tabs() {\n return Array.from(this.el.querySelectorAll('road-tab'));\n }\n\n private onTabClicked = (ev: CustomEvent) => {\n const { tab } = ev.detail;\n this.select(tab);\n };\n\n render() {\n\n return (\n <Host\n onRoadSegmentedButtonClick={this.onTabClicked}>\n <slot name=\"top\"/>\n <slot/>\n </Host>\n );\n }\n}\n\nconst getTab = (tabs: HTMLRoadTabElement[], tab: string | HTMLRoadTabElement): HTMLRoadTabElement | undefined => {\n const tabEl = (typeof tab === 'string')\n ? tabs.find(t => t.tab === tab)\n : tab;\n\n if (!tabEl) {\n console.error(`tab with id: \"${tabEl}\" does not exist`);\n }\n return tabEl;\n};"],"mappings":"gEAAA,MAAMA,EAAsB,yC,MCWfC,EAAI,M,iPAEPC,KAAAC,cAAgB,MA+GhBD,KAAAE,aAAgBC,IACtB,MAAMC,IAAEA,GAAQD,EAAGE,OACnBL,KAAKM,OAAOF,EAAI,E,2BA5FlBG,0BACE,MAAMC,EAAOR,KAAKQ,KAClB,GAAIA,EAAKC,OAAS,EAAG,CACnBT,KAAKM,OAAOE,EAAK,G,EAIrBE,sBACE,MAAMC,EAAYX,KAAKY,GAAGC,cAAc,6BACxC,GAAIF,EAAW,CACb,MAAMP,EAAMJ,KAAKc,YAAcd,KAAKc,YAAYV,IAAMW,UACtDJ,EAAUG,YAAcV,C,EAU5BG,aAAaH,GACX,MAAMU,EAAcE,EAAOhB,KAAKQ,KAAMJ,GACtC,IAAKJ,KAAKiB,aAAaH,GAAc,CACnC,OAAO,K,OAEHd,KAAKkB,UAAUJ,GACrBd,KAAKmB,YAEL,OAAO,I,CASTZ,aAAaH,GACX,OAAOY,EAAOhB,KAAKQ,KAAMJ,E,CAO3BgB,cACE,OAAOC,QAAQC,QAAQtB,KAAKc,YAAcd,KAAKc,YAAYV,IAAMW,U,CAG3DG,UAAUJ,GAChB,GAAId,KAAKC,cAAe,CACtB,OAAOoB,QAAQE,OAAO,kC,CAGxBvB,KAAKC,cAAgB,KACrBD,KAAKwB,WAAaxB,KAAKc,YACvBd,KAAKc,YAAcA,EACnBd,KAAKyB,mBAAmBC,KAAK,CAAEtB,IAAKU,EAAYV,MAChDU,EAAYa,OAAS,KACrB,OAAON,QAAQC,S,CAGTH,YACN,MAAML,EAAcd,KAAKc,YACzB,MAAMU,EAAaxB,KAAKwB,WAExBxB,KAAKwB,WAAaT,UAClBf,KAAKC,cAAgB,MACrB,IAAKa,EAAa,CAChB,M,CAGF,GAAIU,IAAeV,EAAa,CAC9B,GAAIU,EAAY,CACdA,EAAWG,OAAS,K,CAEtB3B,KAAK4B,kBAAkBF,KAAK,CAAEtB,IAAKU,EAAYV,K,EAI3Ca,aAAaH,GACnB,MAAMU,EAAaxB,KAAKc,YACxB,OAAOA,IAAgBC,WAAaD,IAAgBU,IAAexB,KAAKC,a,CAG9DO,WACV,OAAOqB,MAAMC,KAAK9B,KAAKY,GAAGmB,iBAAiB,Y,CAQ7CC,SAEE,OACEC,EAACC,EAAI,CACHC,2BAA4BnC,KAAKE,cACjC+B,EAAA,QAAMG,KAAK,QACTH,EAAA,a,2BAMV,MAAMjB,EAAS,CAACR,EAA4BJ,KAC1C,MAAMiC,SAAgBjC,IAAQ,SAC1BI,EAAK8B,MAAKC,GAAKA,EAAEnC,MAAQA,IACzBA,EAEJ,IAAKiC,EAAO,CACVG,QAAQC,MAAM,iBAAiBJ,oB,CAEjC,OAAOA,CAAK,E"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["bannerCss","Banner","this","onClick","ev","stopPropagation","preventDefault","close","async","isOpen","onClose","emit","render","bannerIsOpenClass","h","Host","class","label","link","href","url","type","icon","navigationClose","size"],"sources":["./src/components/banner/banner.css?tag=road-banner&encapsulation=shadow","./src/components/banner/banner.tsx"],"sourcesContent":["/* BANNER\n -------------------- */\n\n:host{\n display: none;\n}\n\n:host(.banner-open) {\n position: relative;\n display: block;\n padding: 1rem 2rem;\n font-size: var(--road-body-medium);\n text-align: center;\n background-color: var(--road-leading-banner);\n}\n\n.banner-close{\n position: absolute;\n top: 0;\n right: 0;\n padding: 0.25rem;\n color: currentColor;\n cursor: pointer;\n background: none;\n border: 0;\n}\n\n.banner-close road-icon{\n color: currentColor;\n}\n\n.banner-open-label{\n font-weight: 700;\n}\n\n.banner-open-link{\n display: block;\n margin: 0.25rem 0.75rem;\n font-size: var(--road-font-size-14);\n color: currentColor;\n}\n\n@media (min-width: 992px) {\n\n .banner-close{\n right: 0.25rem;\n bottom: 0;\n }\n\n .banner-open-link{\n display: initial;\n }\n}\n","import { Component, Host, h, Prop, Method, Event, EventEmitter} from '@stencil/core';\nimport { navigationClose } from '../../../icons';\n\n@Component({\n tag: 'road-banner',\n styleUrl: 'banner.css',\n shadow: true,\n})\nexport class Banner {\n\n /**\n * Set `open` property to `true` to open the banner\n */\n @Prop({ mutable: true }) isOpen: boolean = true;\n\n /**\n * Text display in the banner\n */\n @Prop() label: string = '';\n\n /**\n * Text Link display in the banner\n */\n @Prop() link?: string;\n\n /**\n * Text Link display in the banner\n */\n @Prop() url?: string;\n\n /**\n * Close the dialog when clicking on the cross or layer\n */\n private onClick = (ev: UIEvent) => {\n ev.stopPropagation();\n ev.preventDefault();\n\n this.close();\n };\n\n /**\n * Close the banner\n */\n @Method()\n async close() {\n this.isOpen = false;\n this.onClose.emit();\n }\n\n /**\n * Indicate when closing the banner\n */\n @Event({ eventName: 'close' }) onClose!: EventEmitter<void>;\n\n render() {\n const bannerIsOpenClass = this.isOpen ? 'banner-open' : '';\n\n return (\n <Host class={bannerIsOpenClass}>\n <div>\n <span class=\"banner-open-label\">{this.label}</span>\n {this.link && <a href={this.url} class=\"banner-open-link\">{this.link}</a>}\n <button type=\"button\" class=\"banner-close\" onClick={this.onClick}>\n <road-icon icon={navigationClose} size=\"md\"></road-icon>\n </button>\n </div>\n </Host>\n );\n }\n\n}\n"],"mappings":"6FAAA,MAAMA,EAAY,klB,MCQLC,EAAM,M,wDAyBTC,KAAAC,QAAWC,IACjBA,EAAGC,kBACHD,EAAGE,iBAEHJ,KAAKK,OAAO,E,YAxB6B,K,WAKnB,G,uCA0BxBC,cACEN,KAAKO,OAAS,MACdP,KAAKQ,QAAQC,M,CAQfC,SACE,MAAMC,EAAoBX,KAAKO,OAAS,cAAgB,GAExD,OACEK,EAACC,EAAI,CAACC,MAAOH,GACXC,EAAA,WACEA,EAAA,QAAME,MAAM,qBAAqBd,KAAKe,OACrCf,KAAKgB,MAAQJ,EAAA,KAAGK,KAAMjB,KAAKkB,IAAKJ,MAAM,oBAAoBd,KAAKgB,MAChEJ,EAAA,UAAQO,KAAK,SAASL,MAAM,eAAeb,QAASD,KAAKC,SACvDW,EAAA,aAAWQ,KAAMC,EAAiBC,KAAK,S"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["textareaCss","Textarea","this","onInput","ev","input","target","value","roadinput","emit","roadInput","onBlur","roadblur","roadBlur","onFocus","roadfocus","roadFocus","textareaIds","textareaId","valueChanged","roadchange","roadChange","getValue","render","labelId","hasValueClass","noResizeClass","resize","isInvalidClass","error","undefined","h","Host","disabled","class","sizes","id","autoCapitalize","autocapitalize","autoFocus","autofocus","enterKeyHint","enterkeyhint","inputMode","inputmode","maxLength","maxlength","minLength","minlength","name","placeholder","readOnly","readonly","required","spellcheck","cols","rows","wrap","htmlFor","label","helper"],"sources":["./src/components/textarea/textarea.css?tag=road-textarea&encapsulation=scoped","./src/components/textarea/textarea.tsx"],"sourcesContent":["/*\n * Textarea\n *\n * Index\n * - Input\n * - Textarea\n * - Label\n * - Sizes\n * - Error\n * - Helper\n */\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/* INPUT\n -------------------- */\n\n.form-control {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: 3rem;\n padding: 0.75rem 1rem 0;\n margin: 0;\n font-size: var(--road-body-medium);\n color: var(--road-on-surface);\n background: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n/**\n * Placeholder\n */\n\n.form-control::placeholder {\n color: var(--road-on-surface-extra-weak);\n opacity: 1;\n}\n\n/**\n * Hover state\n */\n\n@media (hover: hover) {\n\n .form-control:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/**\n * Focus state\n */\n\n.form-control:focus ~ .form-label,\n.form-control[required]:valid ~ .form-label,\n.form-control.has-value ~ .form-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-control:placeholder-shown ~ .form-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n/* stylelint-disable */\n\n/* IE FIX */\n\n.form-control:-ms-input-placeholder ~ .form-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n/* stylelint-enable */\n\n.form-control:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/**\n * Disabled state\n */\n\n.form-control:disabled,\n.form-control[readonly] {\n color: var(--road-on-surface-weak);\n cursor: not-allowed;\n background: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/* TEXTAREA\n -------------------- */\n\n.textarea-control {\n height: auto;\n padding-top: 1rem;\n padding-bottom: 0.5rem;\n line-height: 1.5;\n}\n\n.textarea-control.no-resize {\n resize: none;\n}\n\n/* LABEL\n -------------------- */\n\n.form-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n/* SIZES\n -------------------- */\n\n:host(.input-xl) {\n --height: 3.5rem;\n}\n\n:host(.input-xl) .form-control {\n padding: 1.5rem 1rem 0.5rem;\n}\n\n:host(.input-xl) .form-label {\n top: 1rem;\n}\n\n:host(.input-xl) .form-control:focus ~ .form-label,\n:host(.input-xl) .form-control[required]:valid ~ .form-label,\n:host(.input-xl) .form-control.has-value ~ .form-label,\n:host(.input-xl) .form-control[type=\"date\"] ~ .form-label,\n:host(.input-xl) .form-control[type=\"time\"] ~ .form-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.input-xl) .form-control:placeholder-shown ~ .form-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n\n/* ERROR\n -------------------- */\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-helper-medium);\n color: var(--road-on-danger-surface);\n}\n\n.form-control.is-invalid,\n.was-validated .form-control:invalid {\n border-color: var(--road-danger-outline);\n}\n\n.form-control.is-invalid ~ .invalid-feedback,\n.was-validated .form-control:invalid ~ .invalid-feedback {\n display: block;\n}\n\n/* HELPER\n -------------------- */\n\n.helper {\n margin-top: 0.5rem;\n font-size: var(--road-helper-medium);\n color: var(--road-grey-500);\n}\n","import { Component, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'road-textarea',\n styleUrl: 'textarea.css',\n scoped: true,\n})\nexport class Textarea {\n\n /**\n * The id of textarea\n */\n @Prop() textareaId: string = `road-textarea-${textareaIds++}`;\n\n /**\n * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.\n */\n @Prop() autocapitalize: string = 'none';\n\n /**\n * This Boolean attribute lets you specify that a form control should have focus when the page loads.\n */\n @Prop() autofocus: boolean = false;\n\n /**\n * If `true`, the user cannot interact with the textarea.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * A hint to the browser for which keyboard to display.\n * This attribute applies when the value of the type attribute is `\"text\"`, `\"password\"`, `\"email\"`, or `\"url\"`. Possible values are: `\"verbatim\"`, `\"latin\"`, `\"latin-name\"`, `\"latin-prose\"`, `\"full-width-latin\"`, `\"kana\"`, `\"katakana\"`, `\"numeric\"`, `\"tel\"`, `\"email\"`, `\"url\"`.\n */\n @Prop() inputmode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search';\n\n /**\n * A hint to the browser for which enter key to display.\n * Possible values: `\"enter\"`, `\"done\"`, `\"go\"`, `\"next\"`,\n * `\"previous\"`, `\"search\"`, and `\"send\"`.\n */\n @Prop() enterkeyhint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';\n\n /**\n * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the maximum number of characters that the user can enter.\n */\n @Prop() maxlength?: number;\n\n /**\n * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the minimum number of characters that the user can enter.\n */\n @Prop() minlength?: number;\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name: string = this.textareaId;\n\n /**\n * Instructional text that shows before the textarea has a value.\n */\n @Prop() placeholder?: string;\n\n /**\n * The sizes of the input.\n */\n @Prop() sizes: 'lg' | 'xl' = 'lg';\n\n /**\n * If `true`, the user cannot modify the value.\n */\n @Prop() readonly: boolean = false;\n\n /**\n * If `true`, the user must fill in a value before submitting a form.\n */\n @Prop() required: boolean = false;\n\n /**\n * If `true`, the element will have its spelling and grammar checked.\n */\n @Prop() spellcheck: boolean = false;\n\n /**\n * If `false`, to disabled resize.\n */\n @Prop() resize: boolean = true;\n\n /**\n * The visible width of the text control, in average character widths. If it is specified, it must be a positive integer.\n */\n @Prop() cols?: number;\n\n /**\n * The number of rows of the control.\n */\n @Prop() rows?: number;\n\n /**\n * Indicates how the control wraps text.\n */\n @Prop() wrap?: 'hard' | 'soft' | 'off';\n\n /**\n * The value of the textarea.\n */\n @Prop({ mutable: true }) value?: string | null = '';\n\n /**\n * Label for the field\n */\n @Prop() label: string = `${this.textareaId}-label`;\n\n /**\n * Error message for the field\n */\n @Prop() error?: string;\n\n /**\n * Helper message for the field\n */\n @Prop() helper?: string;\n\n /**\n * Update the native textarea element when the value changes\n */\n @Watch('value')\n protected valueChanged() {\n this.roadchange.emit({ value: this.value });\n this.roadChange.emit({ value: this.value });\n }\n\n /**\n * Emitted when a keyboard input occurred.\n */\n @Event() roadinput!: EventEmitter<KeyboardEvent>;\n /** @internal */\n @Event() roadInput!: EventEmitter<KeyboardEvent>;\n\n /**\n * Emitted when the value has changed.\n */\n @Event() roadchange!: EventEmitter<{\n value: string | undefined | null\n }>;\n /** @internal */\n @Event() roadChange!: EventEmitter<{\n value: string | undefined | null\n }>;\n\n /**\n * Emitted when the textarea loses focus.\n */\n @Event() roadblur!: EventEmitter<void>;\n /** @internal */\n @Event() roadBlur!: EventEmitter<void>;\n\n /**\n * Emitted when the textarea has focus.\n */\n @Event() roadfocus!: EventEmitter<void>;\n /** @internal */\n @Event() roadFocus!: EventEmitter<void>;\n\n private getValue(): string {\n return this.value || '';\n }\n\n private onInput = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.roadinput.emit(ev as KeyboardEvent);\n this.roadInput.emit(ev as KeyboardEvent);\n };\n\n private onBlur = () => {\n this.roadblur.emit();\n this.roadBlur.emit();\n };\n\n private onFocus = () => {\n this.roadfocus.emit();\n this.roadFocus.emit();\n };\n\n render() {\n const value = this.getValue();\n const labelId = this.textareaId + '-label';\n const hasValueClass = this.value !== '' ? 'has-value' : '';\n const noResizeClass = this.resize == false ? 'no-resize' : '';\n const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';\n\n return (\n <Host aria-disabled={this.disabled ? 'true' : null} class={this.sizes && `input-${this.sizes}`}>\n <textarea\n class={`form-control textarea-control ${hasValueClass} ${noResizeClass} ${isInvalidClass}`}\n id={this.textareaId}\n aria-disabled={this.disabled ? 'true' : null}\n aria-labelledby={labelId}\n disabled={this.disabled}\n autoCapitalize={this.autocapitalize}\n autoFocus={this.autofocus}\n enterKeyHint={this.enterkeyhint}\n inputMode={this.inputmode}\n maxLength={this.maxlength}\n minLength={this.minlength}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n value={value}\n spellcheck={this.spellcheck}\n cols={this.cols}\n rows={this.rows}\n wrap={this.wrap}\n onInput={this.onInput}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n >\n </textarea>\n <label class=\"form-label\" id={labelId} htmlFor={this.textareaId}>{this.label}</label>\n {this.error && this.error !== '' && <p class=\"invalid-feedback\">{this.error}</p>}\n {this.helper && this.helper !== '' && <p class=\"helper\">{this.helper}</p>}\n </Host>\n );\n }\n\n}\n\nlet textareaIds = 0;\n"],"mappings":"yDAAA,MAAMA,EAAc,23G,MCOPC,EAAQ,M,iUAgKXC,KAAAC,QAAWC,IACjB,MAAMC,EAAQD,EAAGE,OACjB,GAAID,EAAO,CACTH,KAAKK,MAAQF,EAAME,OAAS,E,CAE9BL,KAAKM,UAAUC,KAAKL,GACpBF,KAAKQ,UAAUD,KAAKL,EAAoB,EAGlCF,KAAAS,OAAS,KACfT,KAAKU,SAASH,OACdP,KAAKW,SAASJ,MAAM,EAGdP,KAAAY,QAAU,KAChBZ,KAAKa,UAAUN,OACfP,KAAKc,UAAUP,MAAM,E,gBA3KM,iBAAiBQ,M,oBAKb,O,eAKJ,M,cAKD,M,iHA4BLf,KAAKgB,W,sCAUE,K,cAKF,M,cAKA,M,gBAKE,M,YAKF,K,uEAoBqB,G,WAKzB,GAAGhB,KAAKgB,mB,2CAgBtBC,eACRjB,KAAKkB,WAAWX,KAAK,CAAEF,MAAOL,KAAKK,QACnCL,KAAKmB,WAAWZ,KAAK,CAAEF,MAAOL,KAAKK,O,CAmC7Be,WACN,OAAOpB,KAAKK,OAAS,E,CAsBvBgB,SACE,MAAMhB,EAAQL,KAAKoB,WACnB,MAAME,EAAUtB,KAAKgB,WAAa,SAClC,MAAMO,EAAgBvB,KAAKK,QAAU,GAAK,YAAc,GACxD,MAAMmB,EAAgBxB,KAAKyB,QAAU,MAAQ,YAAc,GAC3D,MAAMC,EAAiB1B,KAAK2B,QAAUC,WAAa5B,KAAK2B,QAAU,GAAK,aAAe,GAEtF,OACEE,EAACC,EAAI,iBAAgB9B,KAAK+B,SAAW,OAAS,KAAMC,MAAOhC,KAAKiC,OAAS,SAASjC,KAAKiC,SACrFJ,EAAA,YACEG,MAAO,iCAAiCT,KAAiBC,KAAiBE,IAC1EQ,GAAIlC,KAAKgB,WAAU,gBACJhB,KAAK+B,SAAW,OAAS,KAAI,kBAC3BT,EACjBS,SAAU/B,KAAK+B,SACfI,eAAgBnC,KAAKoC,eACrBC,UAAWrC,KAAKsC,UAChBC,aAAcvC,KAAKwC,aACnBC,UAAWzC,KAAK0C,UAChBC,UAAW3C,KAAK4C,UAChBC,UAAW7C,KAAK8C,UAChBC,KAAM/C,KAAK+C,KACXC,YAAahD,KAAKgD,YAClBC,SAAUjD,KAAKkD,SACfC,SAAUnD,KAAKmD,SACf9C,MAAOA,EACP+C,WAAYpD,KAAKoD,WACjBC,KAAMrD,KAAKqD,KACXC,KAAMtD,KAAKsD,KACXC,KAAMvD,KAAKuD,KACXtD,QAASD,KAAKC,QACdQ,OAAQT,KAAKS,OACbG,QAASZ,KAAKY,UAGhBiB,EAAA,SAAOG,MAAM,aAAaE,GAAIZ,EAASkC,QAASxD,KAAKgB,YAAahB,KAAKyD,OACtEzD,KAAK2B,OAAS3B,KAAK2B,QAAU,IAAME,EAAA,KAAGG,MAAM,oBAAoBhC,KAAK2B,OACrE3B,KAAK0D,QAAU1D,KAAK0D,SAAW,IAAM7B,EAAA,KAAGG,MAAM,UAAUhC,KAAK0D,Q,wDAOtE,IAAI3C,EAAc,E"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["progressCss","ProgressBar","render","valueRound","Math","round","this","value","fullwidth","light","animation","h","Host","class","color","role","style","width","label","showstep","numbersteps"],"sources":["./src/components/progress/progress.css?tag=road-progress&encapsulation=shadow","./src/components/progress/progress.tsx"],"sourcesContent":["/*\n * Progress\n *\n * Index\n * - Progress\n * - Progress Bar\n * - Colors\n */\n\n/**\n * @prop --border-radius: Border radius of the progress\n */\n\n/* PROGRESS\n -------------------- */\n\n.progress{\n --border-radius: 0.25rem;\n\n display: flex;\n height: 0.25rem;\n overflow: hidden;\n font-size: var(--road-label-small);\n background-color: var(--road-surface-disabled);\n border-radius: var(--border-radius);\n}\n\n.progress-light{\n background-color: var(--road-overlay-inverse);\n}\n\n\n.progress-element-info {\n display: flex;\n justify-content: space-between;\n margin-top: 0.5rem;\n}\n\n.progress-element-info-full-width {\n display: flex;\n justify-content: space-between;\n padding: 0 1rem;\n margin-top: 0.5rem;\n}\n\n.progress-element-label {\n font-size: var(--road-label-medium);\n text-align: left;\n}\n\n.progress-element-step {\n font-size: var(--road-label-medium);\n text-align: right;\n}\n\n/* PROGRESS BAR\n -------------------- */\n\n.progress-bar {\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n text-align: center;\n white-space: nowrap;\n transition: width 0.6s ease;\n}\n\n/* COLORS\n -------------------- */\n\n.progress.progress-primary .progress-bar {\n background: var(--road-primary);\n}\n\n.progress.progress-secondary .progress-bar {\n background: var(--road-secondary);\n}\n\n.progress.progress-info .progress-bar {\n background: var(--road-info-surface-inverse);\n}\n\n.progress.progress-success .progress-bar {\n background: var(--road-success-surface-inverse);\n}\n\n.progress.progress-warning .progress-bar {\n background: var(--road-warning-surface-inverse);\n}\n\n.progress.progress-danger .progress-bar {\n background: var(--road-danger-surface-inverse);\n}\n\n.progress.progress-rating .progress-bar {\n background: var(--road-rating);\n}\n\n\n/* ANIMATION\n -------------------- */\n\n.animation .progress-bar{\n animation: load 5s normal forwards;\n}\n\n@keyframes load {\n\n 0% {\n width: 0;\n }\n\n 100% {\n width: 100%;\n }\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'road-progress',\n styleUrl: 'progress.css',\n shadow: true,\n})\nexport class ProgressBar {\n\n /**\n * The value determines how much of the active bar should display.\n * The value should be between [0, 100].\n */\n @Prop() value: number = 0;\n\n /**\n * The number of steps should be 4 or 5.\n */\n @Prop() numbersteps?: '4' | '5' | 'default' = '4';\n\n /**\n * Label display in progress bar\n */\n @Prop() label: string = '';\n\n /**\n * Show step\n */\n @Prop() showstep: boolean = false;\n\n /**\n * Animation progress bar\n */\n @Prop() animation: boolean = false;\n\n /**\n * Light progress background\n */\n @Prop() light: boolean = false;\n\n /**\n * Add padding if the progress is full width\n */\n @Prop() fullwidth: boolean = false;\n\n /**\n * The color to use from your application's color palette.\n */\n @Prop() color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'rating' = 'primary';\n\n render() {\n\n const valueRound = Math.round(this.value/5/5);\n const fullwidth = this.fullwidth ? 'progress-element-info-full-width' : 'progress-element-info';\n const light = this.light ? 'progress progress-light' : 'progress';\n const animation = this.animation ? 'animation' : '';\n\n return (\n <Host class=\"progress-element\">\n <div class={`${light} progress-${this.color} ${animation}`}>\n <div class=\"progress-bar\" role=\"progressbar\" style={{ width: `${this.value}%` }} aria-valuenow={this.value} aria-valuemin=\"0\" aria-valuemax=\"100\"></div>\n </div>\n <div class={`${fullwidth}`}>\n <span class=\"progress-element-label\">{this.label}</span>\n {this.showstep && <span class=\"progress-element-step\">{valueRound}/{this.numbersteps}</span>}\n </div>\n </Host>\n );\n }\n\n}\n"],"mappings":"6CAAA,MAAMA,EAAc,04C,MCOPC,EAAW,M,oCAME,E,iBAKuB,I,WAKpB,G,cAKC,M,eAKG,M,WAKN,M,eAKK,M,WAKkE,S,CAEhGC,SAEE,MAAMC,EAAaC,KAAKC,MAAMC,KAAKC,MAAM,EAAE,GAC3C,MAAMC,EAAYF,KAAKE,UAAY,mCAAqC,wBACxE,MAAMC,EAAQH,KAAKG,MAAQ,0BAA4B,WACvD,MAAMC,EAAYJ,KAAKI,UAAY,YAAc,GAEjD,OACEC,EAACC,EAAI,CAACC,MAAM,oBACVF,EAAA,OAAKE,MAAO,GAAGJ,cAAkBH,KAAKQ,SAASJ,KAC7CC,EAAA,OAAKE,MAAM,eAAeE,KAAK,cAAcC,MAAO,CAAEC,MAAO,GAAGX,KAAKC,UAAU,gBAAiBD,KAAKC,MAAK,gBAAgB,IAAG,gBAAe,SAE9II,EAAA,OAAKE,MAAO,GAAGL,KACbG,EAAA,QAAME,MAAM,0BAA0BP,KAAKY,OAC1CZ,KAAKa,UAAYR,EAAA,QAAME,MAAM,yBAAyBV,EAAU,IAAGG,KAAKc,c"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["segmentedButtonCss","SegmentedButton","this","onKeyUp","ev","key","selectTab","onClick","onButtonBarChanged","dispatchedFrom","target","parent","el","parentElement","composedPath","includes","contains","selected","tab","detail","undefined","roadsegmentedbuttonclick","emit","roadSegmentedButtonClick","preventDefault","tabIndex","hasTabIndex","hasAttribute","getAttribute","render","sizeClass","size","h","Host","onKeyup","role","tabindex","id","class","type","part"],"sources":["./src/components/segmented-button/segmented-button.css?tag=road-segmented-button&encapsulation=shadow","./src/components/segmented-button/segmented-button.tsx"],"sourcesContent":["/*\n * Tab button\n */\n\n\n/* BUTTON\n -------------------- */\n\n\n:host {\n --border-radius: 0.25rem;\n --font-size: var(--road-button-medium);\n --margin-bottom: 1rem;\n --padding-start: 1.5rem;\n --padding-end: 1.5rem;\n box-sizing: border-box;\n flex: 1;\n align-items: center;\n justify-content: center;\n max-height: 2.5rem;\n font-size: var(--road-button-medium);\n font-weight: 700;\n color: var(--road-primary);\n text-decoration: none;\n white-space: nowrap;\n vertical-align: middle;\n background-color: var(--road-surface);\n border-top: 1px solid var(--road-primary);\n border-bottom: 1px solid var(--road-primary);\n border-left: 1px solid var(--road-primary);\n border-radius: 0;\n transition: background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n\n\n:host(:first-child){\n border: 1px solid var(--road-primary);\n border-right: 0;\n border-radius: 999em 0 0 999em;\n}\n\n:host(:last-child){\n border: 1px solid var(--road-primary);\n border-radius: 0 999em 999em 0;\n}\n\n/**\n * Small\n */\n\n:host(.btn-sm) {\n height: 2rem;\n font-size: var(--road-button-small);\n}\n\n/**\n * Active state\n */\n\n:host(.tab-selected) {\n color: var(--road-primary-contrast);\n background-color: var(--road-primary);\n}\n\n:host(.tab-selected:hover) {\n background-color: var(--road-button-primary-variant);\n}\n\n\n/**\n * Hover state\n */\n\n:host(:hover) {\n background: var(--road-primary-90);\n}\n\n/**\n * Focus state\n */\n\n\n:host(.focus-visible) {\n background: var(--road-primary-90);\n outline: 0;\n}\n\n:host(.tab-selected.focus-visible){\n background-color: var(--road-button-primary-variant);\n}\n\n\n/* NATIVE\n -------------------- */\n\n.button-native {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex-direction: inherit;\n align-items: inherit;\n justify-content: inherit;\n width: 100%;\n height: 100%;\n max-height: 2.5rem;\n padding: 0.75rem var(--padding-end, 1.5rem) 0.75rem var(--padding-start, 1.5rem);\n margin: 0;\n overflow: hidden;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n color: inherit;\n text-align: inherit;\n text-decoration: none;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n cursor: pointer;\n background: transparent;\n -webkit-user-drag: none;\n border-color: initial;\n border-style: initial;\n border-width: 0;\n border-radius: inherit;\n border-image: initial;\n outline: none;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n","import { Component, Element, Event, EventEmitter, Host, Listen, Prop, h } from '@stencil/core';\n\n/**\n *\n * @part native - The native HTML anchor element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-segmented-button',\n styleUrl: 'segmented-button.css',\n shadow: true,\n})\nexport class SegmentedButton {\n\n @Element() el!: HTMLRoadSegmentedButtonElement;\n\n /**\n * The Segmented buttons size.\n */\n @Prop() size?: 'sm' | 'md' = 'md';\n\n /**\n * The selected tab component\n */\n @Prop({ mutable: true }) selected = false;\n\n /**\n * A tab id must be provided for each `road-tab`. It's used internally to reference\n */\n @Prop() tab?: string;\n\n /**\n * Emitted when the tab bar is clicked\n * @internal\n */\n @Event() roadsegmentedbuttonclick!: EventEmitter;\n /** @internal */\n @Event() roadSegmentedButtonClick!: EventEmitter;\n\n @Listen('roadSegmentedButtonBarChanged', { target: 'window' })\n @Listen('roadSegmentedButtonbarchanged', { target: 'window' })\n onButtonBarChanged(ev: CustomEvent) {\n const dispatchedFrom = ev.target as HTMLElement;\n const parent = this.el.parentElement as EventTarget;\n\n if ((ev.composedPath && ev.composedPath().includes(parent)) || (dispatchedFrom && dispatchedFrom.contains(this.el))) {\n this.selected = this.tab === ev.detail.tab;\n }\n }\n\n private selectTab(ev: Event | KeyboardEvent) {\n if (this.tab !== undefined) {\n this.roadsegmentedbuttonclick.emit({\n tab: this.tab,\n selected: this.selected,\n });\n this.roadSegmentedButtonClick.emit({\n tab: this.tab,\n selected: this.selected,\n });\n\n ev.preventDefault();\n }\n }\n\n private get tabIndex() {\n const hasTabIndex = this.el.hasAttribute('tabindex');\n\n if (hasTabIndex) {\n return this.el.getAttribute('tabindex');\n }\n\n return 0;\n }\n\n private onKeyUp = (ev: KeyboardEvent) => {\n if (ev.key === 'Enter' || ev.key === ' ') {\n this.selectTab(ev);\n }\n };\n\n private onClick = (ev: Event) => {\n this.selectTab(ev);\n };\n\n render() {\n const { tabIndex, selected, tab } = this;\n\n const sizeClass = this.size !== undefined ? `btn-${this.size}` : '';\n\n\n return (\n <Host\n onClick={this.onClick}\n onKeyup={this.onKeyUp}\n role=\"tab\"\n tabindex={tabIndex}\n aria-selected={selected ? 'true' : null}\n id={tab !== undefined ? `tab-button-${tab}` : null}\n class={{\n 'tab-selected': selected,\n [`${sizeClass}`]: true,\n }}\n >\n <button type=\"button\" tabIndex={-1} class=\"button-native\" part=\"native\">\n <slot/>\n </button>\n </Host>\n );\n }\n}"],"mappings":"gEAAA,MAAMA,EAAqB,89D,MCYdC,EAAe,M,+JA+DlBC,KAAAC,QAAWC,IACjB,GAAIA,EAAGC,MAAQ,SAAWD,EAAGC,MAAQ,IAAK,CACxCH,KAAKI,UAAUF,E,GAIXF,KAAAK,QAAWH,IACjBF,KAAKI,UAAUF,EAAG,E,UA/DU,K,cAKM,M,mBAiBpCI,mBAAmBJ,GACjB,MAAMK,EAAiBL,EAAGM,OAC1B,MAAMC,EAAST,KAAKU,GAAGC,cAEvB,GAAKT,EAAGU,cAAgBV,EAAGU,eAAeC,SAASJ,IAAaF,GAAkBA,EAAeO,SAASd,KAAKU,IAAM,CACnHV,KAAKe,SAAWf,KAAKgB,MAAQd,EAAGe,OAAOD,G,EAInCZ,UAAUF,GAChB,GAAIF,KAAKgB,MAAQE,UAAW,CAC1BlB,KAAKmB,yBAAyBC,KAAK,CACjCJ,IAAKhB,KAAKgB,IACVD,SAAUf,KAAKe,WAEjBf,KAAKqB,yBAAyBD,KAAK,CACjCJ,IAAKhB,KAAKgB,IACVD,SAAUf,KAAKe,WAGjBb,EAAGoB,gB,EAIKC,eACV,MAAMC,EAAcxB,KAAKU,GAAGe,aAAa,YAEzC,GAAID,EAAa,CACf,OAAOxB,KAAKU,GAAGgB,aAAa,W,CAG9B,OAAO,C,CAaTC,SACE,MAAMJ,SAAEA,EAAQR,SAAEA,EAAQC,IAAEA,GAAQhB,KAEpC,MAAM4B,EAAY5B,KAAK6B,OAASX,UAAY,OAAOlB,KAAK6B,OAAS,GAGjE,OACEC,EAACC,EAAI,CACH1B,QAASL,KAAKK,QACd2B,QAAShC,KAAKC,QACdgC,KAAK,MACLC,SAAUX,EAAQ,gBACHR,EAAW,OAAS,KACnCoB,GAAInB,IAAQE,UAAY,cAAcF,IAAQ,KAC9CoB,MAAO,CACL,eAAgBrB,EAChB,CAAC,GAAGa,KAAc,OAGpBE,EAAA,UAAQO,KAAK,SAASd,UAAW,EAAGa,MAAM,gBAAgBE,KAAK,UAC3DR,EAAA,c"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["skeletonCss","Skeleton","render","h"],"sources":["./src/components/skeleton/skeleton.css?tag=road-skeleton&encapsulation=shadow","./src/components/skeleton/skeleton.tsx"],"sourcesContent":["/*\n * Skeleton Screen\n *\n * Index\n * - Skeleton\n * - Animation\n */\n\n\n/* SKELETON\n -------------------- */\n\n/**\n * @prop --background-light: base light grey color\n * @prop --background-dark: second grey color to see the animation\n */\n\n:host {\n --background-light: var(--road-surface-disabled);\n --background-dark: rgb(137, 143, 160, 0.4);\n\n position: relative;\n display: block;\n width: 100%;\n min-height: 1rem;\n background: linear-gradient(to right, var(--background-light) 8%, var(--background-dark) 18%, var(--background-light) 33%);\n background-position: 100% 0;\n background-size: 200%;\n animation: road-skeleton-animation 1s linear infinite;\n}\n\n/* ANIMATION\n-------------------- */\n\n@keyframes road-skeleton-animation {\n\n 100% {\n background-position: -100% 0;\n }\n}\n","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'road-skeleton',\n styleUrl: 'skeleton.css',\n shadow: true,\n})\nexport class Skeleton {\n\n render() {\n return (\n <span>&nbsp;</span>\n );\n }\n\n}\n"],"mappings":"2CAAA,MAAMA,EAAc,kc,MCOPC,EAAQ,M,yBAEnBC,SACE,OACEC,EAAA,gB"}