@synergy-design-system/components 1.7.0 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (275) hide show
  1. package/README.md +8 -0
  2. package/dist/chunks/{chunk.23HTU3YE.js → chunk.2EI3TNL7.js} +1 -16
  3. package/dist/chunks/chunk.2EI3TNL7.js.map +7 -0
  4. package/dist/chunks/{chunk.RSONAU45.js → chunk.2RF7KO5I.js} +1 -12
  5. package/dist/chunks/chunk.2RF7KO5I.js.map +7 -0
  6. package/dist/chunks/{chunk.GHMKOVA3.js → chunk.3DE5ARIC.js} +23 -3
  7. package/dist/chunks/chunk.3DE5ARIC.js.map +7 -0
  8. package/dist/chunks/chunk.3O5WTWSN.js +12 -0
  9. package/dist/chunks/chunk.3O5WTWSN.js.map +7 -0
  10. package/dist/chunks/{chunk.MFFJYORB.js → chunk.3STW62TA.js} +1 -12
  11. package/dist/chunks/chunk.3STW62TA.js.map +7 -0
  12. package/dist/chunks/{chunk.EKOK7YPB.js → chunk.4QS5IWYB.js} +1 -16
  13. package/dist/chunks/chunk.4QS5IWYB.js.map +7 -0
  14. package/dist/chunks/{chunk.ULMZHWWW.js → chunk.5BMNRZ7L.js} +2 -2
  15. package/dist/chunks/{chunk.SMSP5C6C.js → chunk.5CB3CVZ7.js} +2 -2
  16. package/dist/chunks/{chunk.GMUVD5B2.js → chunk.5R3OVMH2.js} +25 -10
  17. package/dist/chunks/chunk.5R3OVMH2.js.map +7 -0
  18. package/dist/chunks/{chunk.EI34C7LC.js → chunk.6MS3WNDW.js} +8 -7
  19. package/dist/chunks/chunk.6MS3WNDW.js.map +7 -0
  20. package/dist/chunks/{chunk.4ZURABYO.js → chunk.A7IIJ2LL.js} +1 -7
  21. package/dist/chunks/{chunk.O7USYXBT.js.map → chunk.A7IIJ2LL.js.map} +3 -3
  22. package/dist/chunks/{chunk.PGCXJ2PT.js → chunk.ACTJFDNK.js} +1 -12
  23. package/dist/chunks/chunk.ACTJFDNK.js.map +7 -0
  24. package/dist/chunks/{chunk.MNMITYTH.js → chunk.ADRKUQGR.js} +1 -12
  25. package/dist/chunks/chunk.ADRKUQGR.js.map +7 -0
  26. package/dist/chunks/{chunk.5OPODPPZ.js → chunk.AJU6C4KC.js} +2 -2
  27. package/dist/chunks/{chunk.VZ7S7YYN.js → chunk.AVTU2BGE.js} +2 -2
  28. package/dist/chunks/{chunk.QHFGD6WW.js → chunk.BGHK4NQA.js} +1 -12
  29. package/dist/chunks/chunk.BGHK4NQA.js.map +7 -0
  30. package/dist/chunks/{chunk.LWXCBEHD.js → chunk.BGKFRWWO.js} +5 -5
  31. package/dist/chunks/{chunk.3ZHSSMBL.js → chunk.BJYVLDYR.js} +84 -6
  32. package/dist/chunks/chunk.BJYVLDYR.js.map +7 -0
  33. package/dist/chunks/chunk.BLOH2ZNU.js +636 -0
  34. package/dist/chunks/chunk.BLOH2ZNU.js.map +7 -0
  35. package/dist/chunks/{chunk.USYR7G7Z.js → chunk.BTZX6ZFZ.js} +2 -2
  36. package/dist/chunks/{chunk.W6V7TPGK.js → chunk.CFIQXXMW.js} +1 -12
  37. package/dist/chunks/chunk.CFIQXXMW.js.map +7 -0
  38. package/dist/chunks/{chunk.RA2WSKQT.js → chunk.F4THECWA.js} +2 -2
  39. package/dist/chunks/{chunk.Z4NKFCKY.js → chunk.FSONLJTT.js} +19 -15
  40. package/dist/chunks/chunk.FSONLJTT.js.map +7 -0
  41. package/dist/chunks/{chunk.PMTVLWNZ.js → chunk.FUNZW7ES.js} +2 -2
  42. package/dist/chunks/{chunk.OJREQD2D.js → chunk.GAPQVJGQ.js} +22 -14
  43. package/dist/chunks/chunk.GAPQVJGQ.js.map +7 -0
  44. package/dist/chunks/{chunk.NAX6WP3D.js → chunk.GBOII6N4.js} +11 -7
  45. package/dist/chunks/chunk.GBOII6N4.js.map +7 -0
  46. package/dist/chunks/chunk.GTSRMEPE.js +108 -0
  47. package/dist/chunks/chunk.GTSRMEPE.js.map +7 -0
  48. package/dist/chunks/{chunk.JAKJHV44.js → chunk.HF75YRVS.js} +22 -15
  49. package/dist/chunks/chunk.HF75YRVS.js.map +7 -0
  50. package/dist/chunks/{chunk.7VOPIPHW.js → chunk.IOPUYG6Q.js} +2 -2
  51. package/dist/chunks/{chunk.5THN2K5Q.js → chunk.IR2PZHC7.js} +2 -2
  52. package/dist/chunks/{chunk.SBEIXLRW.js → chunk.K3O2PP7X.js} +6 -5
  53. package/dist/chunks/chunk.K3O2PP7X.js.map +7 -0
  54. package/dist/chunks/{chunk.TUYEX4KP.js → chunk.KDDTDU4B.js} +73 -35
  55. package/dist/chunks/chunk.KDDTDU4B.js.map +7 -0
  56. package/dist/chunks/{chunk.5BOEKFIJ.js → chunk.KNXO2FGQ.js} +86 -48
  57. package/dist/chunks/chunk.KNXO2FGQ.js.map +7 -0
  58. package/dist/chunks/{chunk.HG5QC5EW.js → chunk.KUO3KJOC.js} +2 -2
  59. package/dist/chunks/{chunk.B6AKFQJS.js → chunk.LF2XSSHD.js} +2 -2
  60. package/dist/chunks/{chunk.2FN5DTS6.js → chunk.LJQ7LEPV.js} +1 -12
  61. package/dist/chunks/chunk.LJQ7LEPV.js.map +7 -0
  62. package/dist/chunks/{chunk.KP7SYG4K.js → chunk.LZE7OXKV.js} +2 -2
  63. package/dist/chunks/{chunk.CYN675Z6.js → chunk.MDZ22YWD.js} +12 -8
  64. package/dist/chunks/chunk.MDZ22YWD.js.map +7 -0
  65. package/dist/chunks/{chunk.JN7CLMQZ.js → chunk.MIMALEWP.js} +21 -7
  66. package/dist/chunks/chunk.MIMALEWP.js.map +7 -0
  67. package/dist/chunks/{chunk.XSXBQCWN.js → chunk.O6AXKVFJ.js} +11 -7
  68. package/dist/chunks/chunk.O6AXKVFJ.js.map +7 -0
  69. package/dist/chunks/{chunk.N2I6HVX3.js → chunk.OSBC36KQ.js} +4 -9
  70. package/dist/chunks/chunk.OSBC36KQ.js.map +7 -0
  71. package/dist/chunks/chunk.PHSJD47V.js +162 -0
  72. package/dist/chunks/chunk.PHSJD47V.js.map +7 -0
  73. package/dist/chunks/{chunk.JBYBQ5TQ.js → chunk.PKO6FEOM.js} +1 -12
  74. package/dist/chunks/chunk.PKO6FEOM.js.map +7 -0
  75. package/dist/chunks/{chunk.7KSU2SUD.js → chunk.PRZRH7SN.js} +2 -2
  76. package/dist/chunks/{chunk.4MYR27GF.js → chunk.PWMSNMDF.js} +13 -9
  77. package/dist/chunks/chunk.PWMSNMDF.js.map +7 -0
  78. package/dist/chunks/{chunk.BQG5LF7J.js → chunk.QAUTITK3.js} +2 -2
  79. package/dist/chunks/{chunk.DJOAQ4JU.js → chunk.QNDC5KWA.js} +43 -2
  80. package/dist/chunks/{chunk.6XU6OLZ3.js → chunk.QNQNR3RY.js} +1 -16
  81. package/dist/chunks/chunk.QNQNR3RY.js.map +7 -0
  82. package/dist/chunks/{chunk.Q7X5NOPZ.js → chunk.QY6MKIMK.js} +2 -2
  83. package/dist/chunks/{chunk.VQWUZKDS.js → chunk.RMQZMRVP.js} +2 -2
  84. package/dist/chunks/{chunk.XXF35USM.js → chunk.RMZBSKRR.js} +59 -109
  85. package/dist/chunks/chunk.RMZBSKRR.js.map +7 -0
  86. package/dist/chunks/{chunk.OJ4KOC7R.js → chunk.SJMMPKWP.js} +1 -12
  87. package/dist/chunks/chunk.SJMMPKWP.js.map +7 -0
  88. package/dist/chunks/{chunk.AMTCNRDE.js → chunk.SZCGMXW5.js} +3 -3
  89. package/dist/chunks/chunk.SZCGMXW5.js.map +7 -0
  90. package/dist/chunks/{chunk.JHXCBOUD.js → chunk.TTL762VF.js} +57 -60
  91. package/dist/chunks/chunk.TTL762VF.js.map +7 -0
  92. package/dist/chunks/chunk.UYD2OVFV.js +83 -0
  93. package/dist/chunks/chunk.UYD2OVFV.js.map +7 -0
  94. package/dist/chunks/{chunk.7EGCXNF2.js → chunk.UZFPGR6M.js} +8 -7
  95. package/dist/chunks/chunk.UZFPGR6M.js.map +7 -0
  96. package/dist/chunks/{chunk.SXW2KV3B.js → chunk.VATYXV2O.js} +2 -2
  97. package/dist/chunks/{chunk.AFEABUNX.js → chunk.W5JK7V7K.js} +6 -1
  98. package/dist/chunks/chunk.W5JK7V7K.js.map +7 -0
  99. package/dist/chunks/{chunk.IRT2DA6R.js → chunk.WC5SV4TV.js} +28 -18
  100. package/dist/chunks/chunk.WC5SV4TV.js.map +7 -0
  101. package/dist/chunks/{chunk.HKCTVD3U.js → chunk.XEI5ZP7Y.js} +11 -7
  102. package/dist/chunks/chunk.XEI5ZP7Y.js.map +7 -0
  103. package/dist/chunks/{chunk.4I6M5V6O.js → chunk.XIUSSERX.js} +1 -16
  104. package/dist/chunks/chunk.XIUSSERX.js.map +7 -0
  105. package/dist/chunks/{chunk.6V3HOZNE.js → chunk.Y72MIUNI.js} +2 -2
  106. package/dist/chunks/{chunk.IKKMWFWH.js → chunk.ZIQXX272.js} +2 -2
  107. package/dist/chunks/{chunk.GOVLCQY5.js → chunk.ZT5DUKVA.js} +2 -2
  108. package/dist/components/button/button.component.js +13 -14
  109. package/dist/components/button/button.custom.styles.js +1 -1
  110. package/dist/components/button/button.js +14 -15
  111. package/dist/components/button/button.styles.js +2 -4
  112. package/dist/components/button-group/button-group.component.js +4 -5
  113. package/dist/components/button-group/button-group.js +5 -6
  114. package/dist/components/button-group/button-group.styles.js +2 -3
  115. package/dist/components/checkbox/checkbox.component.d.ts +5 -0
  116. package/dist/components/checkbox/checkbox.component.js +12 -11
  117. package/dist/components/checkbox/checkbox.custom.styles.js +1 -1
  118. package/dist/components/checkbox/checkbox.js +13 -12
  119. package/dist/components/checkbox/checkbox.styles.js +2 -4
  120. package/dist/components/divider/divider.component.js +5 -6
  121. package/dist/components/divider/divider.custom.styles.js +1 -1
  122. package/dist/components/divider/divider.js +6 -7
  123. package/dist/components/divider/divider.styles.js +2 -4
  124. package/dist/components/drawer/drawer.component.d.ts +110 -0
  125. package/dist/components/drawer/drawer.component.js +27 -0
  126. package/dist/components/drawer/drawer.component.js.map +7 -0
  127. package/dist/components/drawer/drawer.custom.styles.d.ts +2 -0
  128. package/dist/components/drawer/drawer.custom.styles.js +8 -0
  129. package/dist/components/drawer/drawer.custom.styles.js.map +7 -0
  130. package/dist/components/drawer/drawer.d.ts +8 -0
  131. package/dist/components/drawer/drawer.js +28 -0
  132. package/dist/components/drawer/drawer.js.map +7 -0
  133. package/dist/components/drawer/drawer.styles.d.ts +2 -0
  134. package/dist/components/drawer/drawer.styles.js +8 -0
  135. package/dist/components/drawer/drawer.styles.js.map +7 -0
  136. package/dist/components/icon/icon.component.js +6 -7
  137. package/dist/components/icon/icon.custom.styles.js +1 -1
  138. package/dist/components/icon/icon.js +7 -8
  139. package/dist/components/icon/icon.styles.js +2 -4
  140. package/dist/components/icon/library.default.js +1 -1
  141. package/dist/components/icon/library.js +1 -1
  142. package/dist/components/icon/library.system.js +1 -1
  143. package/dist/components/icon-button/icon-button.component.js +8 -9
  144. package/dist/components/icon-button/icon-button.custom.styles.js +1 -1
  145. package/dist/components/icon-button/icon-button.js +9 -10
  146. package/dist/components/icon-button/icon-button.styles.js +2 -4
  147. package/dist/components/input/input.component.js +14 -15
  148. package/dist/components/input/input.custom.styles.js +1 -1
  149. package/dist/components/input/input.js +15 -16
  150. package/dist/components/input/input.styles.js +2 -5
  151. package/dist/components/optgroup/optgroup.component.js +6 -7
  152. package/dist/components/optgroup/optgroup.js +7 -8
  153. package/dist/components/optgroup/optgroup.styles.js +1 -1
  154. package/dist/components/option/option.component.js +8 -9
  155. package/dist/components/option/option.custom.styles.js +1 -1
  156. package/dist/components/option/option.js +9 -10
  157. package/dist/components/option/option.styles.js +2 -4
  158. package/dist/components/popup/popup.component.d.ts +9 -0
  159. package/dist/components/popup/popup.component.js +4 -5
  160. package/dist/components/popup/popup.styles.js +2 -3
  161. package/dist/components/radio/radio.component.js +8 -9
  162. package/dist/components/radio/radio.custom.styles.js +1 -1
  163. package/dist/components/radio/radio.js +9 -10
  164. package/dist/components/radio/radio.styles.js +2 -4
  165. package/dist/components/radio-button/radio-button.component.js +6 -8
  166. package/dist/components/radio-button/radio-button.js +7 -9
  167. package/dist/components/radio-button/radio-button.styles.js +3 -5
  168. package/dist/components/radio-group/radio-group.component.d.ts +1 -0
  169. package/dist/components/radio-group/radio-group.component.js +9 -10
  170. package/dist/components/radio-group/radio-group.custom.styles.js +1 -1
  171. package/dist/components/radio-group/radio-group.js +10 -11
  172. package/dist/components/radio-group/radio-group.styles.js +2 -5
  173. package/dist/components/select/select.component.d.ts +1 -0
  174. package/dist/components/select/select.component.js +20 -20
  175. package/dist/components/select/select.custom.styles.js +1 -1
  176. package/dist/components/select/select.js +21 -21
  177. package/dist/components/select/select.styles.js +2 -5
  178. package/dist/components/spinner/spinner.component.js +4 -5
  179. package/dist/components/spinner/spinner.styles.js +2 -3
  180. package/dist/components/switch/switch.component.d.ts +5 -0
  181. package/dist/components/switch/switch.component.js +9 -8
  182. package/dist/components/switch/switch.custom.styles.js +2 -2
  183. package/dist/components/switch/switch.js +10 -9
  184. package/dist/components/switch/switch.styles.js +2 -4
  185. package/dist/components/tag/tag.component.js +10 -11
  186. package/dist/components/tag/tag.custom.styles.js +1 -1
  187. package/dist/components/tag/tag.js +11 -12
  188. package/dist/components/tag/tag.styles.js +2 -4
  189. package/dist/components/textarea/textarea.component.js +8 -9
  190. package/dist/components/textarea/textarea.custom.styles.js +1 -1
  191. package/dist/components/textarea/textarea.js +9 -10
  192. package/dist/components/textarea/textarea.styles.js +2 -5
  193. package/dist/custom-elements.json +877 -351
  194. package/dist/events/events.d.ts +2 -0
  195. package/dist/events/syn-initial-focus.d.ts +6 -0
  196. package/dist/events/syn-request-close.d.ts +8 -0
  197. package/dist/internal/active-elements.d.ts +15 -0
  198. package/dist/internal/longpress.d.ts +2 -2
  199. package/dist/internal/modal.d.ts +24 -0
  200. package/dist/internal/string.d.ts +2 -0
  201. package/dist/internal/tabbable.d.ts +9 -0
  202. package/dist/synergy-autoloader.js +1 -1
  203. package/dist/synergy.d.ts +1 -0
  204. package/dist/synergy.js +88 -81
  205. package/dist/themes/utility.css +29 -0
  206. package/dist/translations/de.js +1 -1
  207. package/dist/translations/en.js +1 -1
  208. package/dist/utilities/animation-registry.js +2 -2
  209. package/dist/utilities/base-path.js +1 -1
  210. package/dist/utilities/form.js +3 -3
  211. package/dist/utilities/icon-library.js +1 -1
  212. package/dist/utilities/localize.js +1 -1
  213. package/dist/vscode.html-custom-data.json +78 -21
  214. package/package.json +4 -5
  215. package/dist/chunks/chunk.23HTU3YE.js.map +0 -7
  216. package/dist/chunks/chunk.2FN5DTS6.js.map +0 -7
  217. package/dist/chunks/chunk.3ZHSSMBL.js.map +0 -7
  218. package/dist/chunks/chunk.4I6M5V6O.js.map +0 -7
  219. package/dist/chunks/chunk.4MYR27GF.js.map +0 -7
  220. package/dist/chunks/chunk.4ZURABYO.js.map +0 -7
  221. package/dist/chunks/chunk.5BOEKFIJ.js.map +0 -7
  222. package/dist/chunks/chunk.6XU6OLZ3.js.map +0 -7
  223. package/dist/chunks/chunk.7EGCXNF2.js.map +0 -7
  224. package/dist/chunks/chunk.AFEABUNX.js.map +0 -7
  225. package/dist/chunks/chunk.AMTCNRDE.js.map +0 -7
  226. package/dist/chunks/chunk.CYN675Z6.js.map +0 -7
  227. package/dist/chunks/chunk.EI34C7LC.js.map +0 -7
  228. package/dist/chunks/chunk.EKOK7YPB.js.map +0 -7
  229. package/dist/chunks/chunk.GHMKOVA3.js.map +0 -7
  230. package/dist/chunks/chunk.GMUVD5B2.js.map +0 -7
  231. package/dist/chunks/chunk.HKCTVD3U.js.map +0 -7
  232. package/dist/chunks/chunk.IRT2DA6R.js.map +0 -7
  233. package/dist/chunks/chunk.JAKJHV44.js.map +0 -7
  234. package/dist/chunks/chunk.JBYBQ5TQ.js.map +0 -7
  235. package/dist/chunks/chunk.JHXCBOUD.js.map +0 -7
  236. package/dist/chunks/chunk.JN7CLMQZ.js.map +0 -7
  237. package/dist/chunks/chunk.MFFJYORB.js.map +0 -7
  238. package/dist/chunks/chunk.MNMITYTH.js.map +0 -7
  239. package/dist/chunks/chunk.N2I6HVX3.js.map +0 -7
  240. package/dist/chunks/chunk.NAX6WP3D.js.map +0 -7
  241. package/dist/chunks/chunk.O7USYXBT.js +0 -23
  242. package/dist/chunks/chunk.OJ4KOC7R.js.map +0 -7
  243. package/dist/chunks/chunk.OJREQD2D.js.map +0 -7
  244. package/dist/chunks/chunk.PGCXJ2PT.js.map +0 -7
  245. package/dist/chunks/chunk.QHFGD6WW.js.map +0 -7
  246. package/dist/chunks/chunk.RSONAU45.js.map +0 -7
  247. package/dist/chunks/chunk.SBEIXLRW.js.map +0 -7
  248. package/dist/chunks/chunk.TUYEX4KP.js.map +0 -7
  249. package/dist/chunks/chunk.W6V7TPGK.js.map +0 -7
  250. package/dist/chunks/chunk.XSXBQCWN.js.map +0 -7
  251. package/dist/chunks/chunk.XXF35USM.js.map +0 -7
  252. package/dist/chunks/chunk.Z4NKFCKY.js.map +0 -7
  253. package/dist/web-types.json +0 -2449
  254. /package/dist/chunks/{chunk.ULMZHWWW.js.map → chunk.5BMNRZ7L.js.map} +0 -0
  255. /package/dist/chunks/{chunk.SMSP5C6C.js.map → chunk.5CB3CVZ7.js.map} +0 -0
  256. /package/dist/chunks/{chunk.5OPODPPZ.js.map → chunk.AJU6C4KC.js.map} +0 -0
  257. /package/dist/chunks/{chunk.VZ7S7YYN.js.map → chunk.AVTU2BGE.js.map} +0 -0
  258. /package/dist/chunks/{chunk.LWXCBEHD.js.map → chunk.BGKFRWWO.js.map} +0 -0
  259. /package/dist/chunks/{chunk.USYR7G7Z.js.map → chunk.BTZX6ZFZ.js.map} +0 -0
  260. /package/dist/chunks/{chunk.RA2WSKQT.js.map → chunk.F4THECWA.js.map} +0 -0
  261. /package/dist/chunks/{chunk.PMTVLWNZ.js.map → chunk.FUNZW7ES.js.map} +0 -0
  262. /package/dist/chunks/{chunk.7VOPIPHW.js.map → chunk.IOPUYG6Q.js.map} +0 -0
  263. /package/dist/chunks/{chunk.5THN2K5Q.js.map → chunk.IR2PZHC7.js.map} +0 -0
  264. /package/dist/chunks/{chunk.HG5QC5EW.js.map → chunk.KUO3KJOC.js.map} +0 -0
  265. /package/dist/chunks/{chunk.B6AKFQJS.js.map → chunk.LF2XSSHD.js.map} +0 -0
  266. /package/dist/chunks/{chunk.KP7SYG4K.js.map → chunk.LZE7OXKV.js.map} +0 -0
  267. /package/dist/chunks/{chunk.7KSU2SUD.js.map → chunk.PRZRH7SN.js.map} +0 -0
  268. /package/dist/chunks/{chunk.BQG5LF7J.js.map → chunk.QAUTITK3.js.map} +0 -0
  269. /package/dist/chunks/{chunk.DJOAQ4JU.js.map → chunk.QNDC5KWA.js.map} +0 -0
  270. /package/dist/chunks/{chunk.Q7X5NOPZ.js.map → chunk.QY6MKIMK.js.map} +0 -0
  271. /package/dist/chunks/{chunk.VQWUZKDS.js.map → chunk.RMQZMRVP.js.map} +0 -0
  272. /package/dist/chunks/{chunk.SXW2KV3B.js.map → chunk.VATYXV2O.js.map} +0 -0
  273. /package/dist/chunks/{chunk.6V3HOZNE.js.map → chunk.Y72MIUNI.js.map} +0 -0
  274. /package/dist/chunks/{chunk.IKKMWFWH.js.map → chunk.ZIQXX272.js.map} +0 -0
  275. /package/dist/chunks/{chunk.GOVLCQY5.js.map → chunk.ZT5DUKVA.js.map} +0 -0
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "url": "https://www.sick.com"
5
5
  },
6
6
  "name": "@synergy-design-system/components",
7
- "version": "1.7.0",
7
+ "version": "1.9.0",
8
8
  "description": "",
9
9
  "repository": {
10
10
  "type": "git",
@@ -21,6 +21,7 @@
21
21
  "./synergy-autoloader.js": "./dist/synergy-autoloader.js",
22
22
  "./components/*": "./dist/components/*",
23
23
  "./utilities/*": "./dist/utilities/*",
24
+ "./themes/*": "./dist/themes/*",
24
25
  "./translations/*": "./dist/translations/*"
25
26
  },
26
27
  "files": [
@@ -57,7 +58,6 @@
57
58
  "change-case": "^5.4.2",
58
59
  "command-line-args": "^5.2.1",
59
60
  "comment-parser": "^1.4.1",
60
- "custom-element-jet-brains-integration": "^1.4.3",
61
61
  "custom-element-vs-code-integration": "^1.2.2",
62
62
  "del": "^7.1.0",
63
63
  "esbuild": "^0.20.0",
@@ -89,8 +89,8 @@
89
89
  "vendorism": "^3.0.0",
90
90
  "vue-tsc": "^1.8.27",
91
91
  "@synergy-design-system/eslint-config-syn": "0.1.0",
92
- "@synergy-design-system/tokens": "1.3.0",
93
- "@synergy-design-system/stylelint-config-syn": "0.1.0"
92
+ "@synergy-design-system/stylelint-config-syn": "0.1.0",
93
+ "@synergy-design-system/tokens": "1.7.1"
94
94
  },
95
95
  "release": {
96
96
  "branches": [
@@ -157,7 +157,6 @@
157
157
  "composed-offset-position": "^0.0.4",
158
158
  "lit": "^3.1.2"
159
159
  },
160
- "web-types": "./dist/web-types.json",
161
160
  "scripts": {
162
161
  "build": "node scripts/build.js",
163
162
  "test": "web-test-runner --group default",
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/textarea/textarea.styles.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport customStyles from './textarea.custom.styles.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n ${formControlStyles}\n\n :host {\n display: block;\n }\n\n .textarea {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n font-family: var(--syn-input-font-family);\n font-weight: var(--syn-input-font-weight);\n line-height: var(--syn-line-height-normal);\n letter-spacing: var(--syn-input-letter-spacing);\n vertical-align: middle;\n transition:\n var(--syn-transition-fast) color,\n var(--syn-transition-fast) border,\n var(--syn-transition-fast) box-shadow,\n var(--syn-transition-fast) background-color;\n cursor: text;\n }\n\n /* Standard textareas */\n .textarea--standard {\n background-color: var(--syn-input-background-color);\n border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n }\n\n .textarea--standard:hover:not(.textarea--disabled) {\n background-color: var(--syn-input-background-color-hover);\n border-color: var(--syn-input-border-color-hover);\n }\n .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n color: var(--syn-input-color-hover);\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled) {\n background-color: var(--syn-input-background-color-focus);\n border-color: var(--syn-input-border-color-focus);\n color: var(--syn-input-color-focus);\n box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);\n }\n\n .textarea--standard.textarea--focused:not(.textarea--disabled) .textarea__control {\n color: var(--syn-input-color-focus);\n }\n\n .textarea--standard.textarea--disabled {\n background-color: var(--syn-input-background-color-disabled);\n border-color: var(--syn-input-border-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .textarea--standard.textarea--disabled .textarea__control {\n color: var(--syn-input-color-disabled);\n }\n\n .textarea--standard.textarea--disabled .textarea__control::placeholder {\n color: var(--syn-input-placeholder-color-disabled);\n }\n\n /* Readonly textareas */\n .textarea--readonly {\n border: none;\n background-color: var(--syn-input-readonly-background-color);\n color: var(--syn-input-color);\n }\n\n .textarea--readonly:hover:not(.textarea--disabled) {\n background-color: var(--syn-input-readonly-background-color-hover);\n }\n\n .textarea--readonly.textarea--focused:not(.textarea--disabled) {\n background-color: var(--syn-input-readonly-background-color-focus);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .textarea--readonly.textarea--disabled {\n background-color: var(--syn-input-readonly-background-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .textarea__control {\n flex: 1 1 auto;\n font-family: inherit;\n font-size: inherit;\n font-weight: inherit;\n line-height: 1.4;\n color: var(--syn-input-color);\n border: none;\n background: none;\n box-shadow: none;\n cursor: inherit;\n -webkit-appearance: none;\n }\n\n .textarea__control::-webkit-search-decoration,\n .textarea__control::-webkit-search-cancel-button,\n .textarea__control::-webkit-search-results-button,\n .textarea__control::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n\n .textarea__control::placeholder {\n color: var(--syn-input-placeholder-color);\n user-select: none;\n -webkit-user-select: none;\n }\n\n .textarea__control:focus {\n outline: none;\n }\n\n /*\n * Size modifiers\n */\n\n .textarea--small {\n border-radius: var(--syn-input-border-radius-small);\n font-size: var(--syn-input-font-size-small);\n }\n\n .textarea--small .textarea__control {\n padding: 0.5em var(--syn-input-spacing-small);\n }\n\n .textarea--medium {\n border-radius: var(--syn-input-border-radius-medium);\n font-size: var(--syn-input-font-size-medium);\n }\n\n .textarea--medium .textarea__control {\n padding: 0.5em var(--syn-input-spacing-medium);\n }\n\n .textarea--large {\n border-radius: var(--syn-input-border-radius-large);\n font-size: var(--syn-input-font-size-large);\n }\n\n .textarea--large .textarea__control {\n padding: 0.5em var(--syn-input-spacing-large);\n }\n\n /*\n * Resize types\n */\n\n .textarea--resize-none .textarea__control {\n resize: none;\n }\n\n .textarea--resize-vertical .textarea__control {\n resize: vertical;\n }\n\n .textarea--resize-auto .textarea__control {\n height: auto;\n resize: none;\n overflow-y: hidden;\n }\n\n ${customStyles}\n`;\n\n"],
5
- "mappings": ";;;;;;;;;;;AAMA,SAAS,WAAW;AAKpB,IAAO,0BAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA,IACf,2BAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAuKjB,8BAAY;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/icon-button/icon-button.styles.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport customStyles from './icon-button.custom.styles.js';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n\n :host {\n display: inline-block;\n color: var(--syn-color-neutral-600);\n }\n\n .icon-button {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n background: none;\n border: none;\n border-radius: var(--syn-border-radius-medium);\n font-size: inherit;\n color: inherit;\n padding: var(--syn-spacing-x-small);\n cursor: pointer;\n transition: var(--syn-transition-x-fast) color;\n -webkit-appearance: none;\n }\n\n .icon-button:hover:not(.icon-button--disabled),\n .icon-button:focus-visible:not(.icon-button--disabled) {\n color: var(--syn-color-primary-600);\n }\n\n .icon-button:active:not(.icon-button--disabled) {\n color: var(--syn-color-primary-700);\n }\n\n .icon-button:focus {\n outline: none;\n }\n\n .icon-button--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .icon-button:focus-visible {\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .icon-button__icon {\n pointer-events: none;\n }\n\n ${customStyles}\n`;\n\n"],
5
- "mappings": ";;;;;;;;AAMA,SAAS,WAAW;AAIpB,IAAO,6BAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAiDf,iCAAY;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/popup/popup.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { arrow, autoUpdate, computePosition, flip, offset, platform, shift, size } from '@floating-ui/dom';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { offsetParent } from 'composed-offset-position';\nimport { property, query } from 'lit/decorators.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './popup.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\nexport interface VirtualElement {\n getBoundingClientRect: () => DOMRect;\n}\n\nfunction isVirtualElement(e: unknown): e is VirtualElement {\n return e !== null && typeof e === 'object' && 'getBoundingClientRect' in e;\n}\n\n/**\n * @summary Popup is a utility that lets you declaratively anchor \"popup\" containers to another element.\n * @documentation https://synergy.style/components/popup\n * @status stable\n * @since 2.0\n *\n * @event syn-reposition - Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive\n * operations in your listener or consider debouncing it.\n *\n * @slot - The popup's content.\n * @slot anchor - The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the\n * `anchor` attribute or property instead.\n *\n * @csspart arrow - The arrow's container. Avoid setting `top|bottom|left|right` properties, as these values are\n * assigned dynamically as the popup moves. This is most useful for applying a background color to match the popup, and\n * maybe a border or box shadow.\n * @csspart popup - The popup's container. Useful for setting a background color, box shadow, etc.\n *\n * @cssproperty [--arrow-size=6px] - The size of the arrow. Note that an arrow won't be shown unless the `arrow`\n * attribute is used.\n * @cssproperty [--arrow-color=var(--syn-color-neutral-0)] - The color of the arrow.\n * @cssproperty [--auto-size-available-width] - A read-only custom property that determines the amount of width the\n * popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only\n * available when using `auto-size`.\n * @cssproperty [--auto-size-available-height] - A read-only custom property that determines the amount of height the\n * popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only\n * available when using `auto-size`.\n */\nexport default class SynPopup extends SynergyElement {\n static styles: CSSResultGroup = styles;\n\n private anchorEl: Element | VirtualElement | null;\n private cleanup: ReturnType<typeof autoUpdate> | undefined;\n\n /** A reference to the internal popup container. Useful for animating and styling the popup with JavaScript. */\n @query('.popup') popup: HTMLElement;\n @query('.popup__arrow') private arrowEl: HTMLElement;\n\n /**\n * The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor\n * element `id`, a DOM element reference, or a `VirtualElement`. If the anchor lives inside the popup, use the\n * `anchor` slot instead.\n */\n @property() anchor: Element | string | VirtualElement;\n\n /**\n * Activates the positioning logic and shows the popup. When this attribute is removed, the positioning logic is torn\n * down and the popup will be hidden.\n */\n @property({ type: Boolean, reflect: true }) active = false;\n\n /**\n * The preferred placement of the popup. Note that the actual placement will vary as configured to keep the\n * panel inside of the viewport.\n */\n @property({ reflect: true }) placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'top';\n\n /**\n * Determines how the popup is positioned. The `absolute` strategy works well in most cases, but if overflow is\n * clipped, using a `fixed` position strategy can often workaround it.\n */\n @property({ reflect: true }) strategy: 'absolute' | 'fixed' = 'absolute';\n\n /** The distance in pixels from which to offset the panel away from its anchor. */\n @property({ type: Number }) distance = 0;\n\n /** The distance in pixels from which to offset the panel along its anchor. */\n @property({ type: Number }) skidding = 0;\n\n /**\n * Attaches an arrow to the popup. The arrow's size and color can be customized using the `--arrow-size` and\n * `--arrow-color` custom properties. For additional customizations, you can also target the arrow using\n * `::part(arrow)` in your stylesheet.\n */\n @property({ type: Boolean }) arrow = false;\n\n /**\n * The placement of the arrow. The default is `anchor`, which will align the arrow as close to the center of the\n * anchor as possible, considering available space and `arrow-padding`. A value of `start`, `end`, or `center` will\n * align the arrow to the start, end, or center of the popover instead.\n */\n @property({ attribute: 'arrow-placement' }) arrowPlacement: 'start' | 'end' | 'center' | 'anchor' = 'anchor';\n\n /**\n * The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,\n * this will prevent it from overflowing the corners.\n */\n @property({ attribute: 'arrow-padding', type: Number }) arrowPadding = 10;\n\n /**\n * When set, placement of the popup will flip to the opposite site to keep it in view. You can use\n * `flipFallbackPlacements` to further configure how the fallback placement is determined.\n */\n @property({ type: Boolean }) flip = false;\n\n /**\n * If the preferred placement doesn't fit, popup will be tested in these fallback placements until one fits. Must be a\n * string of any number of placements separated by a space, e.g. \"top bottom left\". If no placement fits, the flip\n * fallback strategy will be used instead.\n * */\n @property({\n attribute: 'flip-fallback-placements',\n converter: {\n fromAttribute: (value: string) => {\n return value\n .split(' ')\n .map(p => p.trim())\n .filter(p => p !== '');\n },\n toAttribute: (value: []) => {\n return value.join(' ');\n }\n }\n })\n flipFallbackPlacements = '';\n\n /**\n * When neither the preferred placement nor the fallback placements fit, this value will be used to determine whether\n * the popup should be positioned using the best available fit based on available space or as it was initially\n * preferred.\n */\n @property({ attribute: 'flip-fallback-strategy' }) flipFallbackStrategy: 'best-fit' | 'initial' = 'best-fit';\n\n /**\n * The flip boundary describes clipping element(s) that overflow will be checked relative to when flipping. By\n * default, the boundary includes overflow ancestors that will cause the element to be clipped. If needed, you can\n * change the boundary by passing a reference to one or more elements to this property.\n */\n @property({ type: Object }) flipBoundary: Element | Element[];\n\n /** The amount of padding, in pixels, to exceed before the flip behavior will occur. */\n @property({ attribute: 'flip-padding', type: Number }) flipPadding = 0;\n\n /** Moves the popup along the axis to keep it in view when clipped. */\n @property({ type: Boolean }) shift = false;\n\n /**\n * The shift boundary describes clipping element(s) that overflow will be checked relative to when shifting. By\n * default, the boundary includes overflow ancestors that will cause the element to be clipped. If needed, you can\n * change the boundary by passing a reference to one or more elements to this property.\n */\n @property({ type: Object }) shiftBoundary: Element | Element[];\n\n /** The amount of padding, in pixels, to exceed before the shift behavior will occur. */\n @property({ attribute: 'shift-padding', type: Number }) shiftPadding = 0;\n\n /** When set, this will cause the popup to automatically resize itself to prevent it from overflowing. */\n @property({ attribute: 'auto-size' }) autoSize: 'horizontal' | 'vertical' | 'both';\n\n /** Syncs the popup's width or height to that of the anchor element. */\n @property() sync: 'width' | 'height' | 'both';\n\n /**\n * The auto-size boundary describes clipping element(s) that overflow will be checked relative to when resizing. By\n * default, the boundary includes overflow ancestors that will cause the element to be clipped. If needed, you can\n * change the boundary by passing a reference to one or more elements to this property.\n */\n @property({ type: Object }) autoSizeBoundary: Element | Element[];\n\n /** The amount of padding, in pixels, to exceed before the auto-size behavior will occur. */\n @property({ attribute: 'auto-size-padding', type: Number }) autoSizePadding = 0;\n\n async connectedCallback() {\n super.connectedCallback();\n\n // Start the positioner after the first update\n await this.updateComplete;\n this.start();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.stop();\n }\n\n async updated(changedProps: Map<string, unknown>) {\n super.updated(changedProps);\n\n // Start or stop the positioner when active changes\n if (changedProps.has('active')) {\n if (this.active) {\n this.start();\n } else {\n this.stop();\n }\n }\n\n // Update the anchor when anchor changes\n if (changedProps.has('anchor')) {\n this.handleAnchorChange();\n }\n\n // All other properties will trigger a reposition when active\n if (this.active) {\n await this.updateComplete;\n this.reposition();\n }\n }\n\n private async handleAnchorChange() {\n await this.stop();\n\n if (this.anchor && typeof this.anchor === 'string') {\n // Locate the anchor by id\n const root = this.getRootNode() as Document | ShadowRoot;\n this.anchorEl = root.getElementById(this.anchor);\n } else if (this.anchor instanceof Element || isVirtualElement(this.anchor)) {\n // Use the anchor's reference\n this.anchorEl = this.anchor;\n } else {\n // Look for a slotted anchor\n this.anchorEl = this.querySelector<HTMLElement>('[slot=\"anchor\"]');\n }\n\n // If the anchor is a <slot>, we'll use the first assigned element as the target since slots use `display: contents`\n // and positioning can't be calculated on them\n if (this.anchorEl instanceof HTMLSlotElement) {\n this.anchorEl = this.anchorEl.assignedElements({ flatten: true })[0] as HTMLElement;\n }\n\n // If the anchor is valid, start it up\n if (this.anchorEl) {\n this.start();\n }\n }\n\n private start() {\n // We can't start the positioner without an anchor\n if (!this.anchorEl) {\n return;\n }\n\n this.cleanup = autoUpdate(this.anchorEl, this.popup, () => {\n this.reposition();\n });\n }\n\n private async stop(): Promise<void> {\n return new Promise(resolve => {\n if (this.cleanup) {\n this.cleanup();\n this.cleanup = undefined;\n this.removeAttribute('data-current-placement');\n this.style.removeProperty('--auto-size-available-width');\n this.style.removeProperty('--auto-size-available-height');\n requestAnimationFrame(() => resolve());\n } else {\n resolve();\n }\n });\n }\n\n /** Forces the popup to recalculate and reposition itself. */\n reposition() {\n // Nothing to do if the popup is inactive or the anchor doesn't exist\n if (!this.active || !this.anchorEl) {\n return;\n }\n\n //\n // NOTE: Floating UI middlewares are order dependent: https://floating-ui.com/docs/middleware\n //\n const middleware = [\n // The offset middleware goes first\n offset({ mainAxis: this.distance, crossAxis: this.skidding })\n ];\n\n // First we sync width/height\n if (this.sync) {\n middleware.push(\n size({\n apply: ({ rects }) => {\n const syncWidth = this.sync === 'width' || this.sync === 'both';\n const syncHeight = this.sync === 'height' || this.sync === 'both';\n this.popup.style.width = syncWidth ? `${rects.reference.width}px` : '';\n this.popup.style.height = syncHeight ? `${rects.reference.height}px` : '';\n }\n })\n );\n } else {\n // Cleanup styles if we're not matching width/height\n this.popup.style.width = '';\n this.popup.style.height = '';\n }\n\n // Then we flip\n if (this.flip) {\n middleware.push(\n flip({\n boundary: this.flipBoundary,\n // @ts-expect-error - We're converting a string attribute to an array here\n fallbackPlacements: this.flipFallbackPlacements,\n fallbackStrategy: this.flipFallbackStrategy === 'best-fit' ? 'bestFit' : 'initialPlacement',\n padding: this.flipPadding\n })\n );\n }\n\n // Then we shift\n if (this.shift) {\n middleware.push(\n shift({\n boundary: this.shiftBoundary,\n padding: this.shiftPadding\n })\n );\n }\n\n // Now we adjust the size as needed\n if (this.autoSize) {\n middleware.push(\n size({\n boundary: this.autoSizeBoundary,\n padding: this.autoSizePadding,\n apply: ({ availableWidth, availableHeight }) => {\n if (this.autoSize === 'vertical' || this.autoSize === 'both') {\n this.style.setProperty('--auto-size-available-height', `${availableHeight}px`);\n } else {\n this.style.removeProperty('--auto-size-available-height');\n }\n\n if (this.autoSize === 'horizontal' || this.autoSize === 'both') {\n this.style.setProperty('--auto-size-available-width', `${availableWidth}px`);\n } else {\n this.style.removeProperty('--auto-size-available-width');\n }\n }\n })\n );\n } else {\n // Cleanup styles if we're no longer using auto-size\n this.style.removeProperty('--auto-size-available-width');\n this.style.removeProperty('--auto-size-available-height');\n }\n\n // Finally, we add an arrow\n if (this.arrow) {\n middleware.push(\n arrow({\n element: this.arrowEl,\n padding: this.arrowPadding\n })\n );\n }\n\n //\n // Use custom positioning logic if the strategy is absolute. Otherwise, fall back to the default logic.\n //\n // More info: https://github.com/synergy-design-system/synergy/issues/1135\n //\n const getOffsetParent =\n this.strategy === 'absolute'\n ? (element: Element) => platform.getOffsetParent(element, offsetParent)\n : platform.getOffsetParent;\n\n computePosition(this.anchorEl, this.popup, {\n placement: this.placement,\n middleware,\n strategy: this.strategy,\n platform: {\n ...platform,\n getOffsetParent\n }\n }).then(({ x, y, middlewareData, placement }) => {\n //\n // Even though we have our own localization utility, it uses different heuristics to determine RTL. Because of\n // that, we'll use the same approach that Floating UI uses.\n //\n // Source: https://github.com/floating-ui/floating-ui/blob/cb3b6ab07f95275730d3e6e46c702f8d4908b55c/packages/dom/src/utils/getDocumentRect.ts#L31\n //\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const staticSide = { top: 'bottom', right: 'left', bottom: 'top', left: 'right' }[placement.split('-')[0]]!;\n\n this.setAttribute('data-current-placement', placement);\n\n Object.assign(this.popup.style, {\n left: `${x}px`,\n top: `${y}px`\n });\n\n if (this.arrow) {\n const arrowX = middlewareData.arrow!.x;\n const arrowY = middlewareData.arrow!.y;\n let top = '';\n let right = '';\n let bottom = '';\n let left = '';\n\n if (this.arrowPlacement === 'start') {\n // Start\n const value = typeof arrowX === 'number' ? `calc(${this.arrowPadding}px - var(--arrow-padding-offset))` : '';\n top = typeof arrowY === 'number' ? `calc(${this.arrowPadding}px - var(--arrow-padding-offset))` : '';\n right = isRtl ? value : '';\n left = isRtl ? '' : value;\n } else if (this.arrowPlacement === 'end') {\n // End\n const value = typeof arrowX === 'number' ? `calc(${this.arrowPadding}px - var(--arrow-padding-offset))` : '';\n right = isRtl ? '' : value;\n left = isRtl ? value : '';\n bottom = typeof arrowY === 'number' ? `calc(${this.arrowPadding}px - var(--arrow-padding-offset))` : '';\n } else if (this.arrowPlacement === 'center') {\n // Center\n left = typeof arrowX === 'number' ? `calc(50% - var(--arrow-size-diagonal))` : '';\n top = typeof arrowY === 'number' ? `calc(50% - var(--arrow-size-diagonal))` : '';\n } else {\n // Anchor (default)\n left = typeof arrowX === 'number' ? `${arrowX}px` : '';\n top = typeof arrowY === 'number' ? `${arrowY}px` : '';\n }\n\n Object.assign(this.arrowEl.style, {\n top,\n right,\n bottom,\n left,\n [staticSide]: 'calc(var(--arrow-size-diagonal) * -1)'\n });\n }\n });\n\n this.emit('syn-reposition');\n }\n\n render() {\n return html`\n <slot name=\"anchor\" @slotchange=${this.handleAnchorChange}></slot>\n\n <div\n part=\"popup\"\n class=${classMap({\n popup: true,\n 'popup--active': this.active,\n 'popup--fixed': this.strategy === 'fixed',\n 'popup--has-arrow': this.arrow\n })}\n >\n <slot></slot>\n ${this.arrow ? html`<div part=\"arrow\" class=\"popup__arrow\" role=\"presentation\"></div>` : ''}\n </div>\n `;\n }\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/radio-group/radio-group.styles.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport customStyles from './radio-group.custom.styles.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n ${formControlStyles}\n\n :host {\n display: block;\n }\n\n .form-control {\n position: relative;\n border: none;\n padding: 0;\n margin: 0;\n }\n\n .form-control__label {\n padding: 0;\n }\n\n .radio-group--required .radio-group__label::after {\n content: var(--syn-input-required-content);\n margin-inline-start: var(--syn-input-required-content-offset);\n }\n\n .visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n }\n\n ${customStyles}\n`;\n\n"],
5
- "mappings": ";;;;;;;;;;;AAMA,SAAS,WAAW;AAKpB,IAAO,6BAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA,IACf,2BAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAkCjB,iCAAY;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/icon/icon.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { getIconLibrary, type IconLibrary, unwatchIcon, watchIcon } from './library.js';\nimport { html } from 'lit';\nimport { isTemplateResult } from 'lit/directive-helpers.js';\nimport { property, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './icon.styles.js';\n\nimport type { CSSResultGroup, HTMLTemplateResult } from 'lit';\n\nconst CACHEABLE_ERROR = Symbol();\nconst RETRYABLE_ERROR = Symbol();\ntype SVGResult = HTMLTemplateResult | SVGSVGElement | typeof RETRYABLE_ERROR | typeof CACHEABLE_ERROR;\n\nlet parser: DOMParser;\nconst iconCache = new Map<string, Promise<SVGResult>>();\n\ninterface IconSource {\n url?: string;\n fromLibrary: boolean;\n}\n\n/**\n * @summary Icons are symbols that can be used to represent various options within an application.\n * @documentation https://synergy.style/components/icon\n * @status stable\n * @since 2.0\n *\n * @event syn-load - Emitted when the icon has loaded. When using `spriteSheet: true` this will not emit.\n * @event syn-error - Emitted when the icon fails to load due to an error. When using `spriteSheet: true` this will not emit.\n *\n * @csspart svg - The internal SVG element.\n * @csspart use - The <use> element generated when using `spriteSheet: true`\n */\nexport default class SynIcon extends SynergyElement {\n static styles: CSSResultGroup = styles;\n\n private initialRender = false;\n\n /** Given a URL, this function returns the resulting SVG element or an appropriate error symbol. */\n private async resolveIcon(url: string, library?: IconLibrary): Promise<SVGResult> {\n let fileData: Response;\n\n if (library?.spriteSheet) {\n return html`<svg part=\"svg\">\n <use part=\"use\" href=\"${url}\"></use>\n </svg>`;\n }\n\n try {\n fileData = await fetch(url, { mode: 'cors' });\n if (!fileData.ok) return fileData.status === 410 ? CACHEABLE_ERROR : RETRYABLE_ERROR;\n } catch {\n return RETRYABLE_ERROR;\n }\n\n try {\n const div = document.createElement('div');\n div.innerHTML = await fileData.text();\n\n const svg = div.firstElementChild;\n if (svg?.tagName?.toLowerCase() !== 'svg') return CACHEABLE_ERROR;\n\n if (!parser) parser = new DOMParser();\n const doc = parser.parseFromString(svg.outerHTML, 'text/html');\n\n const svgEl = doc.body.querySelector('svg');\n if (!svgEl) return CACHEABLE_ERROR;\n\n svgEl.part.add('svg');\n return document.adoptNode(svgEl);\n } catch {\n return CACHEABLE_ERROR;\n }\n }\n\n @state() private svg: SVGElement | HTMLTemplateResult | null = null;\n\n /** The name of the icon to draw. Available names depend on the icon library being used. */\n @property({ reflect: true }) name?: string;\n\n /**\n * An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\n * can result in XSS attacks.\n */\n @property() src?: string;\n\n /**\n * An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and\n * ignored by assistive devices.\n */\n @property() label = '';\n\n /** The name of a registered custom icon library. */\n @property({ reflect: true }) library = 'default';\n\n connectedCallback() {\n super.connectedCallback();\n watchIcon(this);\n }\n\n firstUpdated() {\n this.initialRender = true;\n this.setIcon();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n unwatchIcon(this);\n }\n\n private getIconSource(): IconSource {\n const library = getIconLibrary(this.library);\n if (this.name && library) {\n return {\n url: library.resolver(this.name),\n fromLibrary: true\n };\n }\n\n return {\n url: this.src,\n fromLibrary: false\n };\n }\n\n @watch('label')\n handleLabelChange() {\n const hasLabel = typeof this.label === 'string' && this.label.length > 0;\n\n if (hasLabel) {\n this.setAttribute('role', 'img');\n this.setAttribute('aria-label', this.label);\n this.removeAttribute('aria-hidden');\n } else {\n this.removeAttribute('role');\n this.removeAttribute('aria-label');\n this.setAttribute('aria-hidden', 'true');\n }\n }\n\n @watch(['name', 'src', 'library'])\n async setIcon() {\n const { url, fromLibrary } = this.getIconSource();\n const library = fromLibrary ? getIconLibrary(this.library) : undefined;\n\n if (!url) {\n this.svg = null;\n return;\n }\n\n let iconResolver = iconCache.get(url);\n if (!iconResolver) {\n iconResolver = this.resolveIcon(url, library);\n iconCache.set(url, iconResolver);\n }\n\n // If we haven't rendered yet, exit early. This avoids unnecessary work due to watching multiple props.\n if (!this.initialRender) {\n return;\n }\n\n const svg = await iconResolver;\n\n if (svg === RETRYABLE_ERROR) {\n iconCache.delete(url);\n }\n\n if (url !== this.getIconSource().url) {\n // If the url has changed while fetching the icon, ignore this request\n return;\n }\n\n if (isTemplateResult(svg)) {\n this.svg = svg;\n return;\n }\n\n switch (svg) {\n case RETRYABLE_ERROR:\n case CACHEABLE_ERROR:\n this.svg = null;\n this.emit('syn-error');\n break;\n default:\n this.svg = svg.cloneNode(true) as SVGElement;\n library?.mutator?.(this.svg);\n this.emit('syn-load');\n }\n }\n\n render() {\n return this.svg;\n }\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/button-group/button-group.styles.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n\n :host {\n display: inline-block;\n }\n\n .button-group {\n display: flex;\n flex-wrap: nowrap;\n }\n`;\n"],
5
- "mappings": ";;;;;AAMA,SAAS,WAAW;AAGpB,IAAO,8BAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/checkbox/checkbox.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { defaultValue } from '../../internal/default-value.js';\nimport { FormControlController } from '../../internal/form.js';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport styles from './checkbox.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Checkboxes allow the user to toggle an option on or off.\n * @documentation https://synergy.style/components/checkbox\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @slot - The checkbox's label.\n *\n * @event syn-blur - Emitted when the checkbox loses focus.\n * @event syn-change - Emitted when the checked state changes.\n * @event syn-focus - Emitted when the checkbox gains focus.\n * @event syn-input - Emitted when the checkbox receives input.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart base - The component's base wrapper.\n * @csspart control - The square container that wraps the checkbox's checked state.\n * @csspart control--checked - Matches the control part when the checkbox is checked.\n * @csspart control--indeterminate - Matches the control part when the checkbox is indeterminate.\n * @csspart checked-icon - The checked icon, an `<syn-icon>` element.\n * @csspart indeterminate-icon - The indeterminate icon, an `<syn-icon>` element.\n * @csspart label - The container that wraps the checkbox's label.\n */\nexport default class SynCheckbox extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = styles;\n static dependencies = { 'syn-icon': SynIcon };\n\n private readonly formControlController = new FormControlController(this, {\n value: (control: SynCheckbox) => (control.checked ? control.value || 'on' : undefined),\n defaultValue: (control: SynCheckbox) => control.defaultChecked,\n setValue: (control: SynCheckbox, checked: boolean) => (control.checked = checked)\n });\n\n @query('input[type=\"checkbox\"]') input: HTMLInputElement;\n\n @state() private hasFocus = false;\n\n @property() title = ''; // make reactive to pass through\n\n /** The name of the checkbox, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /** The current value of the checkbox, submitted as a name/value pair with form data. */\n @property() value: string;\n\n /** The checkbox's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Disables the checkbox. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Draws the checkbox in a checked state. */\n @property({ type: Boolean, reflect: true }) checked = false;\n\n /**\n * Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a \"select\n * all/none\" behavior when associated checkboxes have a mix of checked and unchecked states.\n */\n @property({ type: Boolean, reflect: true }) indeterminate = false;\n\n /** The default value of the form control. Primarily used for resetting the form control. */\n @defaultValue('checked') defaultChecked = false;\n\n /**\n * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\n * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in\n * the same document or shadow root for this to work.\n */\n @property({ reflect: true }) form = '';\n\n /** Makes the checkbox a required field. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /** Gets the validity state object */\n get validity() {\n return this.input.validity;\n }\n\n /** Gets the validation message */\n get validationMessage() {\n return this.input.validationMessage;\n }\n\n firstUpdated() {\n this.formControlController.updateValidity();\n }\n\n private handleClick() {\n this.checked = !this.checked;\n this.indeterminate = false;\n this.emit('syn-change');\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleInput() {\n this.emit('syn-input');\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n }\n\n @watch(['checked', 'indeterminate'], { waitUntilFirstUpdate: true })\n handleStateChange() {\n this.input.checked = this.checked; // force a sync update\n this.input.indeterminate = this.indeterminate; // force a sync update\n this.formControlController.updateValidity();\n }\n\n /** Simulates a click on the checkbox. */\n click() {\n this.input.click();\n }\n\n /** Sets focus on the checkbox. */\n focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the checkbox. */\n blur() {\n this.input.blur();\n }\n\n /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */\n checkValidity() {\n return this.input.checkValidity();\n }\n\n /** Gets the associated form, if one exists. */\n getForm(): HTMLFormElement | null {\n return this.formControlController.getForm();\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n reportValidity() {\n return this.input.reportValidity();\n }\n\n /**\n * Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\n * the custom validation message, call this method with an empty string.\n */\n setCustomValidity(message: string) {\n this.input.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n render() {\n //\n // NOTE: we use a <div> around the label slot because of this Chrome bug.\n //\n // https://bugs.chromium.org/p/chromium/issues/detail?id=1413733\n //\n return html`\n <label\n part=\"base\"\n class=${classMap({\n checkbox: true,\n 'checkbox--checked': this.checked,\n 'checkbox--disabled': this.disabled,\n 'checkbox--focused': this.hasFocus,\n 'checkbox--indeterminate': this.indeterminate,\n 'checkbox--small': this.size === 'small',\n 'checkbox--medium': this.size === 'medium',\n 'checkbox--large': this.size === 'large'\n })}\n >\n <input\n class=\"checkbox__input\"\n type=\"checkbox\"\n title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n name=${this.name}\n value=${ifDefined(this.value)}\n .indeterminate=${live(this.indeterminate)}\n .checked=${live(this.checked)}\n .disabled=${this.disabled}\n .required=${this.required}\n aria-checked=${this.checked ? 'true' : 'false'}\n @click=${this.handleClick}\n @input=${this.handleInput}\n @invalid=${this.handleInvalid}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n />\n\n <span\n part=\"control${this.checked ? ' control--checked' : ''}${this.indeterminate ? ' control--indeterminate' : ''}\"\n class=\"checkbox__control\"\n >\n ${this.checked\n ? html`\n <syn-icon part=\"checked-icon\" class=\"checkbox__checked-icon\" library=\"system\" name=\"check\"></syn-icon>\n `\n : ''}\n ${!this.checked && this.indeterminate\n ? html`\n <syn-icon\n part=\"indeterminate-icon\"\n class=\"checkbox__indeterminate-icon\"\n library=\"system\"\n name=\"indeterminate\"\n ></syn-icon>\n `\n : ''}\n </span>\n\n <div part=\"label\" class=\"checkbox__label\">\n <slot></slot>\n </div>\n </label>\n `;\n }\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/select/select.styles.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport customStyles from './select.custom.styles.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n ${formControlStyles}\n\n :host {\n display: block;\n }\n\n /** The popup */\n .select {\n flex: 1 1 auto;\n display: inline-flex;\n width: 100%;\n position: relative;\n vertical-align: middle;\n }\n\n .select::part(popup) {\n z-index: var(--syn-z-index-dropdown);\n }\n\n .select[data-current-placement^='top']::part(popup) {\n transform-origin: bottom;\n }\n\n .select[data-current-placement^='bottom']::part(popup) {\n transform-origin: top;\n }\n\n /* Combobox */\n .select__combobox {\n flex: 1;\n display: flex;\n width: 100%;\n min-width: 0;\n position: relative;\n align-items: center;\n justify-content: start;\n font-family: var(--syn-input-font-family);\n font-weight: var(--syn-input-font-weight);\n letter-spacing: var(--syn-input-letter-spacing);\n vertical-align: middle;\n overflow: hidden;\n cursor: pointer;\n transition:\n var(--syn-transition-fast) color,\n var(--syn-transition-fast) border,\n var(--syn-transition-fast) box-shadow,\n var(--syn-transition-fast) background-color;\n }\n\n .select__display-input {\n position: relative;\n width: 100%;\n font: inherit;\n border: none;\n background: none;\n color: var(--syn-input-color);\n cursor: inherit;\n overflow: hidden;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n }\n\n .select__display-input::placeholder {\n color: var(--syn-input-placeholder-color);\n }\n\n .select:not(.select--disabled):hover .select__display-input {\n color: var(--syn-input-color-hover);\n }\n\n .select__display-input:focus {\n outline: none;\n }\n\n /* Visually hide the display input when multiple is enabled */\n .select--multiple:not(.select--placeholder-visible) .select__display-input {\n position: absolute;\n z-index: -1;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n }\n\n .select__value-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n }\n\n .select__tags {\n display: flex;\n flex: 1;\n align-items: center;\n flex-wrap: wrap;\n margin-inline-start: var(--syn-spacing-2x-small);\n }\n\n .select__tags::slotted(syn-tag) {\n cursor: pointer !important;\n }\n\n .select--disabled .select__tags,\n .select--disabled .select__tags::slotted(syn-tag) {\n cursor: not-allowed !important;\n }\n\n /* Standard selects */\n .select--standard .select__combobox {\n background-color: var(--syn-input-background-color);\n border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n }\n\n .select--standard.select--disabled .select__combobox {\n background-color: var(--syn-input-background-color-disabled);\n border-color: var(--syn-input-border-color-disabled);\n color: var(--syn-input-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n outline: none;\n }\n\n .select--standard:not(.select--disabled).select--open .select__combobox,\n .select--standard:not(.select--disabled).select--focused .select__combobox {\n background-color: var(--syn-input-background-color-focus);\n border-color: var(--syn-input-border-color-focus);\n box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);\n }\n\n/* Sizes */\n .select--small .select__combobox {\n border-radius: var(--syn-input-border-radius-small);\n font-size: var(--syn-input-font-size-small);\n min-height: var(--syn-input-height-small);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-small);\n }\n\n .select--small .select__clear {\n margin-inline-start: var(--syn-input-spacing-small);\n }\n\n .select--small .select__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-small);\n }\n\n .select--small.select--multiple:not(.select--placeholder-visible) .select__combobox {\n padding-block: 2px;\n padding-inline-start: 0;\n }\n\n .select--small .select__tags {\n gap: 2px;\n }\n\n .select--medium .select__combobox {\n border-radius: var(--syn-input-border-radius-medium);\n font-size: var(--syn-input-font-size-medium);\n min-height: var(--syn-input-height-medium);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-medium);\n }\n\n .select--medium .select__clear {\n margin-inline-start: var(--syn-input-spacing-medium);\n }\n\n .select--medium .select__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-medium);\n }\n\n .select--medium.select--multiple:not(.select--placeholder-visible) .select__combobox {\n padding-inline-start: 0;\n padding-block: 3px;\n }\n\n .select--medium .select__tags {\n gap: 3px;\n }\n\n .select--large .select__combobox {\n border-radius: var(--syn-input-border-radius-large);\n font-size: var(--syn-input-font-size-large);\n min-height: var(--syn-input-height-large);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-large);\n }\n\n .select--large .select__clear {\n margin-inline-start: var(--syn-input-spacing-large);\n }\n\n .select--large .select__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-large);\n }\n\n .select--large.select--multiple:not(.select--placeholder-visible) .select__combobox {\n padding-inline-start: 0;\n padding-block: 4px;\n }\n\n .select--large .select__tags {\n gap: 4px;\n }/* Prefix */\n .select__prefix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: var(--syn-input-placeholder-color);\n }\n\n /* Clear button */\n .select__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: var(--syn-input-icon-color);\n border: none;\n background: none;\n padding: 0;\n transition: var(--syn-transition-fast) color;\n cursor: pointer;\n }\n\n .select__clear:hover {\n color: var(--syn-input-icon-color-hover);\n }\n\n .select__clear:focus {\n outline: none;\n }\n\n /* Expand icon */\n .select__expand-icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n transition: var(--syn-transition-medium) rotate ease;\n rotate: 0;\n margin-inline-start: var(--syn-spacing-small);\n }\n\n .select--open .select__expand-icon {\n rotate: -180deg;\n }\n\n /* Listbox */\n .select__listbox {\n display: block;\n position: relative;\n font-family: var(--syn-font-sans);\n font-size: var(--syn-font-size-medium);\n font-weight: var(--syn-font-weight-normal);\n box-shadow: var(--syn-shadow-large);\n background: var(--syn-panel-background-color);\n border: solid var(--syn-panel-border-width) var(--syn-panel-border-color);\n border-radius: var(--syn-border-radius-medium);\n padding-block: var(--syn-spacing-x-small);\n padding-inline: 0;\n overflow: auto;\n overscroll-behavior: none;\n\n /* Make sure it adheres to the popup's auto size */\n max-width: var(--auto-size-available-width);\n max-height: var(--auto-size-available-height);\n }\n\n .select__listbox ::slotted(syn-divider) {\n --spacing: var(--syn-spacing-x-small);\n }\n\n .select__listbox ::slotted(small) {\n font-size: var(--syn-font-size-small);\n font-weight: var(--syn-font-weight-semibold);\n color: var(--syn-color-neutral-500);\n padding-block: var(--syn-spacing-x-small);\n padding-inline: var(--syn-spacing-x-large);\n }\n\n ${customStyles}\n`;\n\n"],
5
- "mappings": ";;;;;;;;;;;AAMA,SAAS,WAAW;AAKpB,IAAO,wBAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA,IACf,2BAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAgSjB,4BAAY;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/radio-button/radio-button.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { html } from 'lit/static-html.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './radio-button.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Radios buttons allow the user to select a single option from a group using a button-like control.\n * @documentation https://synergy.style/components/radio-button\n * @status stable\n * @since 2.0\n *\n * @slot - The radio button's label.\n * @slot prefix - A presentational prefix icon or similar element.\n * @slot suffix - A presentational suffix icon or similar element.\n *\n * @event syn-blur - Emitted when the button loses focus.\n * @event syn-focus - Emitted when the button gains focus.\n *\n * @csspart base - The component's base wrapper.\n * @csspart button - The internal `<button>` element.\n * @csspart button--checked - The internal button element when the radio button is checked.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The container that wraps the radio button's label.\n * @csspart suffix - The container that wraps the suffix.\n */\nexport default class SynRadioButton extends SynergyElement {\n static styles: CSSResultGroup = styles;\n\n private readonly hasSlotController = new HasSlotController(this, '[default]', 'prefix', 'suffix');\n\n @query('.button') input: HTMLInputElement;\n @query('.hidden-input') hiddenInput: HTMLInputElement;\n\n @state() protected hasFocus = false;\n\n /**\n * @internal The radio button's checked state. This is exposed as an \"internal\" attribute so we can reflect it, making\n * it easier to style in button groups.\n */\n @property({ type: Boolean, reflect: true }) checked = false;\n\n /** The radio's value. When selected, the radio group will receive this value. */\n @property() value: string;\n\n /** Disables the radio button. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /**\n * The radio button's size. When used inside a radio group, the size will be determined by the radio group's size so\n * this attribute can typically be omitted.\n */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute('role', 'presentation');\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleClick(e: MouseEvent) {\n if (this.disabled) {\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n this.checked = true;\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n this.setAttribute('aria-disabled', this.disabled ? 'true' : 'false');\n }\n\n /** Sets focus on the radio button. */\n focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the radio button. */\n blur() {\n this.input.blur();\n }\n\n render() {\n return html`\n <div part=\"base\" role=\"presentation\">\n <button\n part=\"${`button${this.checked ? ' button--checked' : ''}`}\"\n role=\"radio\"\n aria-checked=\"${this.checked}\"\n class=${classMap({\n button: true,\n 'button--small': this.size === 'small',\n 'button--medium': this.size === 'medium',\n 'button--large': this.size === 'large',\n 'button--checked': this.checked,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--outline': true,\n 'button--has-label': this.hasSlotController.test('[default]'),\n 'button--has-prefix': this.hasSlotController.test('prefix'),\n 'button--has-suffix': this.hasSlotController.test('suffix')\n })}\n aria-disabled=${this.disabled}\n type=\"button\"\n value=${ifDefined(this.value)}\n tabindex=\"${this.checked ? '0' : '-1'}\"\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @click=${this.handleClick}\n >\n <slot name=\"prefix\" part=\"prefix\" class=\"button__prefix\"></slot>\n <slot part=\"label\" class=\"button__label\"></slot>\n <slot name=\"suffix\" part=\"suffix\" class=\"button__suffix\"></slot>\n </button>\n </div>\n `;\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;AAMA,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAC1B,SAAS,UAAU,OAAO,aAAa;AA0BvC,IAAqB,iBAArB,cAA4C,eAAe;AAAA,EAA3D;AAAA;AAGE,SAAiB,oBAAoB,IAAI,kBAAkB,MAAM,aAAa,UAAU,QAAQ;AAKvF,SAAU,WAAW;AAMc,mBAAU;AAMV,oBAAW;AAM1B,gBAAqC;AAAA;AAAA,EAElE,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,aAAa,QAAQ,cAAc;AAAA,EAC1C;AAAA,EAEQ,aAAa;AACnB,SAAK,WAAW;AAChB,SAAK,KAAK,UAAU;AAAA,EACtB;AAAA,EAEQ,YAAY,GAAe;AACjC,QAAI,KAAK,UAAU;AACjB,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB;AAAA,IACF;AAEA,SAAK,UAAU;AAAA,EACjB;AAAA,EAEQ,cAAc;AACpB,SAAK,WAAW;AAChB,SAAK,KAAK,WAAW;AAAA,EACvB;AAAA,EAGA,uBAAuB;AACrB,SAAK,aAAa,iBAAiB,KAAK,WAAW,SAAS,OAAO;AAAA,EACrE;AAAA;AAAA,EAGA,MAAM,SAAwB;AAC5B,SAAK,MAAM,MAAM,OAAO;AAAA,EAC1B;AAAA;AAAA,EAGA,OAAO;AACL,SAAK,MAAM,KAAK;AAAA,EAClB;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,kBAGO,SAAS,KAAK,UAAU,qBAAqB,EAAE,EAAE;AAAA;AAAA,0BAEzC,KAAK,OAAO;AAAA,kBACpB,SAAS;AAAA,MACf,QAAQ;AAAA,MACR,iBAAiB,KAAK,SAAS;AAAA,MAC/B,kBAAkB,KAAK,SAAS;AAAA,MAChC,iBAAiB,KAAK,SAAS;AAAA,MAC/B,mBAAmB,KAAK;AAAA,MACxB,oBAAoB,KAAK;AAAA,MACzB,mBAAmB,KAAK;AAAA,MACxB,mBAAmB;AAAA,MACnB,qBAAqB,KAAK,kBAAkB,KAAK,WAAW;AAAA,MAC5D,sBAAsB,KAAK,kBAAkB,KAAK,QAAQ;AAAA,MAC1D,sBAAsB,KAAK,kBAAkB,KAAK,QAAQ;AAAA,IAC5D,CAAC,CAAC;AAAA,0BACc,KAAK,QAAQ;AAAA;AAAA,kBAErB,UAAU,KAAK,KAAK,CAAC;AAAA,sBACjB,KAAK,UAAU,MAAM,IAAI;AAAA,kBAC7B,KAAK,UAAU;AAAA,mBACd,KAAK,WAAW;AAAA,mBAChB,KAAK,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQjC;AACF;AAvGqB,eACZ,SAAyB;AAId;AAAA,EAAjB,MAAM,SAAS;AAAA,GALG,eAKD;AACM;AAAA,EAAvB,MAAM,eAAe;AAAA,GANH,eAMK;AAEL;AAAA,EAAlB,MAAM;AAAA,GARY,eAQA;AAMyB;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAdvB,eAcyB;AAGhC;AAAA,EAAX,SAAS;AAAA,GAjBS,eAiBP;AAGgC;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GApBvB,eAoByB;AAMf;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GA1BR,eA0BU;AA4B7B;AAAA,EADC,MAAM,YAAY,EAAE,sBAAsB,KAAK,CAAC;AAAA,GArD9B,eAsDnB;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/switch/switch.custom.styles.ts"],
4
- "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n:host([size='small']) {\n --height: calc(var(--syn-font-size-medium) + 2px);\n --thumb-size: var(--syn-font-size-small);\n --width: calc((var(--height) * 2) - 6px);\n }\n\n :host([size='medium']) {\n --height: var(--syn-font-size-large);\n --thumb-size: var(--syn-font-size-medium);\n --width: calc((var(--height) * 2) - 6px);\n }\n\n :host([size='large']) {\n --height: calc(var(--syn-toggle-size-large) + 4px);\n --thumb-size: var(--syn-toggle-size-large);\n --width: calc((var(--height) * 2) - 6px);\n }\n\n .switch.switch--small {\n padding: var(--syn-spacing-2x-small) 0;\n }\n\n .switch.switch--medium {\n padding: var(--syn-spacing-2x-small) 0;\n }\n\n .switch.switch--large {\n padding: var(--syn-spacing-3x-small) 0;\n }\n\n .switch__control {\n background-color: var(--syn-color-neutral-600);\n border: solid var(--syn-border-width-medium) var(--syn-color-neutral-600);\n }\n\n .switch__control .switch__thumb {\n border: none;\n }\n\n /* Hover */\n .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-neutral-900);\n border-color: var(--syn-color-neutral-900);\n }\n\n .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n }\n\n /* Checked + hover */\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-primary-900);\n border-color: var(--syn-color-primary-900);\n }\n\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n }\n\n /* Focus */\n .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n background-color: var(--syn-color-neutral-600);\n border-color: var(--syn-color-neutral-600);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n outline: none;\n }\n\n /* Checked + focus */\n .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n background-color: var(--syn-color-primary-900);\n border-color: var(--syn-color-primary-900);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n outline: none;\n }\n\n .switch__label {\n margin-inline-start: var(--syn-spacing-x-small);\n }\n \n :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control {\n background-color: var(--syn-color-error-700);\n border-color: var(--syn-color-error-700);\n }\n\n :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-error-900);\n border-color: var(--syn-color-error-900);\n }\n `;\n"],
5
- "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,+BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/internal/form.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport type { ReactiveController, ReactiveControllerHost } from 'lit';\nimport type { SynergyFormControl } from '../internal/synergy-element.js';\nimport type SynButton from '../components/button/button.js';\n\n//\n// We store a WeakMap of forms + controls so we can keep references to all Synergy controls within a given form. As\n// elements connect and disconnect to/from the DOM, their containing form is used as the key and the form control is\n// added and removed from the form's set, respectively.\n//\nexport const formCollections: WeakMap<HTMLFormElement, Set<SynergyFormControl>> = new WeakMap();\n\n//\n// We store a WeakMap of reportValidity() overloads so we can override it when form controls connect to the DOM and\n// restore the original behavior when they disconnect.\n//\nconst reportValidityOverloads: WeakMap<HTMLFormElement, () => boolean> = new WeakMap();\nconst checkValidityOverloads: WeakMap<HTMLFormElement, () => boolean> = new WeakMap();\n\n//\n// We store a Set of controls that users have interacted with. This allows us to determine the interaction state\n// without littering the DOM with additional data attributes.\n//\nconst userInteractedControls: WeakSet<SynergyFormControl> = new WeakSet();\n\n//\n// We store a WeakMap of interactions for each form control so we can track when all conditions are met for validation.\n//\nconst interactions = new WeakMap<SynergyFormControl, string[]>();\n\nexport interface FormControlControllerOptions {\n /** A function that returns the form containing the form control. */\n form: (input: SynergyFormControl) => HTMLFormElement | null;\n /** A function that returns the form control's name, which will be submitted with the form data. */\n name: (input: SynergyFormControl) => string;\n /** A function that returns the form control's current value. */\n value: (input: SynergyFormControl) => unknown | unknown[];\n /** A function that returns the form control's default value. */\n defaultValue: (input: SynergyFormControl) => unknown | unknown[];\n /** A function that returns the form control's current disabled state. If disabled, the value won't be submitted. */\n disabled: (input: SynergyFormControl) => boolean;\n /**\n * A function that maps to the form control's reportValidity() function. When the control is invalid, this will\n * prevent submission and trigger the browser's constraint violation warning.\n */\n reportValidity: (input: SynergyFormControl) => boolean;\n\n /**\n * A function that maps to the form control's `checkValidity()` function. When the control is invalid, this will return false.\n * this is helpful is you want to check validation without triggering the native browser constraint violation warning.\n */\n checkValidity: (input: SynergyFormControl) => boolean;\n /** A function that sets the form control's value */\n setValue: (input: SynergyFormControl, value: unknown) => void;\n /**\n * An array of event names to listen to. When all events in the list are emitted, the control will receive validity\n * states such as user-valid and user-invalid.user interacted validity states. */\n assumeInteractionOn: string[];\n}\n\n/** A reactive controller to allow form controls to participate in form submission, validation, etc. */\nexport class FormControlController implements ReactiveController {\n host: SynergyFormControl & ReactiveControllerHost;\n form?: HTMLFormElement | null;\n options: FormControlControllerOptions;\n\n constructor(host: ReactiveControllerHost & SynergyFormControl, options?: Partial<FormControlControllerOptions>) {\n (this.host = host).addController(this);\n this.options = {\n form: input => {\n // If there's a form attribute, use it to find the target form by id\n // Controls may not always reflect the 'form' property. For example, `<syn-button>` doesn't reflect.\n const formId = input.form;\n\n if (formId) {\n const root = input.getRootNode() as Document | ShadowRoot;\n\n const form = root.getElementById(formId);\n\n if (form) {\n return form as HTMLFormElement;\n }\n }\n\n return input.closest('form');\n },\n name: input => input.name,\n value: input => input.value,\n defaultValue: input => input.defaultValue,\n disabled: input => input.disabled ?? false,\n reportValidity: input => (typeof input.reportValidity === 'function' ? input.reportValidity() : true),\n checkValidity: input => (typeof input.checkValidity === 'function' ? input.checkValidity() : true),\n setValue: (input, value: string) => (input.value = value),\n assumeInteractionOn: ['syn-input'],\n ...options\n };\n }\n\n hostConnected() {\n const form = this.options.form(this.host);\n\n if (form) {\n this.attachForm(form);\n }\n\n // Listen for interactions\n interactions.set(this.host, []);\n this.options.assumeInteractionOn.forEach(event => {\n this.host.addEventListener(event, this.handleInteraction);\n });\n }\n\n hostDisconnected() {\n this.detachForm();\n\n // Clean up interactions\n interactions.delete(this.host);\n this.options.assumeInteractionOn.forEach(event => {\n this.host.removeEventListener(event, this.handleInteraction);\n });\n }\n\n hostUpdated() {\n const form = this.options.form(this.host);\n\n // Detach if the form no longer exists\n if (!form) {\n this.detachForm();\n }\n\n // If the form has changed, reattach it\n if (form && this.form !== form) {\n this.detachForm();\n this.attachForm(form);\n }\n\n if (this.host.hasUpdated) {\n this.setValidity(this.host.validity.valid);\n }\n }\n\n private attachForm(form?: HTMLFormElement) {\n if (form) {\n this.form = form;\n\n // Add this element to the form's collection\n if (formCollections.has(this.form)) {\n formCollections.get(this.form)!.add(this.host);\n } else {\n formCollections.set(this.form, new Set<SynergyFormControl>([this.host]));\n }\n\n this.form.addEventListener('formdata', this.handleFormData);\n this.form.addEventListener('submit', this.handleFormSubmit);\n this.form.addEventListener('reset', this.handleFormReset);\n\n // Overload the form's reportValidity() method so it looks at Synergy form controls\n if (!reportValidityOverloads.has(this.form)) {\n reportValidityOverloads.set(this.form, this.form.reportValidity);\n this.form.reportValidity = () => this.reportFormValidity();\n }\n\n // Overload the form's checkValidity() method so it looks at Synergy form controls\n if (!checkValidityOverloads.has(this.form)) {\n checkValidityOverloads.set(this.form, this.form.checkValidity);\n this.form.checkValidity = () => this.checkFormValidity();\n }\n } else {\n this.form = undefined;\n }\n }\n\n private detachForm() {\n if (!this.form) return;\n\n const formCollection = formCollections.get(this.form);\n\n if (!formCollection) {\n return;\n }\n\n // Remove this host from the form's collection\n formCollection.delete(this.host);\n\n // Check to make sure there's no other form controls in the collection. If we do this\n // without checking if any other controls are still in the collection, then we will wipe out the\n // validity checks for all other elements.\n // see: https://github.com/synergy-design-system/synergy/issues/1703\n if (formCollection.size <= 0) {\n this.form.removeEventListener('formdata', this.handleFormData);\n this.form.removeEventListener('submit', this.handleFormSubmit);\n this.form.removeEventListener('reset', this.handleFormReset);\n\n // Remove the overload and restore the original method\n if (reportValidityOverloads.has(this.form)) {\n this.form.reportValidity = reportValidityOverloads.get(this.form)!;\n reportValidityOverloads.delete(this.form);\n }\n\n if (checkValidityOverloads.has(this.form)) {\n this.form.checkValidity = checkValidityOverloads.get(this.form)!;\n checkValidityOverloads.delete(this.form);\n }\n\n // So it looks weird here to not always set the form to undefined. But I _think_ if we unattach this.form here,\n // we end up in this fun spot where future validity checks don't have a reference to the form validity handler.\n // First form element in sets the validity handler. So we can't clean up `this.form` until there are no other form elements in the form.\n this.form = undefined;\n }\n }\n\n private handleFormData = (event: FormDataEvent) => {\n const disabled = this.options.disabled(this.host);\n const name = this.options.name(this.host);\n const value = this.options.value(this.host);\n\n // For buttons, we only submit the value if they were the submitter. This is currently done in doAction() by\n // injecting the name/value on a temporary button, so we can just skip them here.\n const isButton = this.host.tagName.toLowerCase() === 'syn-button';\n\n if (!disabled && !isButton && typeof name === 'string' && name.length > 0 && typeof value !== 'undefined') {\n if (Array.isArray(value)) {\n (value as unknown[]).forEach(val => {\n event.formData.append(name, (val as string | number | boolean).toString());\n });\n } else {\n event.formData.append(name, (value as string | number | boolean).toString());\n }\n }\n };\n\n private handleFormSubmit = (event: Event) => {\n const disabled = this.options.disabled(this.host);\n const reportValidity = this.options.reportValidity;\n\n // Update the interacted state for all controls when the form is submitted\n if (this.form && !this.form.noValidate) {\n formCollections.get(this.form)?.forEach(control => {\n this.setUserInteracted(control, true);\n });\n }\n\n if (this.form && !this.form.noValidate && !disabled && !reportValidity(this.host)) {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n };\n\n private handleFormReset = () => {\n this.options.setValue(this.host, this.options.defaultValue(this.host));\n this.setUserInteracted(this.host, false);\n interactions.set(this.host, []);\n };\n\n private handleInteraction = (event: Event) => {\n const emittedEvents = interactions.get(this.host)!;\n\n if (!emittedEvents.includes(event.type)) {\n emittedEvents.push(event.type);\n }\n\n // Mark it as user-interacted as soon as all associated events have been emitted\n if (emittedEvents.length === this.options.assumeInteractionOn.length) {\n this.setUserInteracted(this.host, true);\n }\n };\n\n private checkFormValidity = () => {\n //\n // This is very similar to the `reportFormValidity` function, but it does not trigger native constraint validation\n // Allow the user to simply check if the form is valid and handling validity in their own way.\n //\n // We preserve the original method in a WeakMap, but we don't call it from the overload because that would trigger\n // validations in an unexpected order. When the element disconnects, we revert to the original behavior. This won't\n // be necessary once we can use ElementInternals.\n //\n // Note that we're also honoring the form's novalidate attribute.\n //\n if (this.form && !this.form.noValidate) {\n // This seems sloppy, but checking all elements will cover native inputs, Synergy inputs, and other custom\n // elements that support the constraint validation API.\n const elements = this.form.querySelectorAll<HTMLInputElement>('*');\n\n for (const element of elements) {\n if (typeof element.checkValidity === 'function') {\n if (!element.checkValidity()) {\n return false;\n }\n }\n }\n }\n\n return true;\n };\n\n private reportFormValidity = () => {\n //\n // Synergy form controls work hard to act like regular form controls. They support the Constraint Validation API\n // and its associated methods such as setCustomValidity() and reportValidity(). However, the HTMLFormElement also\n // has a reportValidity() method that will trigger validation on all child controls. Since we're not yet using\n // ElementInternals, we need to overload this method so it looks for any element with the reportValidity() method.\n //\n // We preserve the original method in a WeakMap, but we don't call it from the overload because that would trigger\n // validations in an unexpected order. When the element disconnects, we revert to the original behavior. This won't\n // be necessary once we can use ElementInternals.\n //\n // Note that we're also honoring the form's novalidate attribute.\n //\n if (this.form && !this.form.noValidate) {\n // This seems sloppy, but checking all elements will cover native inputs, Synergy inputs, and other custom\n // elements that support the constraint validation API.\n const elements = this.form.querySelectorAll<HTMLInputElement>('*');\n\n for (const element of elements) {\n if (typeof element.reportValidity === 'function') {\n if (!element.reportValidity()) {\n return false;\n }\n }\n }\n }\n\n return true;\n };\n\n private setUserInteracted(el: SynergyFormControl, hasInteracted: boolean) {\n if (hasInteracted) {\n userInteractedControls.add(el);\n } else {\n userInteractedControls.delete(el);\n }\n\n el.requestUpdate();\n }\n\n private doAction(type: 'submit' | 'reset', submitter?: HTMLInputElement | SynButton) {\n if (this.form) {\n const button = document.createElement('button');\n button.type = type;\n button.style.position = 'absolute';\n button.style.width = '0';\n button.style.height = '0';\n button.style.clipPath = 'inset(50%)';\n button.style.overflow = 'hidden';\n button.style.whiteSpace = 'nowrap';\n\n // Pass name, value, and form attributes through to the temporary button\n if (submitter) {\n button.name = submitter.name;\n button.value = submitter.value;\n\n ['formaction', 'formenctype', 'formmethod', 'formnovalidate', 'formtarget'].forEach(attr => {\n if (submitter.hasAttribute(attr)) {\n button.setAttribute(attr, submitter.getAttribute(attr)!);\n }\n });\n }\n\n this.form.append(button);\n button.click();\n button.remove();\n }\n }\n\n /** Returns the associated `<form>` element, if one exists. */\n getForm() {\n return this.form ?? null;\n }\n\n /** Resets the form, restoring all the control to their default value */\n reset(submitter?: HTMLInputElement | SynButton) {\n this.doAction('reset', submitter);\n }\n\n /** Submits the form, triggering validation and form data injection. */\n submit(submitter?: HTMLInputElement | SynButton) {\n // Calling form.submit() bypasses the submit event and constraint validation. To prevent this, we can inject a\n // native submit button into the form, \"click\" it, then remove it to simulate a standard form submission.\n this.doAction('submit', submitter);\n }\n\n /**\n * Synchronously sets the form control's validity. Call this when you know the future validity but need to update\n * the host element immediately, i.e. before Lit updates the component in the next update.\n */\n setValidity(isValid: boolean) {\n const host = this.host;\n const hasInteracted = Boolean(userInteractedControls.has(host));\n const required = Boolean(host.required);\n\n //\n // We're mapping the following \"states\" to data attributes. In the future, we can use ElementInternals.states to\n // create a similar mapping, but instead of [data-invalid] it will look like :--invalid.\n //\n // See this RFC for more details: https://github.com/synergy-design-system/synergy/issues/1011\n //\n host.toggleAttribute('data-required', required);\n host.toggleAttribute('data-optional', !required);\n host.toggleAttribute('data-invalid', !isValid);\n host.toggleAttribute('data-valid', isValid);\n host.toggleAttribute('data-user-invalid', !isValid && hasInteracted);\n host.toggleAttribute('data-user-valid', isValid && hasInteracted);\n }\n\n /**\n * Updates the form control's validity based on the current value of `host.validity.valid`. Call this when anything\n * that affects constraint validation changes so the component receives the correct validity states.\n */\n updateValidity() {\n const host = this.host;\n this.setValidity(host.validity.valid);\n }\n\n /**\n * Dispatches a non-bubbling, cancelable custom event of type `syn-invalid`.\n * If the `syn-invalid` event will be cancelled then the original `invalid`\n * event (which may have been passed as argument) will also be cancelled.\n * If no original `invalid` event has been passed then the `syn-invalid`\n * event will be cancelled before being dispatched.\n */\n emitInvalidEvent(originalInvalidEvent?: Event) {\n const slInvalidEvent = new CustomEvent<Record<PropertyKey, never>>('syn-invalid', {\n bubbles: false,\n composed: false,\n cancelable: true,\n detail: {}\n });\n\n if (!originalInvalidEvent) {\n slInvalidEvent.preventDefault();\n }\n\n if (!this.host.dispatchEvent(slInvalidEvent)) {\n originalInvalidEvent?.preventDefault();\n }\n }\n}\n\n/*\n * Predefined common validity states.\n * All of them are read-only.\n */\n\n// A validity state object that represents `valid`\nexport const validValidityState: ValidityState = Object.freeze({\n badInput: false,\n customError: false,\n patternMismatch: false,\n rangeOverflow: false,\n rangeUnderflow: false,\n stepMismatch: false,\n tooLong: false,\n tooShort: false,\n typeMismatch: false,\n valid: true,\n valueMissing: false\n});\n\n// A validity state object that represents `value missing`\nexport const valueMissingValidityState: ValidityState = Object.freeze({\n ...validValidityState,\n valid: false,\n valueMissing: true\n});\n\n// A validity state object that represents a custom error\nexport const customErrorValidityState: ValidityState = Object.freeze({\n ...validValidityState,\n valid: false,\n customError: true\n});\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/radio/radio.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport styles from './radio.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Radios allow the user to select a single option from a group.\n * @documentation https://synergy.style/components/radio\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @slot - The radio's label.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-focus - Emitted when the control gains focus.\n *\n * @csspart base - The component's base wrapper.\n * @csspart control - The circular container that wraps the radio's checked state.\n * @csspart control--checked - The radio control when the radio is checked.\n * @csspart checked-icon - The checked icon, an `<syn-icon>` element.\n * @csspart label - The container that wraps the radio's label.\n */\nexport default class SynRadio extends SynergyElement {\n static styles: CSSResultGroup = styles;\n static dependencies = { 'syn-icon': SynIcon };\n\n @state() checked = false;\n @state() protected hasFocus = false;\n\n /** The radio's value. When selected, the radio group will receive this value. */\n @property() value: string;\n\n /**\n * The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this\n * attribute can typically be omitted.\n */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Disables the radio. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n constructor() {\n super();\n this.addEventListener('blur', this.handleBlur);\n this.addEventListener('click', this.handleClick);\n this.addEventListener('focus', this.handleFocus);\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.setInitialAttributes();\n }\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.emit('syn-blur');\n };\n\n private handleClick = () => {\n if (!this.disabled) {\n this.checked = true;\n }\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.emit('syn-focus');\n };\n\n private setInitialAttributes() {\n this.setAttribute('role', 'radio');\n this.setAttribute('tabindex', '-1');\n this.setAttribute('aria-disabled', this.disabled ? 'true' : 'false');\n }\n\n @watch('checked')\n handleCheckedChange() {\n this.setAttribute('aria-checked', this.checked ? 'true' : 'false');\n this.setAttribute('tabindex', this.checked ? '0' : '-1');\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n this.setAttribute('aria-disabled', this.disabled ? 'true' : 'false');\n }\n\n render() {\n return html`\n <span\n part=\"base\"\n class=${classMap({\n radio: true,\n 'radio--checked': this.checked,\n 'radio--disabled': this.disabled,\n 'radio--focused': this.hasFocus,\n 'radio--small': this.size === 'small',\n 'radio--medium': this.size === 'medium',\n 'radio--large': this.size === 'large'\n })}\n >\n <span part=\"${`control${this.checked ? ' control--checked' : ''}`}\" class=\"radio__control\">\n ${this.checked\n ? html` <syn-icon part=\"checked-icon\" class=\"radio__checked-icon\" library=\"system\" name=\"radio\"></syn-icon> `\n : ''}\n </span>\n\n <slot part=\"label\" class=\"radio__label\"></slot>\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'syn-radio': SynRadio;\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;AAMA,SAAS,gBAAgB;AACzB,SAAS,YAAY;AACrB,SAAS,UAAU,aAAa;AA0BhC,IAAqB,WAArB,cAAsC,eAAe;AAAA,EAmBnD,cAAc;AACZ,UAAM;AAhBC,mBAAU;AACV,SAAU,WAAW;AASD,gBAAqC;AAGtB,oBAAW;AAcvD,SAAQ,aAAa,MAAM;AACzB,WAAK,WAAW;AAChB,WAAK,KAAK,UAAU;AAAA,IACtB;AAEA,SAAQ,cAAc,MAAM;AAC1B,UAAI,CAAC,KAAK,UAAU;AAClB,aAAK,UAAU;AAAA,MACjB;AAAA,IACF;AAEA,SAAQ,cAAc,MAAM;AAC1B,WAAK,WAAW;AAChB,WAAK,KAAK,WAAW;AAAA,IACvB;AAxBE,SAAK,iBAAiB,QAAQ,KAAK,UAAU;AAC7C,SAAK,iBAAiB,SAAS,KAAK,WAAW;AAC/C,SAAK,iBAAiB,SAAS,KAAK,WAAW;AAAA,EACjD;AAAA,EAEA,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,qBAAqB;AAAA,EAC5B;AAAA,EAkBQ,uBAAuB;AAC7B,SAAK,aAAa,QAAQ,OAAO;AACjC,SAAK,aAAa,YAAY,IAAI;AAClC,SAAK,aAAa,iBAAiB,KAAK,WAAW,SAAS,OAAO;AAAA,EACrE;AAAA,EAGA,sBAAsB;AACpB,SAAK,aAAa,gBAAgB,KAAK,UAAU,SAAS,OAAO;AACjE,SAAK,aAAa,YAAY,KAAK,UAAU,MAAM,IAAI;AAAA,EACzD;AAAA,EAGA,uBAAuB;AACrB,SAAK,aAAa,iBAAiB,KAAK,WAAW,SAAS,OAAO;AAAA,EACrE;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,OAAO;AAAA,MACP,kBAAkB,KAAK;AAAA,MACvB,mBAAmB,KAAK;AAAA,MACxB,kBAAkB,KAAK;AAAA,MACvB,gBAAgB,KAAK,SAAS;AAAA,MAC9B,iBAAiB,KAAK,SAAS;AAAA,MAC/B,gBAAgB,KAAK,SAAS;AAAA,IAChC,CAAC,CAAC;AAAA;AAAA,sBAEY,UAAU,KAAK,UAAU,sBAAsB,EAAE,EAAE;AAAA,YAC7D,KAAK,UACH,8GACA,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMd;AACF;AAxFqB,SACZ,SAAyB;AADb,SAEZ,eAAe,EAAE,YAAY,QAAQ;AAEnC;AAAA,EAAR,MAAM;AAAA,GAJY,SAIV;AACU;AAAA,EAAlB,MAAM;AAAA,GALY,SAKA;AAGP;AAAA,EAAX,SAAS;AAAA,GARS,SAQP;AAMiB;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAdR,SAcU;AAGe;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAjBvB,SAiByB;AAqC5C;AAAA,EADC,MAAM,SAAS;AAAA,GArDG,SAsDnB;AAMA;AAAA,EADC,MAAM,YAAY,EAAE,sBAAsB,KAAK,CAAC;AAAA,GA3D9B,SA4DnB;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/button-group/button-group.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './button-group.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Button groups can be used to group related buttons into sections.\n * @documentation https://synergy.style/components/button-group\n * @status stable\n * @since 2.0\n *\n * @slot - One or more `<syn-button>` elements to display in the button group.\n *\n * @csspart base - The component's base wrapper.\n */\nexport default class SynButtonGroup extends SynergyElement {\n static styles: CSSResultGroup = styles;\n\n @query('slot') defaultSlot: HTMLSlotElement;\n\n @state() disableRole = false;\n\n /**\n * A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive\n * devices when interacting with the control and is strongly recommended.\n */\n @property() label = '';\n\n private handleFocus(event: Event) {\n const button = findButton(event.target as HTMLElement);\n button?.classList.add('syn-button-group__button--focus');\n }\n\n private handleBlur(event: Event) {\n const button = findButton(event.target as HTMLElement);\n button?.classList.remove('syn-button-group__button--focus');\n }\n\n private handleMouseOver(event: Event) {\n const button = findButton(event.target as HTMLElement);\n button?.classList.add('syn-button-group__button--hover');\n }\n\n private handleMouseOut(event: Event) {\n const button = findButton(event.target as HTMLElement);\n button?.classList.remove('syn-button-group__button--hover');\n }\n\n private handleSlotChange() {\n const slottedElements = [...this.defaultSlot.assignedElements({ flatten: true })] as HTMLElement[];\n\n slottedElements.forEach(el => {\n const index = slottedElements.indexOf(el);\n const button = findButton(el);\n\n if (button) {\n button.classList.add('syn-button-group__button');\n button.classList.toggle('syn-button-group__button--first', index === 0);\n button.classList.toggle('syn-button-group__button--inner', index > 0 && index < slottedElements.length - 1);\n button.classList.toggle('syn-button-group__button--last', index === slottedElements.length - 1);\n button.classList.toggle('syn-button-group__button--radio', button.tagName.toLowerCase() === 'syn-radio-button');\n }\n });\n }\n\n render() {\n // eslint-disable-next-line lit-a11y/mouse-events-have-key-events\n return html`\n <div\n part=\"base\"\n class=\"button-group\"\n role=\"${this.disableRole ? 'presentation' : 'group'}\"\n aria-label=${this.label}\n @focusout=${this.handleBlur}\n @focusin=${this.handleFocus}\n @mouseover=${this.handleMouseOver}\n @mouseout=${this.handleMouseOut}\n >\n <slot @slotchange=${this.handleSlotChange}></slot>\n </div>\n `;\n }\n}\n\nfunction findButton(el: HTMLElement) {\n const selector = 'syn-button, syn-radio-button';\n\n // The button could be the target element or a child of it (e.g. a dropdown or tooltip anchor)\n return el.closest(selector) ?? el.querySelector(selector);\n}\n"],
5
- "mappings": ";;;;;;;;;;;AAMA,SAAS,YAAY;AACrB,SAAS,UAAU,OAAO,aAAa;AAevC,IAAqB,iBAArB,cAA4C,eAAe;AAAA,EAA3D;AAAA;AAKW,uBAAc;AAMX,iBAAQ;AAAA;AAAA,EAEZ,YAAY,OAAc;AAChC,UAAM,SAAS,WAAW,MAAM,MAAqB;AACrD,qCAAQ,UAAU,IAAI;AAAA,EACxB;AAAA,EAEQ,WAAW,OAAc;AAC/B,UAAM,SAAS,WAAW,MAAM,MAAqB;AACrD,qCAAQ,UAAU,OAAO;AAAA,EAC3B;AAAA,EAEQ,gBAAgB,OAAc;AACpC,UAAM,SAAS,WAAW,MAAM,MAAqB;AACrD,qCAAQ,UAAU,IAAI;AAAA,EACxB;AAAA,EAEQ,eAAe,OAAc;AACnC,UAAM,SAAS,WAAW,MAAM,MAAqB;AACrD,qCAAQ,UAAU,OAAO;AAAA,EAC3B;AAAA,EAEQ,mBAAmB;AACzB,UAAM,kBAAkB,CAAC,GAAG,KAAK,YAAY,iBAAiB,EAAE,SAAS,KAAK,CAAC,CAAC;AAEhF,oBAAgB,QAAQ,QAAM;AAC5B,YAAM,QAAQ,gBAAgB,QAAQ,EAAE;AACxC,YAAM,SAAS,WAAW,EAAE;AAE5B,UAAI,QAAQ;AACV,eAAO,UAAU,IAAI,0BAA0B;AAC/C,eAAO,UAAU,OAAO,mCAAmC,UAAU,CAAC;AACtE,eAAO,UAAU,OAAO,mCAAmC,QAAQ,KAAK,QAAQ,gBAAgB,SAAS,CAAC;AAC1G,eAAO,UAAU,OAAO,kCAAkC,UAAU,gBAAgB,SAAS,CAAC;AAC9F,eAAO,UAAU,OAAO,mCAAmC,OAAO,QAAQ,YAAY,MAAM,kBAAkB;AAAA,MAChH;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EAEA,SAAS;AAEP,WAAO;AAAA;AAAA;AAAA;AAAA,gBAIK,KAAK,cAAc,iBAAiB,OAAO;AAAA,qBACtC,KAAK,KAAK;AAAA,oBACX,KAAK,UAAU;AAAA,mBAChB,KAAK,WAAW;AAAA,qBACd,KAAK,eAAe;AAAA,oBACrB,KAAK,cAAc;AAAA;AAAA,4BAEX,KAAK,gBAAgB;AAAA;AAAA;AAAA,EAG/C;AACF;AAnEqB,eACZ,SAAyB;AAEjB;AAAA,EAAd,MAAM,MAAM;AAAA,GAHM,eAGJ;AAEN;AAAA,EAAR,MAAM;AAAA,GALY,eAKV;AAMG;AAAA,EAAX,SAAS;AAAA,GAXS,eAWP;AA0Dd,SAAS,WAAW,IAAiB;AA3FrC;AA4FE,QAAM,WAAW;AAGjB,UAAO,QAAG,QAAQ,QAAQ,MAAnB,YAAwB,GAAG,cAAc,QAAQ;AAC1D;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/input/input.styles.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport customStyles from './input.custom.styles.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n ${formControlStyles}\n\n :host {\n display: block;\n }\n\n .input {\n flex: 1 1 auto;\n display: inline-flex;\n align-items: stretch;\n justify-content: start;\n position: relative;\n width: 100%;\n font-family: var(--syn-input-font-family);\n font-weight: var(--syn-input-font-weight);\n letter-spacing: var(--syn-input-letter-spacing);\n vertical-align: middle;\n overflow: hidden;\n cursor: text;\n transition:\n var(--syn-transition-fast) color,\n var(--syn-transition-fast) border,\n var(--syn-transition-fast) box-shadow,\n var(--syn-transition-fast) background-color;\n }\n\n /* Standard inputs */\n .input--standard {\n background-color: var(--syn-input-background-color);\n border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n }\n\n .input--standard:hover:not(.input--disabled) {\n background-color: var(--syn-input-background-color-hover);\n border-color: var(--syn-input-border-color-hover);\n }\n\n .input--standard.input--focused:not(.input--disabled) {\n background-color: var(--syn-input-background-color-focus);\n border-color: var(--syn-input-border-color-focus);\n box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);\n }\n\n .input--standard.input--focused:not(.input--disabled) .input__control {\n color: var(--syn-input-color-focus);\n }\n\n .input--standard.input--disabled {\n background-color: var(--syn-input-background-color-disabled);\n border-color: var(--syn-input-border-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .input--standard.input--disabled .input__control {\n color: var(--syn-input-color-disabled);\n }\n\n .input--standard.input--disabled .input__control::placeholder {\n color: var(--syn-input-placeholder-color-disabled);\n }\n\n /* Readonly inputs */\n .input--readonly {\n border: none;\n background-color: var(--syn-input-readonly-background-color);\n color: var(--syn-input-color);\n }\n\n .input--readonly:hover:not(.input--disabled) {\n background-color: var(--syn-input-readonly-background-color-hover);\n }\n\n .input--readonly.input--focused:not(.input--disabled) {\n background-color: var(--syn-input-readonly-background-color-focus);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .input--readonly.input--disabled {\n background-color: var(--syn-input-readonly-background-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .input__control {\n flex: 1 1 auto;\n font-family: inherit;\n font-size: inherit;\n font-weight: inherit;\n min-width: 0;\n height: 100%;\n color: var(--syn-input-color);\n border: none;\n background: inherit;\n box-shadow: none;\n padding: 0;\n margin: 0;\n cursor: inherit;\n -webkit-appearance: none;\n }\n\n .input__control::-webkit-search-decoration,\n .input__control::-webkit-search-cancel-button,\n .input__control::-webkit-search-results-button,\n .input__control::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n\n .input__control:-webkit-autofill,\n .input__control:-webkit-autofill:hover,\n .input__control:-webkit-autofill:focus,\n .input__control:-webkit-autofill:active {\n box-shadow: 0 0 0 var(--syn-input-height-large) var(--syn-input-background-color-hover) inset !important;\n -webkit-text-fill-color: var(--syn-color-primary-500);\n caret-color: var(--syn-input-color);\n }\n\n .input--readonly .input__control:-webkit-autofill,\n .input--readonly .input__control:-webkit-autofill:hover,\n .input--readonly .input__control:-webkit-autofill:focus,\n .input--readonly .input__control:-webkit-autofill:active {\n box-shadow: 0 0 0 var(--syn-input-height-large) var(--syn-input-readonly-background-color) inset !important;\n }\n\n .input__control::placeholder {\n color: var(--syn-input-placeholder-color);\n user-select: none;\n -webkit-user-select: none;\n }\n\n .input:hover:not(.input--disabled) .input__control {\n color: var(--syn-input-color-hover);\n }\n\n .input__control:focus {\n outline: none;\n }\n\n .input__prefix,\n .input__suffix {\n display: inline-flex;\n flex: 0 0 auto;\n align-items: center;\n cursor: default;\n }\n\n .input__prefix ::slotted(syn-icon),\n .input__suffix ::slotted(syn-icon) {\n color: var(--syn-input-icon-color);\n }\n\n /*\n * Size modifiers\n */\n\n .input--small {\n border-radius: var(--syn-input-border-radius-small);\n font-size: var(--syn-input-font-size-small);\n height: var(--syn-input-height-small);\n }\n\n .input--small .input__control {\n height: calc(var(--syn-input-height-small) - var(--syn-input-border-width) * 2);\n padding: 0 var(--syn-input-spacing-small);\n }\n\n .input--small .input__clear,\n .input--small .input__password-toggle {\n width: calc(1em + var(--syn-input-spacing-small) * 2);\n }\n\n .input--small .input__prefix ::slotted(*) {\n margin-inline-start: var(--syn-input-spacing-small);\n }\n\n .input--small .input__suffix ::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-small);\n }\n\n .input--medium {\n border-radius: var(--syn-input-border-radius-medium);\n font-size: var(--syn-input-font-size-medium);\n height: var(--syn-input-height-medium);\n }\n\n .input--medium .input__control {\n height: calc(var(--syn-input-height-medium) - var(--syn-input-border-width) * 2);\n padding: 0 var(--syn-input-spacing-medium);\n }\n\n .input--medium .input__clear,\n .input--medium .input__password-toggle {\n width: calc(1em + var(--syn-input-spacing-medium) * 2);\n }\n\n .input--medium .input__prefix ::slotted(*) {\n margin-inline-start: var(--syn-input-spacing-medium);\n }\n\n .input--medium .input__suffix ::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-medium);\n }\n\n .input--large {\n border-radius: var(--syn-input-border-radius-large);\n font-size: var(--syn-input-font-size-large);\n height: var(--syn-input-height-large);\n }\n\n .input--large .input__control {\n height: calc(var(--syn-input-height-large) - var(--syn-input-border-width) * 2);\n padding: 0 var(--syn-input-spacing-large);\n }\n\n .input--large .input__clear,\n .input--large .input__password-toggle {\n width: calc(1em + var(--syn-input-spacing-large) * 2);\n }\n\n .input--large .input__prefix ::slotted(*) {\n margin-inline-start: var(--syn-input-spacing-large);\n }\n\n .input--large .input__suffix ::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-large);\n }\n\n /*\n * Clearable + Password Toggle\n */\n\n .input__clear:not(.input__clear--visible) {\n visibility: hidden;\n }\n\n .input__clear,\n .input__password-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: var(--syn-input-icon-color);\n border: none;\n background: none;\n padding: 0;\n transition: var(--syn-transition-fast) color;\n cursor: pointer;\n }\n\n .input__clear:hover,\n .input__password-toggle:hover {\n color: var(--syn-input-icon-color-hover);\n }\n\n .input__clear:focus,\n .input__password-toggle:focus {\n outline: none;\n }\n\n .input--empty .input__clear {\n visibility: hidden;\n }\n\n /* Don't show the browser's password toggle in Edge */\n ::-ms-reveal {\n display: none;\n }\n\n /* Hide the built-in number spinner */\n input[type='number']::-webkit-outer-spin-button,\n input[type='number']::-webkit-inner-spin-button {\n -webkit-appearance: none;\n display: none;\n }\n\n input[type='number'] {\n -moz-appearance: textfield;\n }\n\n ${customStyles}\n`;\n\n"],
5
- "mappings": ";;;;;;;;;;;AAMA,SAAS,WAAW;AAKpB,IAAO,uBAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA,IACf,2BAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAwRjB,2BAAY;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/internal/synergy-element.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\n// Match event type name strings that are registered on GlobalEventHandlersEventMap...\ntype EventTypeRequiresDetail<T> = T extends keyof GlobalEventHandlersEventMap\n ? // ...where the event detail is an object...\n GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>>\n ? // ...that is non-empty...\n GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>>\n ? never\n : // ...and has at least one non-optional property\n Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail']\n ? never\n : T\n : never\n : never;\n\n// The inverse of the above (match any type that doesn't match EventTypeRequiresDetail)\ntype EventTypeDoesNotRequireDetail<T> = T extends keyof GlobalEventHandlersEventMap\n ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>>\n ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>>\n ? T\n : Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail']\n ? T\n : never\n : T\n : T;\n\n// `keyof EventTypesWithRequiredDetail` lists all registered event types that require detail\ntype EventTypesWithRequiredDetail = {\n [EventType in keyof GlobalEventHandlersEventMap as EventTypeRequiresDetail<EventType>]: true;\n};\n\n// `keyof EventTypesWithoutRequiredDetail` lists all registered event types that do NOT require detail\ntype EventTypesWithoutRequiredDetail = {\n [EventType in keyof GlobalEventHandlersEventMap as EventTypeDoesNotRequireDetail<EventType>]: true;\n};\n\n// Helper to make a specific property of an object non-optional\ntype WithRequired<T, K extends keyof T> = T & { [P in K]-?: T[P] };\n\n// Given an event name string, get a valid type for the options to initialize the event that is more restrictive than\n// just CustomEventInit when appropriate (validate the type of the event detail, and require it to be provided if the\n// event requires it)\ntype SynEventInit<T> = T extends keyof GlobalEventHandlersEventMap\n ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>>\n ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>>\n ? CustomEventInit<GlobalEventHandlersEventMap[T]['detail']>\n : Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail']\n ? CustomEventInit<GlobalEventHandlersEventMap[T]['detail']>\n : WithRequired<CustomEventInit<GlobalEventHandlersEventMap[T]['detail']>, 'detail'>\n : CustomEventInit\n : CustomEventInit;\n\n// Given an event name string, get the type of the event\ntype GetCustomEventType<T> = T extends keyof GlobalEventHandlersEventMap\n ? GlobalEventHandlersEventMap[T] extends CustomEvent<unknown>\n ? GlobalEventHandlersEventMap[T]\n : CustomEvent<unknown>\n : CustomEvent<unknown>;\n\n// `keyof ValidEventTypeMap` is equivalent to `keyof GlobalEventHandlersEventMap` but gives a nicer error message\ntype ValidEventTypeMap = EventTypesWithRequiredDetail | EventTypesWithoutRequiredDetail;\n\nexport default class SynergyElement extends LitElement {\n // Make localization attributes reactive\n @property() dir: string;\n @property() lang: string;\n\n /** Emits a custom event with more convenient defaults. */\n emit<T extends string & keyof EventTypesWithoutRequiredDetail>(\n name: EventTypeDoesNotRequireDetail<T>,\n options?: SynEventInit<T> | undefined\n ): GetCustomEventType<T>;\n emit<T extends string & keyof EventTypesWithRequiredDetail>(\n name: EventTypeRequiresDetail<T>,\n options: SynEventInit<T>\n ): GetCustomEventType<T>;\n emit<T extends string & keyof ValidEventTypeMap>(\n name: T,\n options?: SynEventInit<T> | undefined\n ): GetCustomEventType<T> {\n const event = new CustomEvent(name, {\n bubbles: true,\n cancelable: false,\n composed: true,\n detail: {},\n ...options\n });\n\n this.dispatchEvent(event);\n\n return event as GetCustomEventType<T>;\n }\n\n /* eslint-disable */\n // @ts-expect-error This is auto-injected at build time.\n static version = \"1.7.0\";\n \n\n static define(name: string, elementConstructor = this, options: ElementDefinitionOptions = {}) {\n const currentlyRegisteredConstructor = customElements.get(name) as\n | CustomElementConstructor\n | typeof SynergyElement;\n\n if (!currentlyRegisteredConstructor) {\n customElements.define(name, class extends elementConstructor {} as unknown as CustomElementConstructor, options);\n return;\n }\n\n let newVersion = ' (unknown version)';\n let existingVersion = newVersion;\n\n if ('version' in elementConstructor && elementConstructor.version) {\n newVersion = ' v' + elementConstructor.version;\n }\n\n if ('version' in currentlyRegisteredConstructor && currentlyRegisteredConstructor.version) {\n existingVersion = ' v' + currentlyRegisteredConstructor.version;\n }\n\n // Need to make sure we're not working with null or empty strings before doing version comparisons.\n if (newVersion && existingVersion && newVersion === existingVersion) {\n // If versions match, we don't need to warn anyone. Carry on.\n return;\n }\n\n console.warn(\n `Attempted to register <${name}>${newVersion}, but <${name}>${existingVersion} has already been registered.`\n );\n }\n\n static dependencies: Record<string, typeof SynergyElement> = {};\n\n constructor() {\n super();\n Object.entries((this.constructor as typeof SynergyElement).dependencies).forEach(([name, component]) => {\n (this.constructor as typeof SynergyElement).define(name, component);\n });\n }\n}\n\nexport interface SynergyFormControl extends SynergyElement {\n // Form attributes\n name: string;\n value: unknown;\n disabled?: boolean;\n defaultValue?: unknown;\n defaultChecked?: boolean;\n form?: string;\n\n // Constraint validation attributes\n pattern?: string;\n min?: number | string | Date;\n max?: number | string | Date;\n step?: number | 'any';\n required?: boolean;\n minlength?: number;\n maxlength?: number;\n\n // Form validation properties\n readonly validity: ValidityState;\n readonly validationMessage: string;\n\n // Form validation methods\n checkValidity: () => boolean;\n getForm: () => HTMLFormElement | null;\n reportValidity: () => boolean;\n setCustomValidity: (message: string) => void;\n}\n"],
5
- "mappings": ";;;;;;AAMA,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AA+DzB,IAAqB,iBAArB,cAA4C,WAAW;AAAA,EAcrD,KACE,MACA,SACuB;AACvB,UAAM,QAAQ,IAAI,YAAY,MAAM;AAAA,MAClC,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,QAAQ,CAAC;AAAA,OACN,QACJ;AAED,SAAK,cAAc,KAAK;AAExB,WAAO;AAAA,EACT;AAAA,EAOA,OAAO,OAAO,MAAc,qBAAqB,MAAM,UAAoC,CAAC,GAAG;AAC7F,UAAM,iCAAiC,eAAe,IAAI,IAAI;AAI9D,QAAI,CAAC,gCAAgC;AACnC,qBAAe,OAAO,MAAM,cAAc,mBAAmB;AAAA,MAAC,GAA0C,OAAO;AAC/G;AAAA,IACF;AAEA,QAAI,aAAa;AACjB,QAAI,kBAAkB;AAEtB,QAAI,aAAa,sBAAsB,mBAAmB,SAAS;AACjE,mBAAa,OAAO,mBAAmB;AAAA,IACzC;AAEA,QAAI,aAAa,kCAAkC,+BAA+B,SAAS;AACzF,wBAAkB,OAAO,+BAA+B;AAAA,IAC1D;AAGA,QAAI,cAAc,mBAAmB,eAAe,iBAAiB;AAEnE;AAAA,IACF;AAEA,YAAQ;AAAA,MACN,0BAA0B,IAAI,IAAI,UAAU,UAAU,IAAI,IAAI,eAAe;AAAA,IAC/E;AAAA,EACF;AAAA,EAIA,cAAc;AACZ,UAAM;AACN,WAAO,QAAS,KAAK,YAAsC,YAAY,EAAE,QAAQ,CAAC,CAAC,MAAM,SAAS,MAAM;AACtG,MAAC,KAAK,YAAsC,OAAO,MAAM,SAAS;AAAA,IACpE,CAAC;AAAA,EACH;AACF;AAAA;AAAA;AA5EqB,eAiCZ,UAAU;AAjCE,eAoEZ,eAAsD,CAAC;AAlElD;AAAA,EAAX,SAAS;AAAA,GAFS,eAEP;AACA;AAAA,EAAX,SAAS;AAAA,GAHS,eAGP;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/option/option.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport styles from './option.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Options define the selectable items within various form controls such as [select](/components/select).\n * @documentation https://synergy.style/components/option\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @slot - The option's label.\n * @slot prefix - Used to prepend an icon or similar element to the menu item.\n * @slot suffix - Used to append an icon or similar element to the menu item.\n *\n * @csspart checked-icon - The checked icon, an `<syn-icon>` element.\n * @csspart base - The component's base wrapper.\n * @csspart label - The option's label.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart suffix - The container that wraps the suffix.\n */\nexport default class SynOption extends SynergyElement {\n static styles: CSSResultGroup = styles;\n static dependencies = { 'syn-icon': SynIcon };\n\n private cachedTextLabel: string;\n // @ts-expect-error - Controller is currently unused\n private readonly localize = new LocalizeController(this);\n\n @query('.option__label') defaultSlot: HTMLSlotElement;\n\n @state() current = false; // the user has keyed into the option, but hasn't selected it yet (shows a highlight)\n @state() selected = false; // the option is selected and has aria-selected=\"true\"\n @state() hasHover = false; // we need this because Safari doesn't honor :hover styles while dragging\n\n /**\n * The option's value. When selected, the containing form control will receive this value. The value must be unique\n * from other options in the same group. Values may not contain spaces, as spaces are used as delimiters when listing\n * multiple values.\n */\n @property({ reflect: true }) value = '';\n\n /** Draws the option in a disabled state, preventing selection. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute('role', 'option');\n this.setAttribute('aria-selected', 'false');\n }\n\n private handleDefaultSlotChange() {\n const textLabel = this.getTextLabel();\n\n // Ignore the first time the label is set\n if (typeof this.cachedTextLabel === 'undefined') {\n this.cachedTextLabel = textLabel;\n return;\n }\n\n // When the label changes, emit a slotchange event so parent controls see it\n if (textLabel !== this.cachedTextLabel) {\n this.cachedTextLabel = textLabel;\n this.emit('slotchange', { bubbles: true, composed: false, cancelable: false });\n }\n }\n\n private handleMouseEnter() {\n this.hasHover = true;\n }\n\n private handleMouseLeave() {\n this.hasHover = false;\n }\n\n @watch('disabled')\n handleDisabledChange() {\n this.setAttribute('aria-disabled', this.disabled ? 'true' : 'false');\n }\n\n @watch('selected')\n handleSelectedChange() {\n this.setAttribute('aria-selected', this.selected ? 'true' : 'false');\n }\n\n @watch('value')\n handleValueChange() {\n // Ensure the value is a string. This ensures the next line doesn't error and allows framework users to pass numbers\n // instead of requiring them to cast the value to a string.\n if (typeof this.value !== 'string') {\n this.value = String(this.value);\n }\n\n if (this.value.includes(' ')) {\n console.error(`Option values cannot include a space. All spaces have been replaced with underscores.`, this);\n this.value = this.value.replace(/ /g, '_');\n }\n }\n\n /** Returns a plain text label based on the option's content. */\n getTextLabel() {\n return (this.textContent ?? '').trim();\n }\n\n render() {\n return html`\n <div\n part=\"base\"\n class=${classMap({\n option: true,\n 'option--current': this.current,\n 'option--disabled': this.disabled,\n 'option--selected': this.selected,\n 'option--hover': this.hasHover\n })}\n @mouseenter=${this.handleMouseEnter}\n @mouseleave=${this.handleMouseLeave}\n >\n <syn-icon part=\"checked-icon\" class=\"option__check\" name=\"check\" library=\"system\" aria-hidden=\"true\"></syn-icon>\n <slot part=\"prefix\" name=\"prefix\" class=\"option__prefix\"></slot>\n <slot part=\"label\" class=\"option__label\" @slotchange=${this.handleDefaultSlotChange}></slot>\n <slot part=\"suffix\" name=\"suffix\" class=\"option__suffix\"></slot>\n </div>\n `;\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;AAMA,SAAS,gBAAgB;AACzB,SAAS,YAAY;AAErB,SAAS,UAAU,OAAO,aAAa;AAyBvC,IAAqB,YAArB,cAAuC,eAAe;AAAA,EAAtD;AAAA;AAME;AAAA,SAAiB,WAAW,IAAI,mBAAmB,IAAI;AAI9C,mBAAU;AACV,oBAAW;AACX,oBAAW;AAOS,iBAAQ;AAGO,oBAAW;AAAA;AAAA,EAEvD,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,aAAa,QAAQ,QAAQ;AAClC,SAAK,aAAa,iBAAiB,OAAO;AAAA,EAC5C;AAAA,EAEQ,0BAA0B;AAChC,UAAM,YAAY,KAAK,aAAa;AAGpC,QAAI,OAAO,KAAK,oBAAoB,aAAa;AAC/C,WAAK,kBAAkB;AACvB;AAAA,IACF;AAGA,QAAI,cAAc,KAAK,iBAAiB;AACtC,WAAK,kBAAkB;AACvB,WAAK,KAAK,cAAc,EAAE,SAAS,MAAM,UAAU,OAAO,YAAY,MAAM,CAAC;AAAA,IAC/E;AAAA,EACF;AAAA,EAEQ,mBAAmB;AACzB,SAAK,WAAW;AAAA,EAClB;AAAA,EAEQ,mBAAmB;AACzB,SAAK,WAAW;AAAA,EAClB;AAAA,EAGA,uBAAuB;AACrB,SAAK,aAAa,iBAAiB,KAAK,WAAW,SAAS,OAAO;AAAA,EACrE;AAAA,EAGA,uBAAuB;AACrB,SAAK,aAAa,iBAAiB,KAAK,WAAW,SAAS,OAAO;AAAA,EACrE;AAAA,EAGA,oBAAoB;AAGlB,QAAI,OAAO,KAAK,UAAU,UAAU;AAClC,WAAK,QAAQ,OAAO,KAAK,KAAK;AAAA,IAChC;AAEA,QAAI,KAAK,MAAM,SAAS,GAAG,GAAG;AAC5B,cAAQ,MAAM,yFAAyF,IAAI;AAC3G,WAAK,QAAQ,KAAK,MAAM,QAAQ,MAAM,GAAG;AAAA,IAC3C;AAAA,EACF;AAAA;AAAA,EAGA,eAAe;AAjHjB;AAkHI,aAAQ,UAAK,gBAAL,YAAoB,IAAI,KAAK;AAAA,EACvC;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,QAAQ;AAAA,MACR,mBAAmB,KAAK;AAAA,MACxB,oBAAoB,KAAK;AAAA,MACzB,oBAAoB,KAAK;AAAA,MACzB,iBAAiB,KAAK;AAAA,IACxB,CAAC,CAAC;AAAA,sBACY,KAAK,gBAAgB;AAAA,sBACrB,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA,+DAIoB,KAAK,uBAAuB;AAAA;AAAA;AAAA;AAAA,EAIzF;AACF;AAxGqB,UACZ,SAAyB;AADb,UAEZ,eAAe,EAAE,YAAY,QAAQ;AAMnB;AAAA,EAAxB,MAAM,gBAAgB;AAAA,GARJ,UAQM;AAEhB;AAAA,EAAR,MAAM;AAAA,GAVY,UAUV;AACA;AAAA,EAAR,MAAM;AAAA,GAXY,UAWV;AACA;AAAA,EAAR,MAAM;AAAA,GAZY,UAYV;AAOoB;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAnBR,UAmBU;AAGe;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAtBvB,UAsByB;AAiC5C;AAAA,EADC,MAAM,UAAU;AAAA,GAtDE,UAuDnB;AAKA;AAAA,EADC,MAAM,UAAU;AAAA,GA3DE,UA4DnB;AAKA;AAAA,EADC,MAAM,OAAO;AAAA,GAhEK,UAiEnB;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/divider/divider.component.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { property } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './divider.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Dividers are used to visually separate or group elements.\n * @documentation https://synergy.style/components/divider\n * @status stable\n * @since 2.0\n *\n * @cssproperty --color - The color of the divider.\n * @cssproperty --width - The width of the divider.\n * @cssproperty --spacing - The spacing of the divider.\n */\nexport default class SynDivider extends SynergyElement {\n static styles: CSSResultGroup = styles;\n\n /** Draws the divider in a vertical orientation. */\n @property({ type: Boolean, reflect: true }) vertical = false;\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute('role', 'separator');\n }\n\n @watch('vertical')\n handleVerticalChange() {\n this.setAttribute('aria-orientation', this.vertical ? 'vertical' : 'horizontal');\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;AAMA,SAAS,gBAAgB;AAgBzB,IAAqB,aAArB,cAAwC,eAAe;AAAA,EAAvD;AAAA;AAI8C,oBAAW;AAAA;AAAA,EAEvD,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,aAAa,QAAQ,WAAW;AAAA,EACvC;AAAA,EAGA,uBAAuB;AACrB,SAAK,aAAa,oBAAoB,KAAK,WAAW,aAAa,YAAY;AAAA,EACjF;AACF;AAfqB,WACZ,SAAyB;AAGY;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAJvB,WAIyB;AAQ5C;AAAA,EADC,MAAM,UAAU;AAAA,GAXE,WAYnB;",
6
- "names": []
7
- }