@synergy-design-system/components 2.20.0 → 2.21.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 (329) hide show
  1. package/dist/chunks/{chunk.63VP3QC2.js → chunk.22K2VII3.js} +2 -2
  2. package/dist/chunks/{chunk.JA7VVPRB.js → chunk.24ZMDAM7.js} +3 -3
  3. package/dist/chunks/{chunk.2QBVB4AK.js → chunk.2HSBOERA.js} +2 -2
  4. package/dist/chunks/{chunk.E36EA2A5.js → chunk.2KMN54SL.js} +2 -2
  5. package/dist/chunks/{chunk.NK2YET6D.js → chunk.2U5B72GV.js} +2 -2
  6. package/dist/chunks/{chunk.NY3YYGVR.js → chunk.3Z44F32B.js} +2 -2
  7. package/dist/chunks/{chunk.LAM67JAY.js → chunk.444WAXYY.js} +2 -2
  8. package/dist/chunks/{chunk.6IUDE6QS.js → chunk.4DU55CZF.js} +2 -2
  9. package/dist/chunks/{chunk.PAVNUMET.js → chunk.53MU7ZSA.js} +3 -3
  10. package/dist/chunks/{chunk.NIS7LNOO.js → chunk.5RYJ4JRG.js} +12 -6
  11. package/dist/chunks/chunk.5RYJ4JRG.js.map +7 -0
  12. package/dist/chunks/{chunk.5VV5IENH.js → chunk.63TPU2Q4.js} +5 -5
  13. package/dist/chunks/{chunk.VCAVMNGP.js → chunk.6DVPRASB.js} +2 -2
  14. package/dist/chunks/{chunk.VCAVMNGP.js.map → chunk.6DVPRASB.js.map} +1 -1
  15. package/dist/chunks/{chunk.Y2PPRV2Z.js → chunk.6EJXXHTI.js} +9 -9
  16. package/dist/chunks/{chunk.6XXJJ2ZV.js → chunk.6LHWMYJQ.js} +2 -2
  17. package/dist/chunks/{chunk.OEQ54OHW.js → chunk.6ORGN4HO.js} +11 -5
  18. package/dist/chunks/chunk.6ORGN4HO.js.map +7 -0
  19. package/dist/chunks/{chunk.U5TBC2KB.js → chunk.7NWLTK5X.js} +2 -2
  20. package/dist/chunks/{chunk.RP4GNFAE.js → chunk.7Y2DDXJX.js} +2 -2
  21. package/dist/chunks/{chunk.GQM7WKPT.js → chunk.7YBKIIE7.js} +3 -3
  22. package/dist/chunks/{chunk.O5JCDSMK.js → chunk.A57CYHL4.js} +10 -4
  23. package/dist/chunks/chunk.A57CYHL4.js.map +7 -0
  24. package/dist/chunks/{chunk.6DDMOSWQ.js → chunk.AZ4RLLGC.js} +2 -2
  25. package/dist/chunks/{chunk.K7GZ5QMI.js → chunk.BOPAJNRC.js} +2 -2
  26. package/dist/chunks/{chunk.WS42S4IF.js → chunk.BTYY6QF4.js} +2 -2
  27. package/dist/chunks/{chunk.QX2UR7HH.js → chunk.BWITL5QJ.js} +2 -2
  28. package/dist/chunks/{chunk.YTI4FD6I.js → chunk.BXERHA7P.js} +2 -2
  29. package/dist/chunks/{chunk.7U5KG6IM.js → chunk.BYXIIS2U.js} +2 -2
  30. package/dist/chunks/{chunk.2EOIEVIL.js → chunk.C3X7IBH7.js} +2 -2
  31. package/dist/chunks/{chunk.UWAFXL5K.js → chunk.CUAXHO6A.js} +2 -2
  32. package/dist/chunks/{chunk.FTMPDQQE.js → chunk.CXPGDYKT.js} +2 -2
  33. package/dist/chunks/{chunk.LCZGMJAR.js → chunk.D6CRN545.js} +8 -8
  34. package/dist/chunks/{chunk.DGKMCOEP.js → chunk.DPJCGUEO.js} +9 -3
  35. package/dist/chunks/chunk.DPJCGUEO.js.map +7 -0
  36. package/dist/chunks/{chunk.5HYYHX6O.js → chunk.DXX5PAMY.js} +8 -2
  37. package/dist/chunks/chunk.DXX5PAMY.js.map +7 -0
  38. package/dist/chunks/{chunk.IC67TRRK.js → chunk.E47UYFGZ.js} +2 -2
  39. package/dist/chunks/{chunk.RDUBSHZP.js → chunk.EBFUBH7K.js} +9 -3
  40. package/dist/chunks/chunk.EBFUBH7K.js.map +7 -0
  41. package/dist/chunks/{chunk.SLXWCODG.js → chunk.EHRZTYMK.js} +2 -2
  42. package/dist/chunks/{chunk.XZ2OTPUE.js → chunk.F2YCO2BM.js} +2 -2
  43. package/dist/chunks/{chunk.6XCVIKBS.js → chunk.FXWMPXPJ.js} +2 -2
  44. package/dist/chunks/{chunk.XYTIQJOT.js → chunk.GE3RTZ5U.js} +2 -2
  45. package/dist/chunks/{chunk.LU2V7HEH.js → chunk.GONWKUS3.js} +2 -2
  46. package/dist/chunks/{chunk.OQE7E7O7.js → chunk.GZDFE6IM.js} +3 -3
  47. package/dist/chunks/{chunk.JETTTJ6N.js → chunk.H42PWZMH.js} +7 -7
  48. package/dist/chunks/{chunk.LY5A7C5T.js → chunk.H6NVKXE2.js} +2 -2
  49. package/dist/chunks/{chunk.Z4AAMNVO.js → chunk.HXCR2MHZ.js} +2 -2
  50. package/dist/chunks/{chunk.IIFZLC7B.js → chunk.I2CXW4IQ.js} +2 -2
  51. package/dist/chunks/{chunk.WJUCYEMY.js → chunk.I5POUS6I.js} +12 -6
  52. package/dist/chunks/{chunk.WJUCYEMY.js.map → chunk.I5POUS6I.js.map} +2 -2
  53. package/dist/chunks/{chunk.AYWO4ZTF.js → chunk.I652XHIG.js} +2 -2
  54. package/dist/chunks/{chunk.DRS6KUJI.js → chunk.I7KBGFOB.js} +2 -2
  55. package/dist/chunks/{chunk.CT726D3H.js → chunk.IDSWPDRF.js} +2 -2
  56. package/dist/chunks/{chunk.7FSW6QRP.js → chunk.IQJEP44K.js} +2 -2
  57. package/dist/chunks/{chunk.2IBYHTBO.js → chunk.IW64RDGB.js} +28 -9
  58. package/dist/chunks/chunk.IW64RDGB.js.map +7 -0
  59. package/dist/chunks/{chunk.FWHNNPQB.js → chunk.JDJ67Y5C.js} +9 -3
  60. package/dist/chunks/chunk.JDJ67Y5C.js.map +7 -0
  61. package/dist/chunks/chunk.JSEL4YPW.js +147 -0
  62. package/dist/chunks/chunk.JSEL4YPW.js.map +7 -0
  63. package/dist/chunks/{chunk.EQ2Y7FV7.js → chunk.JSYXPTUU.js} +10 -4
  64. package/dist/chunks/chunk.JSYXPTUU.js.map +7 -0
  65. package/dist/chunks/{chunk.NT7NV7FR.js → chunk.K75TBUMU.js} +2 -2
  66. package/dist/chunks/{chunk.7Z6YNI76.js → chunk.KEYRFHLR.js} +2 -2
  67. package/dist/chunks/{chunk.V66XL2Y2.js → chunk.KL322SB3.js} +10 -4
  68. package/dist/chunks/chunk.KL322SB3.js.map +7 -0
  69. package/dist/chunks/{chunk.WRFFXTJZ.js → chunk.KP3NASWQ.js} +2 -2
  70. package/dist/chunks/{chunk.2E3ZOJRL.js → chunk.KS6DNVN3.js} +2 -2
  71. package/dist/chunks/{chunk.7ZICOAJW.js → chunk.KYMMYTQI.js} +2 -2
  72. package/dist/chunks/{chunk.XXSXKUD3.js → chunk.LEW4WNVM.js} +2 -2
  73. package/dist/chunks/{chunk.JEQA2WEB.js → chunk.LX4NT5XO.js} +8 -2
  74. package/dist/chunks/chunk.LX4NT5XO.js.map +7 -0
  75. package/dist/chunks/{chunk.SSLNSSM4.js → chunk.M2K5UDOG.js} +2 -2
  76. package/dist/chunks/{chunk.OCQOKX2B.js → chunk.NAW62RFO.js} +10 -4
  77. package/dist/chunks/chunk.NAW62RFO.js.map +7 -0
  78. package/dist/chunks/{chunk.32O62HLM.js → chunk.NDHGAE3Z.js} +2 -2
  79. package/dist/chunks/{chunk.AJPSUGWO.js → chunk.NP2UDFN2.js} +2 -2
  80. package/dist/chunks/{chunk.COZMPK5M.js → chunk.NQNJWECO.js} +2 -2
  81. package/dist/chunks/{chunk.JC7CNIYQ.js → chunk.O7G6Z74T.js} +9 -3
  82. package/dist/chunks/chunk.O7G6Z74T.js.map +7 -0
  83. package/dist/chunks/{chunk.HZZFKI43.js → chunk.OB7QVS3V.js} +27 -22
  84. package/dist/chunks/chunk.OB7QVS3V.js.map +7 -0
  85. package/dist/chunks/{chunk.BQEV2WZL.js → chunk.OFU3ALA5.js} +8 -2
  86. package/dist/chunks/chunk.OFU3ALA5.js.map +7 -0
  87. package/dist/chunks/chunk.OLCT57R5.js +69 -0
  88. package/dist/chunks/chunk.OLCT57R5.js.map +7 -0
  89. package/dist/chunks/{chunk.W7YYZVAU.js → chunk.PSZ2KNDK.js} +2 -2
  90. package/dist/chunks/{chunk.YNHBOYDI.js → chunk.PTSG3HQA.js} +2 -2
  91. package/dist/chunks/{chunk.HC2NGMC6.js → chunk.Q24B36OM.js} +2 -2
  92. package/dist/chunks/{chunk.HATBOXY7.js → chunk.Q3YGVRWR.js} +2 -2
  93. package/dist/chunks/{chunk.PGIUXB4S.js → chunk.QN7EHOAI.js} +3 -3
  94. package/dist/chunks/{chunk.4YKN4LFN.js → chunk.RDEQ64F4.js} +3 -3
  95. package/dist/chunks/{chunk.35G32AHP.js → chunk.RF6XDVZV.js} +3 -3
  96. package/dist/chunks/{chunk.TKNTSPTY.js → chunk.RFCT6AM5.js} +5 -5
  97. package/dist/chunks/{chunk.KBVDCXR5.js → chunk.RGXEM6KV.js} +2 -2
  98. package/dist/chunks/{chunk.Z2DBY4DB.js → chunk.RIFZ4L34.js} +2 -2
  99. package/dist/chunks/{chunk.NIRC7MWB.js → chunk.ROKFIACN.js} +2 -2
  100. package/dist/chunks/chunk.RSCUHBW3.js +1 -0
  101. package/dist/chunks/chunk.RSCUHBW3.js.map +7 -0
  102. package/dist/chunks/{chunk.PRHLRJO4.js → chunk.SVGDQKLQ.js} +2 -2
  103. package/dist/chunks/{chunk.67HUHWCS.js → chunk.T7JHOPPW.js} +9 -3
  104. package/dist/chunks/{chunk.67HUHWCS.js.map → chunk.T7JHOPPW.js.map} +2 -2
  105. package/dist/chunks/{chunk.YJZO356D.js → chunk.TLNSCBQV.js} +2 -2
  106. package/dist/chunks/{chunk.LVJHLQNE.js → chunk.U47G7VR6.js} +8 -2
  107. package/dist/chunks/chunk.U47G7VR6.js.map +7 -0
  108. package/dist/chunks/{chunk.BAZYPBAX.js → chunk.U5ZUODJC.js} +11 -5
  109. package/dist/chunks/chunk.U5ZUODJC.js.map +7 -0
  110. package/dist/chunks/chunk.UPDPVGHT.js +59 -0
  111. package/dist/chunks/chunk.UPDPVGHT.js.map +7 -0
  112. package/dist/chunks/{chunk.KTYGJOB7.js → chunk.VRRTNN4P.js} +2 -2
  113. package/dist/chunks/{chunk.7V6QWLDJ.js → chunk.WMFEZGKC.js} +2 -2
  114. package/dist/chunks/{chunk.X3BO2BOQ.js → chunk.WUNEA5ON.js} +2 -2
  115. package/dist/chunks/{chunk.2BXFJQKK.js → chunk.WZ435WQP.js} +2 -2
  116. package/dist/chunks/{chunk.C2R6PG7G.js → chunk.XCEWNJDB.js} +2 -2
  117. package/dist/chunks/{chunk.IYU6UKJA.js → chunk.XIXB3JTC.js} +8 -2
  118. package/dist/chunks/chunk.XIXB3JTC.js.map +7 -0
  119. package/dist/chunks/{chunk.XU3L4ULT.js → chunk.XUHVFZ3J.js} +3 -3
  120. package/dist/chunks/{chunk.PDBM2LXE.js → chunk.YUUSAWQ5.js} +2 -2
  121. package/dist/chunks/{chunk.422MCLO6.js → chunk.YYU2DJ5D.js} +3 -3
  122. package/dist/chunks/{chunk.7WYVXV4D.js → chunk.Z22WOV57.js} +4 -4
  123. package/dist/chunks/{chunk.EIXX5VVK.js → chunk.ZR3W2TCY.js} +2 -2
  124. package/dist/chunks/{chunk.IKU5BGLU.js → chunk.ZTOAA6FB.js} +3 -3
  125. package/dist/components/accordion/accordion.component.js +5 -2
  126. package/dist/components/accordion/accordion.js +6 -3
  127. package/dist/components/alert/alert.component.js +9 -6
  128. package/dist/components/alert/alert.js +10 -7
  129. package/dist/components/badge/badge.component.js +5 -2
  130. package/dist/components/badge/badge.js +6 -3
  131. package/dist/components/breadcrumb/breadcrumb.component.js +5 -5
  132. package/dist/components/breadcrumb/breadcrumb.js +6 -6
  133. package/dist/components/breadcrumb-item/breadcrumb-item.component.js +2 -2
  134. package/dist/components/breadcrumb-item/breadcrumb-item.js +3 -3
  135. package/dist/components/button/button.component.js +9 -6
  136. package/dist/components/button/button.js +10 -7
  137. package/dist/components/button-group/button-group.component.js +2 -2
  138. package/dist/components/button-group/button-group.js +3 -3
  139. package/dist/components/card/card.component.js +2 -2
  140. package/dist/components/card/card.js +3 -3
  141. package/dist/components/checkbox/checkbox.component.js +8 -5
  142. package/dist/components/checkbox/checkbox.js +9 -6
  143. package/dist/components/combobox/combobox.component.js +10 -7
  144. package/dist/components/combobox/combobox.js +11 -8
  145. package/dist/components/details/details.component.js +8 -5
  146. package/dist/components/details/details.js +9 -6
  147. package/dist/components/dialog/dialog.component.js +9 -6
  148. package/dist/components/dialog/dialog.js +10 -7
  149. package/dist/components/divider/divider.component.js +2 -2
  150. package/dist/components/divider/divider.js +3 -3
  151. package/dist/components/drawer/drawer.component.js +9 -6
  152. package/dist/components/drawer/drawer.js +10 -7
  153. package/dist/components/dropdown/dropdown.component.js +3 -3
  154. package/dist/components/dropdown/dropdown.js +4 -4
  155. package/dist/components/file/file.component.js +10 -7
  156. package/dist/components/file/file.js +11 -8
  157. package/dist/components/header/header.component.js +6 -6
  158. package/dist/components/header/header.js +7 -7
  159. package/dist/components/icon/icon.component.js +4 -4
  160. package/dist/components/icon/icon.js +5 -5
  161. package/dist/components/icon-button/icon-button.component.js +8 -5
  162. package/dist/components/icon-button/icon-button.js +9 -6
  163. package/dist/components/input/input.component.js +9 -6
  164. package/dist/components/input/input.js +10 -7
  165. package/dist/components/menu/menu.component.js +2 -2
  166. package/dist/components/menu/menu.js +3 -3
  167. package/dist/components/menu-item/menu-item.component.js +8 -8
  168. package/dist/components/menu-item/menu-item.js +9 -9
  169. package/dist/components/menu-label/menu-label.component.js +3 -3
  170. package/dist/components/menu-label/menu-label.js +4 -4
  171. package/dist/components/nav-item/nav-item.component.js +3 -3
  172. package/dist/components/nav-item/nav-item.js +4 -4
  173. package/dist/components/optgroup/optgroup.component.js +3 -3
  174. package/dist/components/optgroup/optgroup.js +4 -4
  175. package/dist/components/option/option.component.js +5 -5
  176. package/dist/components/option/option.js +6 -6
  177. package/dist/components/popup/popup.component.js +2 -2
  178. package/dist/components/popup/popup.js +3 -3
  179. package/dist/components/prio-nav/prio-nav.component.js +11 -11
  180. package/dist/components/prio-nav/prio-nav.js +12 -12
  181. package/dist/components/progress-bar/progress-bar.component.js +2 -2
  182. package/dist/components/progress-bar/progress-bar.js +3 -3
  183. package/dist/components/progress-ring/progress-ring.component.js +3 -3
  184. package/dist/components/progress-ring/progress-ring.js +4 -4
  185. package/dist/components/radio/radio.component.js +8 -5
  186. package/dist/components/radio/radio.js +9 -6
  187. package/dist/components/radio-button/radio-button.component.js +5 -2
  188. package/dist/components/radio-button/radio-button.js +6 -3
  189. package/dist/components/radio-group/radio-group.component.js +7 -4
  190. package/dist/components/radio-group/radio-group.js +8 -5
  191. package/dist/components/range/range.component.js +8 -5
  192. package/dist/components/range/range.js +9 -6
  193. package/dist/components/range-tick/range-tick.component.js +2 -2
  194. package/dist/components/range-tick/range-tick.js +3 -3
  195. package/dist/components/resize-observer/resize-observer.component.js +2 -2
  196. package/dist/components/select/select.component.js +11 -8
  197. package/dist/components/select/select.js +12 -9
  198. package/dist/components/side-nav/side-nav.component.js +11 -8
  199. package/dist/components/side-nav/side-nav.js +12 -9
  200. package/dist/components/spinner/spinner.component.js +2 -2
  201. package/dist/components/spinner/spinner.js +3 -3
  202. package/dist/components/switch/switch.component.js +5 -2
  203. package/dist/components/switch/switch.js +6 -3
  204. package/dist/components/tab/tab.component.js +9 -6
  205. package/dist/components/tab/tab.js +10 -7
  206. package/dist/components/tab-group/tab-group.component.js +10 -7
  207. package/dist/components/tab-group/tab-group.js +11 -8
  208. package/dist/components/tab-panel/tab-panel.component.js +2 -2
  209. package/dist/components/tab-panel/tab-panel.js +3 -3
  210. package/dist/components/tag/tag.component.js +9 -6
  211. package/dist/components/tag/tag.js +10 -7
  212. package/dist/components/textarea/textarea.component.js +5 -2
  213. package/dist/components/textarea/textarea.js +6 -3
  214. package/dist/components/tooltip/tooltip.component.js +3 -3
  215. package/dist/components/tooltip/tooltip.js +4 -4
  216. package/dist/components/validate/utility.js +2 -2
  217. package/dist/components/validate/validate.component.js +11 -8
  218. package/dist/components/validate/validate.js +12 -9
  219. package/dist/custom-elements.json +1 -1
  220. package/dist/events/events.d.ts +1 -0
  221. package/dist/events/syn-default-settings-changed.d.ts +16 -0
  222. package/dist/styles/index.css +1 -1
  223. package/dist/synergy.d.ts +1 -0
  224. package/dist/synergy.js +142 -126
  225. package/dist/utilities/defaultSettings/base.d.ts +87 -0
  226. package/dist/utilities/defaultSettings/base.js +10 -0
  227. package/dist/utilities/defaultSettings/base.js.map +7 -0
  228. package/dist/utilities/defaultSettings/decorator.d.ts +12 -0
  229. package/dist/utilities/defaultSettings/decorator.js +10 -0
  230. package/dist/utilities/defaultSettings/decorator.js.map +7 -0
  231. package/dist/utilities/defaultSettings/functions.d.ts +41 -0
  232. package/dist/utilities/defaultSettings/functions.js +21 -0
  233. package/dist/utilities/defaultSettings/functions.js.map +7 -0
  234. package/dist/utilities/defaultSettings/index.d.ts +3 -0
  235. package/dist/utilities/defaultSettings/index.js +20 -0
  236. package/dist/utilities/defaultSettings/index.js.map +7 -0
  237. package/package.json +3 -3
  238. package/dist/chunks/chunk.2IBYHTBO.js.map +0 -7
  239. package/dist/chunks/chunk.5HYYHX6O.js.map +0 -7
  240. package/dist/chunks/chunk.BAZYPBAX.js.map +0 -7
  241. package/dist/chunks/chunk.BQEV2WZL.js.map +0 -7
  242. package/dist/chunks/chunk.DGKMCOEP.js.map +0 -7
  243. package/dist/chunks/chunk.EQ2Y7FV7.js.map +0 -7
  244. package/dist/chunks/chunk.FWHNNPQB.js.map +0 -7
  245. package/dist/chunks/chunk.HZZFKI43.js.map +0 -7
  246. package/dist/chunks/chunk.IYU6UKJA.js.map +0 -7
  247. package/dist/chunks/chunk.JC7CNIYQ.js.map +0 -7
  248. package/dist/chunks/chunk.JEQA2WEB.js.map +0 -7
  249. package/dist/chunks/chunk.LVJHLQNE.js.map +0 -7
  250. package/dist/chunks/chunk.NIS7LNOO.js.map +0 -7
  251. package/dist/chunks/chunk.O5JCDSMK.js.map +0 -7
  252. package/dist/chunks/chunk.OCQOKX2B.js.map +0 -7
  253. package/dist/chunks/chunk.OEQ54OHW.js.map +0 -7
  254. package/dist/chunks/chunk.RDUBSHZP.js.map +0 -7
  255. package/dist/chunks/chunk.V66XL2Y2.js.map +0 -7
  256. /package/dist/chunks/{chunk.63VP3QC2.js.map → chunk.22K2VII3.js.map} +0 -0
  257. /package/dist/chunks/{chunk.JA7VVPRB.js.map → chunk.24ZMDAM7.js.map} +0 -0
  258. /package/dist/chunks/{chunk.2QBVB4AK.js.map → chunk.2HSBOERA.js.map} +0 -0
  259. /package/dist/chunks/{chunk.E36EA2A5.js.map → chunk.2KMN54SL.js.map} +0 -0
  260. /package/dist/chunks/{chunk.NK2YET6D.js.map → chunk.2U5B72GV.js.map} +0 -0
  261. /package/dist/chunks/{chunk.NY3YYGVR.js.map → chunk.3Z44F32B.js.map} +0 -0
  262. /package/dist/chunks/{chunk.LAM67JAY.js.map → chunk.444WAXYY.js.map} +0 -0
  263. /package/dist/chunks/{chunk.6IUDE6QS.js.map → chunk.4DU55CZF.js.map} +0 -0
  264. /package/dist/chunks/{chunk.PAVNUMET.js.map → chunk.53MU7ZSA.js.map} +0 -0
  265. /package/dist/chunks/{chunk.5VV5IENH.js.map → chunk.63TPU2Q4.js.map} +0 -0
  266. /package/dist/chunks/{chunk.Y2PPRV2Z.js.map → chunk.6EJXXHTI.js.map} +0 -0
  267. /package/dist/chunks/{chunk.6XXJJ2ZV.js.map → chunk.6LHWMYJQ.js.map} +0 -0
  268. /package/dist/chunks/{chunk.U5TBC2KB.js.map → chunk.7NWLTK5X.js.map} +0 -0
  269. /package/dist/chunks/{chunk.RP4GNFAE.js.map → chunk.7Y2DDXJX.js.map} +0 -0
  270. /package/dist/chunks/{chunk.GQM7WKPT.js.map → chunk.7YBKIIE7.js.map} +0 -0
  271. /package/dist/chunks/{chunk.6DDMOSWQ.js.map → chunk.AZ4RLLGC.js.map} +0 -0
  272. /package/dist/chunks/{chunk.K7GZ5QMI.js.map → chunk.BOPAJNRC.js.map} +0 -0
  273. /package/dist/chunks/{chunk.WS42S4IF.js.map → chunk.BTYY6QF4.js.map} +0 -0
  274. /package/dist/chunks/{chunk.QX2UR7HH.js.map → chunk.BWITL5QJ.js.map} +0 -0
  275. /package/dist/chunks/{chunk.YTI4FD6I.js.map → chunk.BXERHA7P.js.map} +0 -0
  276. /package/dist/chunks/{chunk.7U5KG6IM.js.map → chunk.BYXIIS2U.js.map} +0 -0
  277. /package/dist/chunks/{chunk.2EOIEVIL.js.map → chunk.C3X7IBH7.js.map} +0 -0
  278. /package/dist/chunks/{chunk.UWAFXL5K.js.map → chunk.CUAXHO6A.js.map} +0 -0
  279. /package/dist/chunks/{chunk.FTMPDQQE.js.map → chunk.CXPGDYKT.js.map} +0 -0
  280. /package/dist/chunks/{chunk.LCZGMJAR.js.map → chunk.D6CRN545.js.map} +0 -0
  281. /package/dist/chunks/{chunk.IC67TRRK.js.map → chunk.E47UYFGZ.js.map} +0 -0
  282. /package/dist/chunks/{chunk.SLXWCODG.js.map → chunk.EHRZTYMK.js.map} +0 -0
  283. /package/dist/chunks/{chunk.XZ2OTPUE.js.map → chunk.F2YCO2BM.js.map} +0 -0
  284. /package/dist/chunks/{chunk.6XCVIKBS.js.map → chunk.FXWMPXPJ.js.map} +0 -0
  285. /package/dist/chunks/{chunk.XYTIQJOT.js.map → chunk.GE3RTZ5U.js.map} +0 -0
  286. /package/dist/chunks/{chunk.LU2V7HEH.js.map → chunk.GONWKUS3.js.map} +0 -0
  287. /package/dist/chunks/{chunk.OQE7E7O7.js.map → chunk.GZDFE6IM.js.map} +0 -0
  288. /package/dist/chunks/{chunk.JETTTJ6N.js.map → chunk.H42PWZMH.js.map} +0 -0
  289. /package/dist/chunks/{chunk.LY5A7C5T.js.map → chunk.H6NVKXE2.js.map} +0 -0
  290. /package/dist/chunks/{chunk.Z4AAMNVO.js.map → chunk.HXCR2MHZ.js.map} +0 -0
  291. /package/dist/chunks/{chunk.IIFZLC7B.js.map → chunk.I2CXW4IQ.js.map} +0 -0
  292. /package/dist/chunks/{chunk.AYWO4ZTF.js.map → chunk.I652XHIG.js.map} +0 -0
  293. /package/dist/chunks/{chunk.DRS6KUJI.js.map → chunk.I7KBGFOB.js.map} +0 -0
  294. /package/dist/chunks/{chunk.CT726D3H.js.map → chunk.IDSWPDRF.js.map} +0 -0
  295. /package/dist/chunks/{chunk.7FSW6QRP.js.map → chunk.IQJEP44K.js.map} +0 -0
  296. /package/dist/chunks/{chunk.NT7NV7FR.js.map → chunk.K75TBUMU.js.map} +0 -0
  297. /package/dist/chunks/{chunk.7Z6YNI76.js.map → chunk.KEYRFHLR.js.map} +0 -0
  298. /package/dist/chunks/{chunk.WRFFXTJZ.js.map → chunk.KP3NASWQ.js.map} +0 -0
  299. /package/dist/chunks/{chunk.2E3ZOJRL.js.map → chunk.KS6DNVN3.js.map} +0 -0
  300. /package/dist/chunks/{chunk.7ZICOAJW.js.map → chunk.KYMMYTQI.js.map} +0 -0
  301. /package/dist/chunks/{chunk.XXSXKUD3.js.map → chunk.LEW4WNVM.js.map} +0 -0
  302. /package/dist/chunks/{chunk.SSLNSSM4.js.map → chunk.M2K5UDOG.js.map} +0 -0
  303. /package/dist/chunks/{chunk.32O62HLM.js.map → chunk.NDHGAE3Z.js.map} +0 -0
  304. /package/dist/chunks/{chunk.AJPSUGWO.js.map → chunk.NP2UDFN2.js.map} +0 -0
  305. /package/dist/chunks/{chunk.COZMPK5M.js.map → chunk.NQNJWECO.js.map} +0 -0
  306. /package/dist/chunks/{chunk.W7YYZVAU.js.map → chunk.PSZ2KNDK.js.map} +0 -0
  307. /package/dist/chunks/{chunk.YNHBOYDI.js.map → chunk.PTSG3HQA.js.map} +0 -0
  308. /package/dist/chunks/{chunk.HC2NGMC6.js.map → chunk.Q24B36OM.js.map} +0 -0
  309. /package/dist/chunks/{chunk.HATBOXY7.js.map → chunk.Q3YGVRWR.js.map} +0 -0
  310. /package/dist/chunks/{chunk.PGIUXB4S.js.map → chunk.QN7EHOAI.js.map} +0 -0
  311. /package/dist/chunks/{chunk.4YKN4LFN.js.map → chunk.RDEQ64F4.js.map} +0 -0
  312. /package/dist/chunks/{chunk.35G32AHP.js.map → chunk.RF6XDVZV.js.map} +0 -0
  313. /package/dist/chunks/{chunk.TKNTSPTY.js.map → chunk.RFCT6AM5.js.map} +0 -0
  314. /package/dist/chunks/{chunk.KBVDCXR5.js.map → chunk.RGXEM6KV.js.map} +0 -0
  315. /package/dist/chunks/{chunk.Z2DBY4DB.js.map → chunk.RIFZ4L34.js.map} +0 -0
  316. /package/dist/chunks/{chunk.NIRC7MWB.js.map → chunk.ROKFIACN.js.map} +0 -0
  317. /package/dist/chunks/{chunk.PRHLRJO4.js.map → chunk.SVGDQKLQ.js.map} +0 -0
  318. /package/dist/chunks/{chunk.YJZO356D.js.map → chunk.TLNSCBQV.js.map} +0 -0
  319. /package/dist/chunks/{chunk.KTYGJOB7.js.map → chunk.VRRTNN4P.js.map} +0 -0
  320. /package/dist/chunks/{chunk.7V6QWLDJ.js.map → chunk.WMFEZGKC.js.map} +0 -0
  321. /package/dist/chunks/{chunk.X3BO2BOQ.js.map → chunk.WUNEA5ON.js.map} +0 -0
  322. /package/dist/chunks/{chunk.2BXFJQKK.js.map → chunk.WZ435WQP.js.map} +0 -0
  323. /package/dist/chunks/{chunk.C2R6PG7G.js.map → chunk.XCEWNJDB.js.map} +0 -0
  324. /package/dist/chunks/{chunk.XU3L4ULT.js.map → chunk.XUHVFZ3J.js.map} +0 -0
  325. /package/dist/chunks/{chunk.PDBM2LXE.js.map → chunk.YUUSAWQ5.js.map} +0 -0
  326. /package/dist/chunks/{chunk.422MCLO6.js.map → chunk.YYU2DJ5D.js.map} +0 -0
  327. /package/dist/chunks/{chunk.7WYVXV4D.js.map → chunk.Z22WOV57.js.map} +0 -0
  328. /package/dist/chunks/{chunk.EIXX5VVK.js.map → chunk.ZR3W2TCY.js.map} +0 -0
  329. /package/dist/chunks/{chunk.IKU5BGLU.js.map → chunk.ZTOAA6FB.js.map} +0 -0
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/details/details.component.ts"],
4
- "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../../internal/animate.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query } from 'lit/decorators.js';\nimport { waitForEvent } from '../../internal/event.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport styles from './details.styles.js';\nimport customStyles from './details.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Details show a brief summary and expand to show additional content.\n * @documentation https://synergy.style/components/details\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @slot - The details' main content.\n * @slot summary - The details' summary. Alternatively, you can use the `summary` attribute.\n * @slot expand-icon - Optional expand icon to use instead of the default. Works best with `<syn-icon>`.\n * @slot collapse-icon - Optional collapse icon to use instead of the default. Works best with `<syn-icon>`.\n *\n * @event syn-show - Emitted when the details opens.\n * @event syn-after-show - Emitted after the details opens and all animations are complete.\n * @event syn-hide - Emitted when the details closes.\n * @event syn-after-hide - Emitted after the details closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper.\n * @csspart header - The header that wraps both the summary and the expand/collapse icon.\n * @csspart summary - The container that wraps the summary.\n * @csspart summary-icon - The container that wraps the expand/collapse icons.\n * @csspart content - The details content.\n *\n * @animation details.show - The animation to use when showing details. You can use `height: auto` with this animation.\n * @animation details.hide - The animation to use when hiding details. You can use `height: auto` with this animation.\n */\nexport default class SynDetails extends SynergyElement {\n static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n static dependencies = {\n 'syn-icon': SynIcon\n };\n\n private readonly localize = new LocalizeController(this);\n\n @query('.details') details: HTMLDetailsElement;\n @query('.details__header') header: HTMLElement;\n @query('.details__body') body: HTMLElement;\n @query('.details__expand-icon-slot') expandIconSlot: HTMLSlotElement;\n\n detailsObserver: MutationObserver;\n\n /**\n * Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you\n * can use the `show()` and `hide()` methods and this attribute will reflect the details' open state.\n */\n @property({ type: Boolean, reflect: true }) open = false;\n\n /** The summary to show in the header. If you need to display HTML, use the `summary` slot instead. */\n @property() summary: string;\n\n /** Disables the details so it can't be toggled. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Draws the details as contained element. */\n @property({ type: Boolean, reflect: true }) contained = false;\n\n /** The details's size. */\n @property({ reflect: true }) size: 'medium' | 'large' = 'medium';\n\n firstUpdated() {\n this.body.style.height = this.open ? 'auto' : '0';\n if (this.open) {\n this.details.open = true;\n }\n\n this.detailsObserver = new MutationObserver(changes => {\n for (const change of changes) {\n if (change.type === 'attributes' && change.attributeName === 'open') {\n if (this.details.open) {\n this.show();\n } else {\n this.hide();\n }\n }\n }\n });\n this.detailsObserver.observe(this.details, { attributes: true });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.detailsObserver?.disconnect();\n }\n\n private handleSummaryClick(event: MouseEvent) {\n event.preventDefault();\n\n if (!this.disabled) {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n this.header.focus();\n }\n }\n\n private handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n event.preventDefault();\n this.show();\n }\n }\n\n @watch('open', { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.open) {\n this.details.open = true;\n // Show\n const slShow = this.emit('syn-show', { cancelable: true });\n if (slShow.defaultPrevented) {\n this.open = false;\n this.details.open = false;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, 'details.show', { dir: this.localize.dir() });\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = 'auto';\n\n this.emit('syn-after-show');\n } else {\n // Hide\n const slHide = this.emit('syn-hide', { cancelable: true });\n if (slHide.defaultPrevented) {\n this.details.open = true;\n this.open = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, 'details.hide', { dir: this.localize.dir() });\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = 'auto';\n\n this.details.open = false;\n this.emit('syn-after-hide');\n }\n }\n\n /** Shows the details. */\n async show() {\n if (this.open || this.disabled) {\n return undefined;\n }\n\n this.open = true;\n return waitForEvent(this, 'syn-after-show');\n }\n\n /** Hides the details */\n async hide() {\n if (!this.open || this.disabled) {\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'syn-after-hide');\n }\n\n render() {\n return html`\n <details\n part=\"base\"\n class=${classMap({\n details: true,\n 'details--size-medium': this.size === 'medium',\n 'details--size-large': this.size === 'large',\n 'details--open': this.open,\n 'details--disabled': this.disabled,\n 'details--contained': this.contained,\n })}\n >\n <summary\n part=\"header\"\n id=\"header\"\n class=\"details__header\"\n role=\"button\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-controls=\"content\"\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @click=${this.handleSummaryClick}\n @keydown=${this.handleSummaryKeyDown}\n >\n <slot name=\"summary\" part=\"summary\" class=\"details__summary\">${this.summary}</slot>\n\n <span part=\"summary-icon\" class=\"details__summary-icon\">\n <slot name=\"expand-icon\">\n <syn-icon library=\"system\" name=\"chevron-down\"></syn-icon>\n </slot>\n <slot name=\"collapse-icon\">\n <syn-icon library=\"system\" name=\"chevron-down\"></syn-icon>\n </slot>\n </span>\n </summary>\n\n <div class=\"details__body\" role=\"region\" aria-labelledby=\"header\">\n <slot part=\"content\" id=\"content\" class=\"details__content\"></slot>\n </div>\n </details>\n `;\n }\n}\n\nsetDefaultAnimation('details.show', {\n keyframes: [\n { height: '0', opacity: '0' },\n { height: 'auto', opacity: '1' }\n ],\n options: { duration: 250, easing: 'linear' }\n});\n\nsetDefaultAnimation('details.hide', {\n keyframes: [\n { height: 'auto', opacity: '1' },\n { height: '0', opacity: '0' }\n ],\n options: { duration: 250, easing: 'linear' }\n});\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/switch/switch.component.ts"],
4
- "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\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 { HasSlotController } from '../../internal/slot.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 componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './switch.styles.js';\nimport customStyles from './switch.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Switches allow the user to toggle an option on or off.\n * @documentation https://synergy.style/components/switch\n * @status stable\n * @since 2.0\n *\n * @slot - The switch's label.\n * @slot help-text - Text that describes how to use the switch. Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when the control's checked state changes.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\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 control that houses the switch's thumb.\n * @csspart thumb - The switch's thumb.\n * @csspart label - The switch's label.\n * @csspart form-control-help-text - The help text's wrapper.\n *\n * @cssproperty --width - The width of the switch.\n * @cssproperty --height - The height of the switch.\n * @cssproperty --thumb-size - The size of the thumb.\n */\nexport default class SynSwitch extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [componentStyles, formControlStyles, styles, formControlCustomStyles, customStyles];\n\n private readonly formControlController = new FormControlController(this, {\n value: (control: SynSwitch) => (control.checked ? control.value || 'on' : undefined),\n defaultValue: (control: SynSwitch) => control.defaultChecked,\n setValue: (control: SynSwitch, checked: boolean) => (control.checked = checked)\n });\n private readonly hasSlotController = new HasSlotController(this, 'help-text');\n\n @query('input[type=\"checkbox\"]') input: HTMLInputElement;\n\n @state() private hasFocus = false;\n @property() title = ''; // make reactive to pass through\n\n /** The name of the switch, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /** The current value of the switch, submitted as a name/value pair with form data. */\n @property() value: string;\n\n /** The switch's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Disables the switch. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Draws the switch in a checked state. */\n @property({ type: Boolean, reflect: true }) checked = 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 switch a required field. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /** The switch's help text. If you need to display HTML, use the `help-text` slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\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 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 handleClick() {\n this.checked = !this.checked;\n this.emit('syn-change');\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n this.checked = false;\n this.emit('syn-change');\n this.emit('syn-input');\n }\n\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n this.checked = true;\n this.emit('syn-change');\n this.emit('syn-input');\n }\n }\n\n @watch('checked', { waitUntilFirstUpdate: true })\n handleCheckedChange() {\n this.input.checked = this.checked; // force a sync update\n this.formControlController.updateValidity();\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n // Disabled form controls are always valid\n this.formControlController.setValidity(true);\n }\n\n /** Simulates a click on the switch. */\n click() {\n this.input.click();\n }\n\n /** Sets focus on the switch. */\n focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the switch. */\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 /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n this.input.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n render() {\n const hasHelpTextSlot = this.hasSlotController.test('help-text');\n const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n\n return html`\n <div\n class=${classMap({\n 'form-control': true,\n 'form-control--small': this.size === 'small',\n 'form-control--medium': this.size === 'medium',\n 'form-control--large': this.size === 'large',\n 'form-control--has-help-text': hasHelpText\n })}\n >\n <label\n part=\"base\"\n class=${classMap({\n switch: true,\n 'switch--checked': this.checked,\n 'switch--disabled': this.disabled,\n 'switch--focused': this.hasFocus,\n 'switch--small': this.size === 'small',\n 'switch--medium': this.size === 'medium',\n 'switch--large': this.size === 'large'\n })}\n >\n <input\n class=\"switch__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 .checked=${live(this.checked)}\n .disabled=${this.disabled}\n .required=${this.required}\n role=\"switch\"\n aria-checked=${this.checked ? 'true' : 'false'}\n aria-describedby=\"help-text\"\n @click=${this.handleClick}\n @input=${this.handleInput}\n @invalid=${this.handleInvalid}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @keydown=${this.handleKeyDown}\n />\n\n <span part=\"control\" class=\"switch__control\">\n <span part=\"thumb\" class=\"switch__thumb\"></span>\n </span>\n\n <div part=\"label\" class=\"switch__label\">\n <slot></slot>\n </div>\n </label>\n\n <div\n aria-hidden=${hasHelpText ? 'false' : 'true'}\n class=\"form-control__help-text\"\n id=\"help-text\"\n part=\"form-control-help-text\"\n >\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'syn-switch': SynSwitch;\n }\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/badge/badge.component.ts"],
4
- "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport styles from './badge.styles.js';\nimport customStyles from './badge.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://synergy.style/components/badge\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */\nexport default class SynBadge extends SynergyElement {\n \n private readonly localize = new LocalizeController(this);\n static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n /** The badge's theme variant. */\n @property({ reflect: true }) variant: 'primary' | 'success' | 'neutral' | 'warning' | 'danger' = 'primary';\n\n render() {\n return html`\n <span\n part=\"base\"\n class=${classMap({\n badge: true,\n 'badge--primary': this.variant === 'primary',\n 'badge--success': this.variant === 'success',\n 'badge--neutral': this.variant === 'neutral',\n 'badge--warning': this.variant === 'warning',\n 'badge--danger': this.variant === 'danger',\n })}\n role=\"status\"\n >\n <slot>\n <span class=\"visually-hidden\">\n ${this.localize.term(\n (this.variant === 'primary' || this.variant === 'neutral')\n ? 'notification'\n : this.variant\n )}\n </span>\n </slot>\n </span>\n `;\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;AAQA,SAAS,gBAAgB;AACzB,SAAS,YAAY;AACrB,SAAS,gBAAgB;AAkBzB,IAAqB,WAArB,cAAsC,eAAe;AAAA,EAArD;AAAA;AAEE,SAAiB,WAAW,IAAI,mBAAmB,IAAI;AAI1B,mBAAoE;AAAA;AAAA,EAEjG,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,OAAO;AAAA,MACP,kBAAkB,KAAK,YAAY;AAAA,MACnC,kBAAkB,KAAK,YAAY;AAAA,MACnC,kBAAkB,KAAK,YAAY;AAAA,MACnC,kBAAkB,KAAK,YAAY;AAAA,MACnC,iBAAiB,KAAK,YAAY;AAAA,IACpC,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,cAKI,KAAK,SAAS;AAAA,MACb,KAAK,YAAY,aAAa,KAAK,YAAY,YAC5C,iBACA,KAAK;AAAA,IACT,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,EAKb;AACF;AAlCqB,SAGZ,SAAyB,CAAC,0BAAiB,sBAAQ,2BAAY;AAGzC;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GANR,SAMU;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/range/range.component.ts"],
4
- "sourcesContent": ["/* eslint-disable complexity */\nimport type { CSSResultGroup, PropertyValues } from 'lit';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property, query, queryAll } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\nimport { defaultValue } from '../../internal/default-value.js';\nimport { FormControlController, customErrorValidityState, validValidityState } from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynTooltip from '../tooltip/tooltip.component.js';\nimport {\n arraysDiffer,\n getNormalizedValueFromClientX,\n numericSort,\n} from './utility.js';\nimport styles from './range.styles.js';\n\n/**\n * @summary Ranges allow the user to select values within a given range using one or two thumbs.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-range--docs\n * @status stable\n *\n * @dependency syn-tooltip\n *\n * @slot label - The range's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the range.\n * @slot suffix - Used to append a presentational icon or similar element to the range.\n * @slot help-text - Text that describes how to use the range.\n * Alternatively, you can use the `help-text` attribute.\n * @slot ticks - Used to display tick marks at specific intervals along the range.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n * and its constraints aren't satisfied.\n * @event syn-move - Emitted when the user moves a thumb, either via touch or keyboard.\n * Use `Event.preventDefault()` to prevent movement.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart input-wrapper - The container that wraps the input track and ticks.\n * @csspart track-wrapper - The wrapper for the track.\n * @csspart track - The inactive track.\n * @csspart active-track - The active track.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart ticks - The container that wraps the tick marks.\n * @csspart thumb - The thumb(s) that the user can drag to change the range.\n *\n * @csspart tooltip__base - The base of the tooltip\n * @csspart tooltip__arrow - The arrow of the tooltip\n * @csspart tooltip__popup - The popup of the tooltip\n * @csspart tooltip__body - The body of the tooltip\n *\n * @cssproperty --thumb-size - The size of a thumb.\n * @cssproperty --thumb-hit-area-size - The clickable area around the thumb.\n * Per default this is set to 140% of the thumb size. Must be a scale css value (defaults to 1.4).\n * @cssproperty --track-hit-area-size - The clickable area around the track (top and left).\n * @cssproperty --track-color-active - Color of the track representing the current value.\n * @cssproperty --track-color-inactive - Color of the track that represents the remaining value.\n * @cssproperty --track-height - The height of the track.\n * @cssproperty --track-active-offset - The point of origin of the active track,\n * starting at the left side of the range.\n */\nexport default class SynRange extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [\n componentStyles,\n formControlStyles,\n formControlCustomStyles,\n styles,\n ];\n\n static dependencies = {\n 'syn-tooltip': SynTooltip,\n };\n\n /** The name of the range, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /** The range's label. If you need to display HTML, use the `label` slot instead. */\n @property() label = '';\n\n /** The range's help text. If you need to display HTML, use the help-text slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\n\n /** Disables the range. */\n @property({ reflect: true, type: Boolean }) disabled = false;\n\n /** The minimum acceptable value of the range. */\n @property({ type: Number }) min = 0;\n\n /** The maximum acceptable value of the range. */\n @property({ type: Number }) max = 100;\n\n /** The interval at which the range will increase and decrease. */\n @property({ type: Number }) step = 1;\n\n /** The range's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** The preferred placement of the range's tooltip. Use \"none\" to disable the tooltip */\n @property({ attribute: 'tooltip-placement', type: String }) tooltipPlacement: 'top' | 'bottom' | 'none' = 'top';\n\n /** The current values of the input (in ascending order) as a string of space separated values */\n @property({ type: String })\n set value(value: string | null) {\n this.#value = value ? value.split(' ').map(n => +n).sort(numericSort) : [];\n }\n\n get value() {\n return this.#value.slice().sort(numericSort).join(' ');\n }\n\n /**\n * Set to true to restrict the movement of a thumb to its next and previous thumb.\n * This only affects multi range components\n */\n @property({ attribute: 'restrict-movement', type: Boolean }) restrictMovement = false;\n\n /** Gets or sets the current values of the range as an array of numbers */\n set valueAsArray(value: readonly number[] | null) {\n const oldValue = this.#value;\n this.#value = Array.isArray(value) ? value.slice().sort(numericSort) : value || [];\n if (arraysDiffer(oldValue, this.#value)) {\n this.requestUpdate('value', oldValue.join(' '));\n }\n }\n\n get valueAsArray() {\n return [...this.#value].sort(numericSort);\n }\n\n /** The default value of the form control. Primarily used for resetting the form control. */\n @defaultValue() defaultValue = '0';\n\n /**\n * By default, form controls are associated with the nearest containing `<form>` element.\n * This attribute allows you to place the form control outside of a form\n * and associate it with the form that has this `id`.\n * The form must be in the same document or shadow root for this to work.\n */\n @property({ reflect: true }) form = '';\n\n /**\n * A function used to format the tooltip's value.\n * The value of the thumb is passed as the only argument.\n * The function should return a string to display in the tooltip.\n */\n @property({ attribute: false }) tooltipFormatter: (value: number) => string;\n\n @query('.input__wrapper') baseDiv: HTMLDivElement;\n\n @query('.active-track') activeTrack: HTMLDivElement;\n\n @query('.ticks') ticks: HTMLDivElement;\n\n @queryAll('.thumb') thumbs: NodeListOf<HTMLDivElement>;\n\n @query('.range__validation-input') validationInput: HTMLInputElement;\n\n private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label', 'prefix', 'suffix', 'ticks');\n\n private readonly formControlController = new FormControlController(this, { assumeInteractionOn: ['syn-change'] });\n\n private localize = new LocalizeController(this);\n\n private visibilityObserver: IntersectionObserver;\n\n #value: readonly number[] = [0];\n\n #rangeValues = new Map<number, number>();\n\n #hasFocus = false;\n\n #validationError = '';\n\n #validationTimeout: NodeJS.Timeout;\n\n #lastChangeValue: number [] = [];\n\n get #rtl() {\n return this.localize.dir() === 'rtl';\n }\n\n constructor() {\n super();\n this.tooltipFormatter = this.localize.number.bind(this.localize);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this?.visibilityObserver?.disconnect();\n }\n\n firstUpdated() {\n // #727: Check if the ticks are visible and update the prefix and suffix position when they are.\n this.visibilityObserver = new IntersectionObserver((entries) => {\n const entry = entries.at(0);\n if (entry && entry.isIntersecting && entry.target.checkVisibility()) {\n this.#updatePrefixSuffixPosition(entry.boundingClientRect.height);\n }\n }, {\n // We bind the root to the parent element of the ticks to make sure we are only called\n // when the ticks are visible, not when the ticks are scrolled out of the viewport.\n root: this.ticks.parentElement,\n });\n this.visibilityObserver.observe(this.ticks);\n\n this.formControlController.updateValidity();\n // initialize the lastChangeValue with the initial value\n this.#lastChangeValue = Array.from(this.#value);\n /**\n * Silence the screen reader for the tooltip.\n * Otherwise it will read the new value on change multiple times instead of just one time.\n * The aria-hidden needs to be set where the aria-live attribute is set, to silence it.\n */\n this.thumbs.forEach((thumb) => {\n const tooltip = thumb.parentElement as SynTooltip;\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n tooltip.updateComplete.then(() => {\n const tooltipBody = tooltip.shadowRoot!.querySelector('.tooltip__body');\n tooltipBody?.setAttribute('aria-hidden', 'true');\n });\n });\n }\n\n protected override willUpdate(changedProperties: PropertyValues) {\n super.willUpdate(changedProperties);\n\n // When the proposed min is bigger than the max value,\n // we need to swap the values to make sure the min is always smaller than the max\n // @example <syn-range min=\"50\" max=\"10\"> becomes <syn-range min=\"10\" max=\"50\">\n if (this.min > this.max) {\n [this.min, this.max] = [this.max, this.min];\n }\n\n if (this.step > this.max - this.min) {\n this.step = this.max - this.min;\n }\n\n if (this.step <= 0) {\n this.step = 1;\n }\n\n const adjustedValue = this.#value\n .map(value => {\n if (value <= this.min) return this.min;\n if (value >= this.max) return this.max;\n const nextValue = this.min + this.step * Math.round((value - this.min) / this.step);\n if (nextValue > this.max) return this.max;\n return nextValue;\n });\n\n if (arraysDiffer(this.#value, adjustedValue)) {\n this.#value = adjustedValue;\n }\n }\n\n protected override updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n // eslint-disable-next-line no-restricted-syntax\n for (const thumb of this.thumbs) {\n const rangeId = +thumb.dataset.rangeId!;\n // eslint-disable-next-line no-continue\n if (!this.#rangeValues.has(rangeId)) continue;\n this.#moveThumb(thumb, this.#rangeValues.get(rangeId)!);\n }\n this.#updateActiveTrack();\n }\n\n override focus(options?: FocusOptions) {\n const firstThumb = this.thumbs.item(0);\n if (firstThumb) {\n firstThumb.focus(options);\n } else {\n super.focus(options);\n }\n }\n\n /**\n * Checks for validity but does not show a validation message.\n * Returns `true` when valid and `false` when invalid.\n */\n public checkValidity() {\n if (this.disabled) return true;\n const isValid = !this.#validationError;\n\n if (!isValid) {\n this.formControlController.emitInvalidEvent();\n }\n\n return isValid;\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n public reportValidity() {\n if (this.disabled) return true;\n\n const isValid = this.validity.valid;\n\n this.formControlController.setValidity(isValid);\n this.validationInput.hidden = true;\n clearTimeout(this.#validationTimeout);\n\n if (!isValid) {\n // Show the browser's constraint validation message\n this.validationInput.hidden = false;\n this.validationInput.reportValidity();\n this.#validationTimeout = setTimeout(() => {\n this.validationInput.hidden = true;\n }, 10000);\n }\n\n return isValid;\n }\n\n /** Sets a custom validation message. Pass an empty string to restore validity. */\n public setCustomValidity(message: string) {\n this.#validationError = message;\n this.validationInput.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n /** Gets the associated form, if one exists. */\n public getForm(): HTMLFormElement | null {\n return this.formControlController.getForm();\n }\n\n /** Gets the validity state object */\n public get validity(): ValidityState {\n if (this.#validationError) return customErrorValidityState;\n\n return validValidityState;\n }\n\n /** Gets the validation message */\n public get validationMessage() {\n return this.#validationError;\n }\n\n #onClickTrack(event: PointerEvent, focusThumb = true) {\n if (this.disabled) return;\n const { clientX } = event;\n\n const thumbs = Array.from(this.thumbs);\n const pos = getNormalizedValueFromClientX(this.baseDiv, clientX, this.#rtl);\n const unit = this.step / (this.max - this.min);\n const nextValue = this.min + this.step * Math.round(pos / unit);\n\n // Get the thumb that is placed closest to the click position\n const thumb = thumbs.reduce((prev, curr) => {\n const currValue = this.#rangeValues.get(+curr.dataset.rangeId!)!;\n const prevValue = this.#rangeValues.get(+prev.dataset.rangeId!)!;\n\n const currDiff = Math.abs(currValue - nextValue);\n const prevDiff = Math.abs(prevValue - nextValue);\n\n if (currDiff === prevDiff) {\n // If the difference is the same, we use the thumb which has the correct order.\n // left track click --> prev, right track click --> curr\n return currValue < nextValue ? curr : prev;\n }\n\n return currDiff < prevDiff ? curr : prev;\n });\n\n const rangeId = +thumb.dataset.rangeId!;\n\n if (!rangeId) return;\n\n this.#rangeValues.set(rangeId, nextValue);\n this.#moveThumb(thumb, nextValue);\n\n const prevValue = this.#value;\n this.#value = Array.from(this.#rangeValues.values());\n this.#updateActiveTrack();\n\n if (arraysDiffer(prevValue, this.#value)) {\n this.#lastChangeValue = Array.from(this.#value);\n this.emit('syn-input');\n this.emit('syn-change');\n }\n\n // #595: Redispatch the original event to start dragging the thumb\n // whenever the user clicked on the track.\n // The check for focusThumb makes sure this does not happen when clicking on the track items\n const newEvt = new PointerEvent('pointerdown', event);\n if (focusThumb) {\n if (thumb.dispatchEvent(newEvt)) {\n this.#updateTooltip(thumb);\n }\n }\n }\n\n /**\n * Special method for handling clicks on track items\n * When clicking track items, we do not want the thumb to have focus\n */\n #onClickTrackItem(event: PointerEvent) {\n this.#onClickTrack(event, false);\n }\n\n /**\n * Get the boundaries of a given thumb\n * @param thumb The thumb element that was moved\n * @param value The current value of a thumb\n * @returns An object containing information about the current boundaries\n */\n #movementBoundariesForThumb(thumb: HTMLDivElement, value: number) {\n // If we are in restrict mode, we should not move the thumb\n // if it is smaller than the previous thumb or larger than the next thumb\n const values = this.valueAsArray!;\n const thumbs = Array.from(this.thumbs);\n const thumbIndex = thumbs.indexOf(thumb);\n\n // Get the previous and next thumb and see what are our valid ranges\n const prevValue = values[thumbIndex - 1] || this.min;\n const nextValue = values[thumbIndex + 1] || this.max;\n\n const isRestricted = value < prevValue || value > nextValue;\n const finalValue = Math.max(prevValue, Math.min(nextValue, value));\n\n return {\n finalValue,\n isRestricted,\n nextValue,\n prevValue,\n };\n }\n\n async #onClickThumb(event: PointerEvent) {\n if (this.disabled) return;\n\n const thumb = event.target as HTMLDivElement;\n this.#updateTooltip(thumb);\n\n if (thumb.dataset.pointerId) {\n thumb.releasePointerCapture(+thumb.dataset.pointerId);\n }\n\n thumb.dataset.pointerId = event.pointerId.toString();\n thumb.setPointerCapture(event.pointerId);\n thumb.classList.add('grabbed');\n\n await (thumb.parentElement as SynTooltip).show();\n }\n\n #onDragThumb(event: PointerEvent) {\n if (this.disabled) return;\n\n const thumb = event.target as HTMLDivElement;\n const rangeId = +thumb.dataset.rangeId!;\n if (!this.#rangeValues.has(rangeId)) return;\n\n const pointerId = thumb.dataset.pointerId ? +thumb.dataset.pointerId : null;\n if (pointerId !== event.pointerId) return;\n\n const pos = getNormalizedValueFromClientX(this.baseDiv, event.clientX, this.#rtl);\n const unit = this.step / (this.max - this.min);\n let value = this.min + this.step * Math.round(pos / unit);\n\n const synMove = this.emit('syn-move', {\n cancelable: true,\n detail: {\n element: thumb,\n value,\n },\n });\n\n if (synMove.defaultPrevented) {\n return;\n }\n\n if (this.restrictMovement) {\n const movementData = this.#movementBoundariesForThumb(thumb, value);\n if (movementData.isRestricted) {\n value = movementData.finalValue;\n // Make sure the thumb has the highest z-index of all thumbs\n thumb.style.zIndex = (3 + this.thumbs.length).toFixed(0);\n } else {\n thumb.style.zIndex = '3';\n }\n }\n\n this.#rangeValues.set(rangeId, value);\n this.#moveThumb(thumb, value);\n\n const prevValue = this.#value;\n this.#value = Array.from(this.#rangeValues.values());\n this.#updateActiveTrack();\n\n if (arraysDiffer(prevValue, this.#value)) {\n this.emit('syn-input');\n }\n }\n\n async #onReleaseThumb(event: PointerEvent) {\n const thumb = event.target as HTMLDivElement;\n if (!thumb.dataset.pointerId || event.pointerId !== +thumb.dataset.pointerId) return;\n\n thumb.classList.remove('grabbed');\n thumb.releasePointerCapture(event.pointerId);\n delete thumb.dataset.pointerId;\n\n if (arraysDiffer(this.#lastChangeValue, this.#value)) {\n this.#lastChangeValue = Array.from(this.#value);\n this.emit('syn-change');\n }\n\n await (thumb.parentElement as SynTooltip).hide();\n }\n\n #moveThumb(thumb: HTMLDivElement, value: number) {\n thumb.setAttribute('aria-valuenow', value.toString());\n thumb.setAttribute('aria-valuetext', this.tooltipFormatter(value));\n const pos = (value - this.min) / (this.max - this.min);\n // eslint-disable-next-line no-param-reassign\n thumb.style.insetInlineStart = `calc( ${100 * pos}% - var(--full-thumb-size) / 2 )`;\n this.#updateTooltip(thumb);\n }\n\n #updateActiveTrack() {\n const { activeTrack } = this;\n if (!activeTrack) return;\n\n // Special case: User set min and max to the same values.\n // To not show the active track in this case.\n if (this.min === this.max) {\n activeTrack.style.insetInlineStart = '0%';\n activeTrack.style.insetInlineEnd = '0%';\n return;\n }\n\n // If there is only one thumb, the active track should start at the beginning\n // and end at the thumb\n if (this.#value.length === 1) {\n const start = getComputedStyle(this).getPropertyValue('--track-active-offset') || '0%';\n const end = (100 * (this.#value[0] - this.min)) / (this.max - this.min);\n\n activeTrack.style.insetInlineStart = `min(${start}, ${end}%)`;\n activeTrack.style.insetInlineEnd = `min(calc(100% - ${start}), calc(100% - ${end}%))`;\n\n return;\n }\n\n // The render order of the thumbs is not guaranteed to be the same as the value order.\n const sortedValues = this.#value.slice().sort(numericSort);\n\n // Multi thumb: Place the active track between the first and last thumb\n const start = (100 * (sortedValues[0] - this.min)) / (this.max - this.min);\n const end = (100 * (sortedValues[sortedValues.length - 1] - this.min)) / (this.max - this.min);\n\n activeTrack.style.insetInlineStart = `${start}%`;\n activeTrack.style.insetInlineEnd = `calc(100% - ${end}%)`;\n }\n\n #onKeyPress(event: KeyboardEvent) {\n const thumb = event.target as HTMLDivElement;\n const rangeId = +thumb.dataset.rangeId!;\n\n const currentValue = this.#rangeValues.get(rangeId);\n if (currentValue === undefined) return;\n\n let value = currentValue;\n\n switch (event.key) {\n case 'ArrowUp':\n case 'Up':\n value = Math.min(currentValue + this.step, this.max);\n break;\n case 'ArrowDown':\n case 'Down':\n value = Math.max(currentValue - this.step, this.min);\n break;\n case 'ArrowLeft':\n case 'Left':\n value = this.#rtl\n ? Math.min(currentValue + this.step, this.max)\n : Math.max(currentValue - this.step, this.min);\n break;\n case 'ArrowRight':\n case 'Right':\n value = this.#rtl\n ? Math.max(currentValue - this.step, this.min)\n : Math.min(currentValue + this.step, this.max);\n break;\n case 'PageUp':\n value = Math.min(\n currentValue + ((this.max - this.min) / 5),\n this.max,\n );\n break;\n case 'PageDown':\n value = Math.max(\n (currentValue - (this.max - this.min) / 5),\n this.min,\n );\n break;\n case 'Home':\n value = this.min;\n break;\n case 'End':\n value = this.max;\n break;\n default:\n return;\n }\n\n if (value !== currentValue) {\n // Make sure the user is able to intercept movement\n const synMove = this.emit('syn-move', {\n cancelable: true,\n detail: {\n element: thumb,\n value,\n },\n });\n\n if (synMove.defaultPrevented) {\n return;\n }\n\n if (this.restrictMovement) {\n const movementData = this.#movementBoundariesForThumb(thumb, value);\n if (movementData.isRestricted) {\n value = movementData.finalValue;\n }\n }\n\n this.#moveThumb(thumb, value);\n\n this.#rangeValues.set(rangeId, value);\n this.#value = Array.from(this.#rangeValues.values());\n\n this.#updateActiveTrack();\n this.#updateTooltip(thumb);\n\n this.#lastChangeValue = Array.from(this.#value);\n this.emit('syn-input');\n this.emit('syn-change');\n }\n\n event.stopPropagation();\n event.preventDefault();\n }\n\n #onBlur(event: FocusEvent) {\n if (event.relatedTarget && this.shadowRoot?.contains(event.relatedTarget as Node)) return;\n this.emit('syn-blur');\n this.#hasFocus = false;\n }\n\n #updateTooltip(thumb: HTMLDivElement) {\n if (this.tooltipPlacement === 'none') return;\n const rangeId = +thumb.dataset.rangeId!;\n if (!this.#rangeValues.has(rangeId)) return;\n const value = this.#rangeValues.get(rangeId)!;\n const tooltip = thumb.parentElement as SynTooltip;\n tooltip.content = this.tooltipFormatter(value);\n }\n\n #onFocusThumb(event: FocusEvent) {\n if (this.disabled) return;\n if (!this.#hasFocus) {\n this.#hasFocus = true;\n this.emit('syn-focus');\n }\n const thumb = event.target as HTMLDivElement;\n if (!thumb?.dataset?.rangeId) return;\n this.#updateTooltip(thumb);\n }\n\n #handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n #updatePrefixSuffixPosition(height?: number) {\n const hasTicksSlot = this.hasSlotController.test('ticks');\n const hasPrefixSlot = this.hasSlotController.test('prefix');\n const hasSuffixSlot = this.hasSlotController.test('suffix');\n\n if (!hasTicksSlot) {\n return;\n }\n\n let ticksHeight = height || this.shadowRoot?.querySelector('.ticks')?.clientHeight;\n if (ticksHeight) {\n // Add two pixels as the 1px margin on top and bottom are not included in the clientHeight\n ticksHeight += 2;\n\n ticksHeight /= 2;\n\n if (hasPrefixSlot) {\n const prefix = this.shadowRoot?.querySelector('.input__prefix') as HTMLElement;\n prefix.style.transform = `translateY(-${ticksHeight}px)`;\n }\n\n if (hasSuffixSlot) {\n const suffix = this.shadowRoot?.querySelector('.input__suffix') as HTMLElement;\n suffix.style.transform = `translateY(-${ticksHeight}px)`;\n }\n }\n }\n\n /* eslint-disable @typescript-eslint/unbound-method */\n private renderThumbs(hasLabel: boolean) {\n // Aria special handling:\n // 1. When there is only one label: Use the provided label as the aria-label for the thumb\n // 2. When we have multiple label: Set the label for the first and last item to itself\n const isMultiple = this.#value.length > 1;\n\n this.#rangeValues.clear();\n return this.#value.map((value, index) => {\n const rangeId = index + 1;\n this.#rangeValues.set(rangeId, value);\n\n const id = `thumb-${rangeId}`;\n\n let ariaLabel = '';\n let ariaLabeledBy = '';\n\n if (!isMultiple) {\n ariaLabeledBy = hasLabel ? 'label aria-label-hidden' : '';\n } else {\n ariaLabeledBy = hasLabel ? `label aria-label-hidden ${id}` : `aria-label-hidden ${id}`;\n\n if (index === 0) {\n ariaLabel = `${this.localize.term('rangeMin')} (${this.tooltipFormatter(value)})`;\n } else if (index === this.#value.length - 1) {\n ariaLabel = `${this.localize.term('rangeMax')} (${this.tooltipFormatter(value)})`;\n } else {\n ariaLabel = this.tooltipFormatter(value);\n }\n }\n\n return html`\n <syn-tooltip\n exportparts=\"base:tooltip__base, base__arrow:tooltip__arrow, base__popup:tooltip__popup, body:tooltip__body\"\n hoist\n .disabled=${this.tooltipPlacement === 'none' || this.disabled}\n .placement=${this.tooltipPlacement as 'top' | 'bottom'}\n trigger=\"focus\"\n >\n <div\n aria-disabled=${ifDefined(this.disabled ? 'true' : undefined)}\n aria-labelledby=${ariaLabeledBy}\n aria-label=${ariaLabel}\n aria-valuemax=\"${this.max}\"\n aria-valuemin=\"${this.min}\"\n aria-valuenow=\"${value}\"\n aria-valuetext=\"${this.tooltipFormatter(value)}\"\n class=\"thumb\"\n data-range-id=\"${rangeId}\"\n id=${id}\n part=\"thumb\"\n role=\"slider\"\n tabindex=\"${this.disabled ? -1 : 0}\"\n @pointerdown=${this.#onClickThumb}\n @pointermove=${this.#onDragThumb}\n @pointerup=${this.#onReleaseThumb}\n @pointercancel=${this.#onReleaseThumb}\n @pointerleave=${this.#onReleaseThumb}\n @keydown=${this.#onKeyPress}\n @focus=${this.#onFocusThumb}\n ></div>\n </syn-tooltip>\n `;\n });\n }\n /* eslint-enable @typescript-eslint/unbound-method */\n\n /* eslint-disable @typescript-eslint/unbound-method */\n override render() {\n const hasLabelSlot = this.hasSlotController.test('label');\n const hasHelpTextSlot = this.hasSlotController.test('help-text');\n const hasPrefixSlot = this.hasSlotController.test('prefix');\n const hasSuffixSlot = this.hasSlotController.test('suffix');\n const hasLabel = this.label ? true : !!hasLabelSlot;\n const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n\n return html`\n <div\n part=\"form-control\"\n class=${classMap({\n 'form-control': true,\n 'form-control--has-help-text': hasHelpText,\n 'form-control--has-label': hasLabel,\n 'form-control--has-prefix': hasPrefixSlot,\n 'form-control--has-suffix': hasSuffixSlot,\n 'form-control--is-disabled': this.disabled,\n 'form-control--large': this.size === 'large',\n 'form-control--medium': this.size === 'medium',\n 'form-control--small': this.size === 'small',\n })}\n @focusout=${this.#onBlur}\n >\n <label\n id=\"label\"\n part=\"form-control-label\"\n class=\"form-control__label\"\n aria-hidden=${hasLabel ? 'false' : 'true'}\n @click=${this.focus}\n >\n <slot name=\"label\">${this.label}</slot>\n </label>\n\n <label id=\"aria-label-hidden\" class=\"visually-hidden\">\n (${this.#value.map(this.tooltipFormatter).join(' - ')})\n </label>\n\n <div class=\"base input__control\" part=\"base\">\n <span part=\"prefix\" class=\"input__prefix\">\n <slot name=\"prefix\"></slot>\n </span>\n\n <div class=\"input__wrapper\" part=\"input-wrapper\">\n <input\n class=\"range__validation-input visually-hidden\"\n tabindex=\"-1\"\n hidden\n @invalid=${this.#handleInvalid}\n />\n\n <div\n class=\"track__wrapper\"\n @pointerdown=${this.#onClickTrack}\n part=\"track-wrapper\"\n role=\"presentation\"\n >\n <div class=\"track__click-helper\"></div>\n <div class=\"track\" part=\"track\"></div>\n <div class=\"active-track\" part=\"active-track\"></div>\n </div>\n\n ${this.renderThumbs(hasLabel)}\n\n <div\n class=\"ticks\"\n part=\"ticks\"\n @pointerdown=${this.#onClickTrackItem}\n role=\"presentation\"\n >\n <slot name=\"ticks\"></slot>\n </div>\n </div>\n\n <span part=\"suffix\" class=\"input__suffix\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n\n <div\n part=\"form-control-help-text\"\n class=\"form-control__help-text\"\n aria-hidden=${hasHelpText ? 'false' : 'true'}\n >\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n </div>\n `;\n }\n /* eslint-enable @typescript-eslint/unbound-method */\n}\n"],
5
- "mappings": "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",
6
- "names": ["prevValue", "start", "end"]
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/validate/validate.component.ts"],
4
- "sourcesContent": ["import type { CSSResultGroup, PropertyValues } from 'lit';\nimport { html } from 'lit';\nimport { property, queryAssignedElements, state } from 'lit/decorators.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport { watch } from '../../internal/watch.js';\nimport SynAlert from '../alert/alert.component.js';\nimport {\n getEventNameForElement,\n isBlurEvent,\n isInvalidEvent,\n normalizeEventAttribute,\n} from './utility.js';\nimport styles from './validate.styles.js';\n\n/**\n * @summary Validate provides form field validation messages in a unified way.\n * It does this by using [the native browser validation](https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation)\n * and showing the validation message in a consistent, user defined way.\n *\n * @dependency syn-alert\n *\n * @slot - The form field that should be validated.\n * Avoid slotting in more than one element, as subsequent ones will be ignored.\n *\n * @csspart base - The component's base wrapper.\n * @csspart input-wrapper - The container that wraps the form field.\n * @csspart alert - The syn-alert that is shown when the variant is set to \"inline\".\n * @csspart alert__base - The container that wraps the alert.\n * @csspart alert__message - The container that wraps the alert message.\n * @csspart alert__icon - The container that wraps the alert icon.\n */\nexport default class SynValidate extends SynergyElement {\n static styles: CSSResultGroup = [componentStyles, styles];\n\n static dependencies = {\n 'syn-alert': SynAlert,\n };\n\n controller = new AbortController();\n\n observer: MutationObserver;\n\n @queryAssignedElements() private slottedChildren: HTMLElement[];\n\n @state() validationMessage = '';\n\n @state() eagerFirstMount = true;\n\n @state() isInternalTriggeredInvalid = false;\n\n @state() isValid = true;\n\n /**\n * The variant that should be used to show validation alerts.\n *\n * The following variants are supported:\n * - **native** (default): Uses the native browser validation, usually a browser tooltip.\n * - **inline**: Show the validation message underneath the element, using a `<syn-alert>`\n */\n @property({ reflect: true }) variant: 'native' | 'inline' = 'native';\n\n /** Do not show the error icon when using the inline variant validation */\n @property({ attribute: 'hide-icon', reflect: true, type: Boolean }) hideIcon = false;\n\n /**\n * Defines the events that trigger the validation.\n * `invalid` will always automatically be included.\n * You may also use the `live` keyword to validate on every input change.\n * `live` will make sure to listen to the `invalid`, `input` and `blur` events.\n *\n * Please have a look at the [documentation for native form validation](https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation)\n * and [the use of form invalid events](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event) for further information.\n *\n * @example ```html\n * <!-- Validate on invalid and change events (invalid, change) -->\n * <syn-validate on=\"invalid change\"></syn-validate>\n *\n * <!-- Validate on live events (invalid, blur, input)-->\n * <syn-validate on=\"live\"></syn-validate>\n *\n * <!-- Validate on live and custom events (invalid, blur, input, focus, change) -->\n * <syn-validate on=\"live focus change\"></syn-validate>\n * ```\n */\n @property({ reflect: true }) on: string = '';\n\n /**\n * Custom validation message to be displayed when the input is invalid.\n * Will override the default browser validation message.\n * Set to an empty string to reset the validation message.\n */\n @property({ attribute: 'custom-validation-message', type: String }) customValidationMessage = '';\n\n /**\n * Set this to true to validate the input immediately when it is rendered.\n * Best used with a `variant` of `inline`.\n * When setting eager, the input will not be focused automatically.\n *\n * When using a `variant` of `native` the browser will focus\n * the last eager field as it is using a tooltip.\n * In this case it is better to just provide one eager field.\n */\n @property({ type: Boolean }) eager = false;\n\n // Automatically refresh all event listeners when the on property changes.\n @watch('on', { waitUntilFirstUpdate: true })\n handleListenerChange() {\n this.updateEvents();\n }\n\n @watch('eager', { waitUntilFirstUpdate: false })\n async handleEagerChange() {\n if (this.eager) {\n const input = this.getInput();\n await this.updateComplete;\n input?.reportValidity();\n this.eagerFirstMount = true;\n } else {\n this.eagerFirstMount = false;\n }\n }\n\n // Synchronize the validation message on the wrapped input with the custom message\n @watch('customValidationMessage', { waitUntilFirstUpdate: true })\n handleCustomValidationMessageChange() {\n const input = this.getInput();\n if (input) {\n this.setCustomValidationMessage(input);\n this.setValidationMessage(input);\n }\n }\n\n /**\n * Returns the validity state of the input component.\n * `true` for valid and `false` for invalid.\n */\n getValidity() {\n return this.isValid;\n }\n\n /**\n * Get the input element to validate. Defined as the first slotted element\n * @returns The input element or undefined if not found\n */\n private getInput() {\n const input = this.slottedChildren[0];\n return input ? input as HTMLInputElement : undefined;\n }\n\n /**\n * Get the event names to listen for.\n * If the input is a synergy element, will use syn- prefixes.\n * @returns The event names to listen for\n */\n // eslint-disable-next-line complexity\n private getUsedEventNames() {\n const input = this.getInput();\n\n // If there is no input, skip before doing any harm\n if (!input) {\n return [];\n }\n\n // Make sure to always use an array of events\n // This is needed because on may be a special value like \"live\"\n const on = normalizeEventAttribute(this.on);\n\n // Filter makes sure to remove empty values, e.g.\n // <syn-validate on=\"\"></syn-validate>\n const [...events] = on.filter(Boolean);\n\n // Make sure to always have an invalid event\n if (!events.includes('invalid')) {\n events.push('invalid');\n }\n\n // Special handling for the live keyword:\n // live always means on input and blur\n if (events.includes('live')) {\n events.push('input');\n events.push('blur');\n }\n\n // Make sure to remove duplicated events and the live property\n // and map the events to the correct event names\n return Array.from(new Set(\n events\n .filter(e => e !== 'live')\n .map(e => getEventNameForElement(input, e)),\n ));\n }\n\n /**\n * Update the events on the input element.\n */\n private updateEvents() {\n this.controller.abort();\n this.controller = new AbortController();\n const input = this.getInput();\n\n if (!input) {\n return;\n }\n\n const events = this.getUsedEventNames();\n events.forEach(eventName => {\n input.addEventListener(eventName, this.validate, {\n capture: isInvalidEvent(eventName),\n signal: this.controller.signal,\n });\n });\n\n // If the change event is not included,\n // make sure to attach a custom listener that resets the validation message\n // This is needed as the custom message may be set on change\n const usedChangeEvent = getEventNameForElement(input, 'change');\n if (!events.includes(usedChangeEvent)) {\n input.addEventListener(usedChangeEvent, this.internalRevalidate, {\n signal: this.controller.signal,\n });\n }\n }\n\n private setValidationMessage(input: HTMLInputElement) {\n const { customValidationMessage } = this;\n const validationMessage = customValidationMessage || input.validationMessage;\n this.validationMessage = validationMessage;\n }\n\n /**\n * Set the custom validation message to the input. This will make sure to either:\n * - use the custom message if one is set or\n * - use the default message if the custom message is empty\n */\n private setCustomValidationMessage(input: HTMLInputElement) {\n // Set the custom validation message on the input only once, when the customValidationMessage\n // is changed. Otherwise there could be problems with `variant=\"native\"` and `on=\"live\"` or\n // `on=\"blur\"`, because the browser popup will never disappear even if clicking somewhere else.\n input.setCustomValidity(this.customValidationMessage);\n }\n\n /**\n * Set the validation message from the input element\n * @param e The event that was received\n */\n private internalRevalidate = (e: Event) => {\n const input = e.currentTarget as HTMLInputElement;\n if (input.validity?.valid) {\n this.validationMessage = '';\n }\n };\n\n /**\n * Handle the blur event during validation\n */\n // eslint-disable-next-line class-methods-use-this\n private handleFocus(input: HTMLInputElement) {\n const activeElement = document.activeElement! as HTMLInputElement;\n const activeElementIsWrapped = activeElement.closest('syn-validate');\n\n if (!activeElement.validity?.valid && activeElementIsWrapped) {\n // The active element is invalid do not scroll\n return;\n }\n\n input.scrollIntoView({ block: 'nearest' });\n input.focus();\n }\n\n /**\n * Triggers a validation run, showing the validation message if needed.\n */\n // eslint-disable-next-line complexity\n private validate = (e: Event) => {\n // Make sure to stop the validate component from going into an endless cycle of triggering\n if (isInvalidEvent(e.type) && this.variant === 'native' && this.isInternalTriggeredInvalid === true) {\n this.isInternalTriggeredInvalid = false;\n return;\n }\n\n // Make sure to always prevent the invalid event when not using native validation\n if (isInvalidEvent(e.type) && this.variant !== 'native') {\n e.preventDefault();\n e.stopPropagation();\n }\n\n const input = e.currentTarget as HTMLInputElement;\n this.isValid = input.validity?.valid;\n\n // When we are using eager, make sure to skip focus on the first mount\n if (this.eager && this.eagerFirstMount) {\n this.eagerFirstMount = false;\n this.setValidationMessage(input);\n return;\n }\n\n // If the active element that has focus is placed in a validate component,\n // make sure to not loose focus.\n if (!this.isValid && !isBlurEvent(e.type)) {\n this.handleFocus(input);\n }\n\n this.setValidationMessage(input);\n\n // Trigger reportValidity when using native validation, so the browser popup is also shown\n // for other events than `invalid`. All events except the blur event, should trigger this.\n if (!isBlurEvent(e.type) && this.variant === 'native') {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.updateComplete.then(() => {\n this.isInternalTriggeredInvalid = true;\n input.reportValidity();\n });\n }\n };\n\n async firstUpdated(changedProperties: PropertyValues) {\n super.firstUpdated(changedProperties);\n this.updateEvents();\n\n // #713: Make sure to set the custom validation message on mount\n // When we have a custom element, we need to wait for it to be ready!\n const input = this.getInput();\n\n if (this.customValidationMessage) {\n if (input instanceof SynergyElement) {\n await input.updateComplete;\n }\n input?.setCustomValidity(this.customValidationMessage);\n }\n\n // Make sure to run validation on mount if eager is set\n if (this.eager) {\n await this.updateComplete;\n this.isValid = input?.validity?.valid ?? false;\n input?.reportValidity();\n }\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n // #717: Make sure to remove to rerun validation when\n // disabled or readonly properties change on the input\n this.observer = new MutationObserver(entries => {\n const input = this.getInput();\n\n if (!input) {\n return;\n }\n\n const hasDisabledOrReadonly = entries\n // Only check for changes on the input element\n .filter(({ target }) => target === input)\n // Check if the input is disabled or readonly\n .every(entry => {\n const target = entry.target as HTMLInputElement;\n return target.hasAttribute('disabled') || target.hasAttribute('readonly');\n });\n\n if (hasDisabledOrReadonly) {\n this.isValid = true;\n this.validationMessage = '';\n } else {\n // When using a synergy element, we need to check the validity after the element is updated,\n // as we cannot rely on the validity state of the element itself.\n // Unfortunately, this depends on used browser :(.\n const waitForPromise = input instanceof SynergyElement\n ? input.updateComplete\n : Promise.resolve();\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n waitForPromise.then(() => {\n this.isValid = input?.validity?.valid ?? false;\n this.validationMessage = input?.validationMessage ?? '';\n });\n }\n });\n\n this.observer.observe(this, {\n attributeFilter: ['disabled', 'readonly'],\n attributes: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.controller.abort();\n this?.observer?.disconnect();\n }\n\n private renderInlineValidation() {\n if (this.variant !== 'inline' || !this.validationMessage) {\n return '';\n }\n\n return html`\n <syn-alert\n open\n exportparts=\"base:alert__base,message:alert__message,icon:alert__icon\"\n part=\"alert\"\n variant=\"danger\"\n >\n ${!this.hideIcon\n ? html`<syn-icon slot=\"icon\" name=\"error\" library=\"system\"></syn-icon>`\n : ''\n }\n ${this.validationMessage}\n </syn-alert>\n `;\n }\n\n render() {\n return html`\n <div\n class=\"validate\"\n part=\"base\"\n >\n <slot\n class=\"validate__input-wrapper\"\n part=\"input-wrapper\"\n ></slot>\n \n ${this.renderInlineValidation()}\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/button/button.component.ts"],
4
- "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { FormControlController, validValidityState } from '../../internal/form.js';\nimport { HasSlotController, getTextContent } from '../../internal/slot.js';\nimport { html, literal } from 'lit/static-html.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynSpinner from '../spinner/spinner.component.js';\nimport styles from './button.styles.js';\nimport customStyles from './button.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Buttons represent actions that are available to the user.\n * @documentation https://synergy.style/components/button\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-spinner\n *\n * @event syn-blur - Emitted when the button loses focus.\n * @event syn-focus - Emitted when the button gains focus.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @slot - The 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 * @csspart base - The component's base wrapper.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The button's label.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart caret - The button's caret icon, an `<syn-icon>` element.\n * @csspart spinner - The spinner that shows when the button is in the loading state.\n */\nexport default class SynButton extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n static dependencies = {\n 'syn-icon': SynIcon,\n 'syn-spinner': SynSpinner\n };\n\n private readonly formControlController = new FormControlController(this, {\n assumeInteractionOn: ['click']\n });\n\n private readonly hasSlotController = new HasSlotController(this, '[default]', 'prefix', 'suffix');\n private readonly localize = new LocalizeController(this);\n\n @query('.button') button: HTMLButtonElement | HTMLLinkElement;\n @query('slot:not([name])') defaultSlot: HTMLSlotElement;\n\n @state() private iconOnly = false;\n\n @state() private hasFocus = false;\n @state() invalid = false;\n @property() title = ''; // make reactive to pass through\n\n /** The button's theme variant. */\n @property({ reflect: true }) variant: 'filled' | 'outline' | 'text' = 'outline';\n\n /** The button's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior. */\n @property({ type: Boolean, reflect: true }) caret = false;\n\n /** Disables the button. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Draws the button in a loading state. */\n @property({ type: Boolean, reflect: true }) loading = false;\n\n /**\n * The type of button. Note that the default value is `button` instead of `submit`, which is opposite of how native\n * `<button>` elements behave. When the type is `submit`, the button will submit the surrounding form.\n */\n @property() type: 'button' | 'submit' | 'reset' = 'button';\n\n /**\n * The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.\n * This attribute is ignored when `href` is present.\n */\n @property() name = '';\n\n /**\n * The value of the button, submitted as a pair with the button's name as part of the form data, but only when this\n * button is the submitter. This attribute is ignored when `href` is present.\n */\n @property() value = '';\n\n /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n @property() href = '';\n\n /** Tells the browser where to open the link. Only used when `href` is present. */\n @property() target: '_blank' | '_parent' | '_self' | '_top';\n\n /**\n * When using `href`, this attribute will map to the underlying link's `rel` attribute. Unlike regular links, the\n * default is `noreferrer noopener` to prevent security exploits. However, if you're using `target` to point to a\n * specific tab/window, this will prevent that from working correctly. You can remove or change the default value by\n * setting the attribute to an empty string or a value of your choice, respectively.\n */\n @property() rel = 'noreferrer noopener';\n\n /** Tells the browser to download the linked file as this filename. Only used when `href` is present. */\n @property() download?: string;\n\n /**\n * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n * value of this attribute must be an id of a form in the same document or shadow root as the button.\n */\n @property() form: string;\n\n /** Used to override the form owner's `action` attribute. */\n @property({ attribute: 'formaction' }) formAction: string;\n\n /** Used to override the form owner's `enctype` attribute. */\n @property({ attribute: 'formenctype' })\n formEnctype: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';\n\n /** Used to override the form owner's `method` attribute. */\n @property({ attribute: 'formmethod' }) formMethod: 'post' | 'get';\n\n /** Used to override the form owner's `novalidate` attribute. */\n @property({ attribute: 'formnovalidate', type: Boolean }) formNoValidate: boolean;\n\n /** Used to override the form owner's `target` attribute. */\n @property({ attribute: 'formtarget' }) formTarget: '_self' | '_blank' | '_parent' | '_top' | string;\n\n /** Gets the validity state object */\n get validity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validity;\n }\n\n return validValidityState;\n }\n\n /** Gets the validation message */\n get validationMessage() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validationMessage;\n }\n\n return '';\n }\n\n firstUpdated() {\n if (this.isButton()) {\n this.formControlController.updateValidity();\n }\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n private handleClick() {\n if (this.type === 'submit') {\n this.formControlController.submit(this);\n }\n\n if (this.type === 'reset') {\n this.formControlController.reset(this);\n }\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private isButton() {\n return this.href ? false : true;\n }\n\n private isLink() {\n return this.href ? true : false;\n }\n\n private handleSlotChange() {\n const textContent = getTextContent(this.defaultSlot).trim();\n const assignedElements = this.defaultSlot.assignedElements({flatten: true})\n const iconOnlyElement = assignedElements.length === 1 && assignedElements[0].tagName.toLowerCase() === 'syn-icon';\n\n this.iconOnly = iconOnlyElement && textContent === '';\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n if (this.isButton()) {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n }\n }\n\n /** Simulates a click on the button. */\n click() {\n this.button.click();\n }\n\n /** Sets focus on the button. */\n focus(options?: FocusOptions) {\n this.button.focus(options);\n }\n\n /** Removes focus from the button. */\n blur() {\n this.button.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 if (this.isButton()) {\n return (this.button as HTMLButtonElement).checkValidity();\n }\n\n return true;\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 if (this.isButton()) {\n return (this.button as HTMLButtonElement).reportValidity();\n }\n\n return true;\n }\n\n /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n if (this.isButton()) {\n (this.button as HTMLButtonElement).setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n }\n\n render() {\n const isLink = this.isLink();\n const tag = isLink ? literal`a` : literal`button`;\n\n /* eslint-disable lit/no-invalid-html */\n /* eslint-disable lit/binding-positions */\n return html`\n <${tag}\n part=\"base\"\n class=${classMap({\n button: true,\n 'button--primary': true,\n 'button--text': this.variant === 'text',\n 'button--small': this.size === 'small',\n 'button--medium': this.size === 'medium',\n 'button--large': this.size === 'large',\n 'button--caret': this.caret,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--loading': this.loading,\n 'button--filled': this.variant === 'filled',\n 'button--outline': this.variant === 'outline',\n 'button--rtl': this.localize.dir() === 'rtl',\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 ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n type=${ifDefined(isLink ? undefined : this.type)}\n title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n name=${ifDefined(isLink ? undefined : this.name)}\n value=${ifDefined(isLink ? undefined : this.value)}\n href=${ifDefined(isLink && !this.disabled ? this.href : undefined)}\n target=${ifDefined(isLink ? this.target : undefined)}\n download=${ifDefined(isLink ? this.download : undefined)}\n rel=${ifDefined(isLink ? this.rel : undefined)}\n role=${ifDefined(isLink ? undefined : 'button')}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @invalid=${this.isButton() ? this.handleInvalid : null}\n @click=${this.handleClick}\n >\n <slot name=\"prefix\" part=\"prefix\" class=\"button__prefix\"></slot>\n <slot part=\"label\" class=${classMap({ 'button__label': true, 'button__icon-only': this.iconOnly })} @slotchange=${this.handleSlotChange}></slot>\n <slot name=\"suffix\" part=\"suffix\" class=\"button__suffix\"></slot>\n ${\n this.caret ? html` <syn-icon part=\"caret\" class=\"button__caret\" library=\"system\" name=\"caret\"></syn-icon> ` : ''\n }\n ${this.loading ? html`<syn-spinner part=\"spinner\"></syn-spinner>` : ''}\n </${tag}>\n `;\n /* eslint-enable lit/no-invalid-html */\n /* eslint-enable lit/binding-positions */\n }\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/combobox/combobox.component.ts"],
4
- "sourcesContent": ["import type { CSSResultGroup } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { animateTo, stopAnimations } from '../../internal/animate.js';\nimport { defaultValue } from '../../internal/default-value.js';\nimport { FormControlController } from '../../internal/form.js';\nimport { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { waitForEvent } from '../../internal/event.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynPopup from '../popup/popup.component.js';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\nimport SynOption from '../option/option.component.js';\nimport type SynOptGroup from '../optgroup/optgroup.js';\nimport styles from './combobox.styles.js';\nimport customStyles from './combobox.custom.styles.js';\nimport {\n createOptionFromDifferentTypes,\n filterOnlyOptgroups, getAllOptions, getAssignedElementsForSlot, normalizeString,\n} from './utils.js';\nimport { scrollIntoView } from '../../internal/scroll.js';\nimport { type OptionRenderer, defaultOptionRenderer } from './option-renderer.js';\n\n/**\n * @summary Comboboxes allow you to choose items from a menu of predefined options.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-combobox--docs\n * @status stable\n *\n * @dependency syn-icon\n * @dependency syn-popup\n *\n * @slot - The listbox options. Must be `<syn-option>` elements.\n * You can use `<syn-optgroup>`'s to group items visually.\n * @slot label - The combobox's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed.\n * Rotates on open and close.\n * @slot help-text - Text that describes how to use the combobox.\n * Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the combobox's menu opens.\n * @event syn-after-show - Emitted after the combobox's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the combobox's menu closes.\n * @event syn-after-hide - Emitted after the combobox's menu closes and all animations are complete.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n * and its constraints aren't satisfied.\n * @event syn-error - Emitted when the combobox menu fails to open.\n *\n * @csspart form-control - The form control that wraps the label, combobox, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The combobox's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label,\n * an `<input>` element.\n * @csspart listbox - The listbox container where the options are slotted\n * and the filtered options list exists.\n * @csspart filtered-listbox - The container that wraps the filtered options.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n *\n * @animation combobox.show - The animation to use when showing the combobox.\n * @animation combobox.hide - The animation to use when hiding the combobox.\n */\nexport default class SynCombobox extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [\n componentStyles,\n formControlStyles,\n styles,\n formControlCustomStyles,\n customStyles,\n ];\n\n static dependencies = {\n 'syn-icon': SynIcon,\n 'syn-popup': SynPopup,\n };\n\n private readonly formControlController = new FormControlController(this, {\n assumeInteractionOn: ['syn-blur', 'syn-input'],\n });\n\n private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label');\n\n private readonly localize = new LocalizeController(this);\n\n private closeWatcher: CloseWatcher | null;\n\n /** The last value of a syn-option, that was selected by click or via keyboard navigation */\n private lastOptionValue = '';\n\n private isOptionRendererTriggered = false;\n\n @query('.combobox') popup: SynPopup;\n\n @query('.combobox__inputs') combobox: HTMLSlotElement;\n\n @query('.combobox__display-input') displayInput: HTMLInputElement;\n\n @query('.combobox__value-input') valueInput: HTMLInputElement;\n\n @query('.combobox__listbox') listbox: HTMLSlotElement;\n\n @query('slot:not([name])') private defaultSlot: HTMLSlotElement;\n\n @state() private hasFocus = false;\n\n @state() displayLabel = '';\n\n @state() selectedOption: SynOption | undefined;\n\n @state() numberFilteredOptions = 0;\n\n @state() cachedOptions: SynOption [] = [];\n\n /** The name of the combobox, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /**\n * The current value of the combobox, submitted as a name/value pair with form data.\n */\n @property() value = '';\n\n /** The default value of the form control. Primarily used for resetting the form control. */\n @defaultValue() defaultValue = '';\n\n /** The combobox's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Placeholder text to show as a hint when the combobox is empty. */\n @property() placeholder = '';\n\n /** Disables the combobox control. */\n @property({ reflect: true, type: Boolean }) disabled = false;\n\n /** Adds a clear button when the combobox is not empty. */\n @property({ type: Boolean }) clearable = false;\n\n /**\n * Indicates whether or not the combobox is open.\n * You can toggle this attribute to show and hide the listbox, or you can use the `show()`\n * and `hide()` methods and this attribute will reflect the combobox's open state.\n */\n @property({ reflect: true, type: Boolean }) open = false;\n\n /**\n * Enable this option to prevent the listbox from being clipped,\n * when the component is placed inside a container with `overflow: auto|scroll`.\n * Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.\n */\n @property({ type: Boolean }) hoist = false;\n\n /** The combobox's label. If you need to display HTML, use the `label` slot instead. */\n @property() label = '';\n\n /**\n * The preferred placement of the combobox's menu.\n * Note that the actual placement may vary as needed to keep the listbox inside of the viewport.\n */\n @property({ reflect: true }) placement: 'top' | 'bottom' = 'bottom';\n\n /** The combobox's help text. If you need to display HTML, use the `help-text` slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\n\n /**\n * By default, form controls are associated with the nearest containing `<form>` element.\n * This attribute allows you to place the form control outside of a form and associate it\n * with the form that has this `id`.\n * The form must be in the same document or shadow root for this to work.\n */\n @property({ reflect: true }) form = '';\n\n /** The combobox's required attribute. */\n @property({ reflect: true, type: Boolean }) required = false;\n\n /**\n * A function that customizes the rendered option. The first argument is the option, the second\n * is the query string, which is typed into the combobox.\n * The function should return either a Lit TemplateResult or a string containing trusted HTML\n * to render in the shown list of filtered options.\n * If the query string should be highlighted use the `highlightOptionRenderer` function.\n */\n @property() getOption: OptionRenderer = defaultOptionRenderer;\n\n /**\n * A function used to filter options in the combobox component.\n * The default filter method is a case- and diacritic-insensitive string comparison.\n *\n * @param option - The option to be filtered.\n * @param queryString - The query string used for filtering.\n * @returns A boolean indicating whether the option should be included in the filtered results.\n */\n // eslint-disable-next-line class-methods-use-this\n @property() filter: (option: SynOption, queryString: string) => boolean = (option, queryStr) => {\n let content = option?.textContent || '';\n if (option instanceof SynOption) {\n content = option.getTextLabel();\n }\n const normalizedOption = normalizeString(content);\n const normalizedQuery = normalizeString(queryStr);\n return normalizedOption.includes(normalizedQuery);\n };\n\n /** Gets the validity state object */\n get validity() {\n return this.valueInput.validity;\n }\n\n /** Gets the validation message */\n get validationMessage() {\n return this.valueInput.validationMessage;\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n // Because this is a form control, it shouldn't be opened initially\n this.open = false;\n }\n\n firstUpdated() {\n // initially set the displayLabel if the value was set via property initially\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.updateComplete.then(() => {\n this.displayLabel = this.value;\n });\n this.formControlController.updateValidity();\n }\n\n private addOpenListeners() {\n //\n // Listen on the root node instead of the document in case the elements are inside a shadow root\n //\n // https://github.com/synergy-design-system/synergy/issues/1763\n //\n document.addEventListener('focusin', this.handleDocumentFocusIn);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n\n // If the component is rendered in a shadow root,\n // we need to attach the focusin listener there too\n if (this.getRootNode() !== document) {\n this.getRootNode().addEventListener('focusin', this.handleDocumentFocusIn);\n }\n\n if ('CloseWatcher' in window) {\n this.closeWatcher?.destroy();\n this.closeWatcher = new CloseWatcher();\n this.closeWatcher.onclose = () => {\n if (this.open) {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n }\n };\n }\n }\n\n private removeOpenListeners() {\n document.removeEventListener('focusin', this.handleDocumentFocusIn);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n\n if (this.getRootNode() !== document) {\n this.getRootNode().removeEventListener('focusin', this.handleDocumentFocusIn);\n }\n\n this.closeWatcher?.destroy();\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleDocumentFocusIn = (event: KeyboardEvent) => {\n // Close when focusing out of the combobox\n const path = event.composedPath();\n if (this && !path.includes(this)) {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.hide();\n }\n };\n\n /* eslint-disable @typescript-eslint/no-floating-promises */\n // eslint-disable-next-line complexity\n private handleDocumentKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n const isClearButton = target.closest('.combobox__clear') !== null;\n\n if (isClearButton) {\n return;\n }\n\n // Close when pressing escape and open / clear input if not open\n if (event.key === 'Escape') {\n if (this.open && !this.closeWatcher) {\n event.preventDefault();\n event.stopPropagation();\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n } else if (!this.open) {\n this.clearCombobox();\n }\n }\n\n // Handle enter.\n if (event.key === 'Enter') {\n const currentOption = this.getCurrentOption();\n\n // Pressing enter when focused on an input should submit the form like a native input, but\n // we wait a tick before submitting to allow users to cancel the keydown event if they need to\n const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n if (!this.open && !hasModifier) {\n setTimeout(() => {\n if (!event.defaultPrevented) {\n this.formControlController.submit();\n }\n });\n return;\n }\n\n if (!this.open || (currentOption && currentOption.disabled)) {\n return;\n }\n\n // Update the value based on the current selection and close it\n if (currentOption) {\n const oldValue = this.lastOptionValue;\n this.setSelectedOption(currentOption);\n\n if (this.value !== oldValue) {\n // Emit after updating\n this.updateComplete.then(() => {\n this.emit('syn-input');\n this.emit('syn-change');\n });\n }\n }\n\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n return;\n }\n\n // Navigate options\n if (['ArrowUp', 'ArrowDown'].includes(event.key)) {\n // Prevent scrolling\n event.preventDefault();\n event.stopPropagation();\n // Open it\n if (!this.open) {\n this.show();\n }\n\n this.selectNextOption(event.key === 'ArrowDown');\n }\n\n // Move cursor\n if (['Home', 'End'].includes(event.key)) {\n // Prevent scrolling\n event.preventDefault();\n event.stopPropagation();\n if (event.key === 'Home') {\n this.displayInput.setSelectionRange(0, 0);\n } else if (event.key === 'End') {\n this.displayInput.setSelectionRange(\n this.displayInput.value.length,\n this.displayInput.value.length,\n );\n }\n }\n };\n /* eslint-enable @typescript-eslint/no-floating-promises */\n\n private handleDocumentMouseDown = (event: MouseEvent) => {\n // Close when clicking outside of the combobox\n const path = event.composedPath();\n if (this && !path.includes(this)) {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.hide();\n }\n };\n\n private handleLabelClick() {\n this.displayInput.focus();\n }\n\n private handleComboboxMouseDown(event: MouseEvent) {\n // Ignore disabled controls\n if (this.disabled) {\n return;\n }\n\n const toggleListboxOpen = () => (this.open ? this.hide() : this.show());\n event.preventDefault();\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n toggleListboxOpen().then(() => {\n setTimeout(() => this.displayInput.focus({ preventScroll: true }));\n });\n }\n\n private handleComboboxKeyDown(event: KeyboardEvent) {\n if (event.key === 'Tab') {\n return;\n }\n\n this.handleDocumentKeyDown(event);\n }\n\n private handleClearClick(event: MouseEvent) {\n event.stopPropagation();\n this.clearCombobox();\n }\n\n private clearCombobox() {\n if (this.value !== '') {\n this.value = '';\n this.displayInput.value = '';\n this.lastOptionValue = '';\n this.setSelectedOption(undefined);\n this.displayInput.focus({ preventScroll: true });\n\n // Emit after update\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.updateComplete.then(() => {\n this.emit('syn-clear');\n this.emit('syn-input');\n this.emit('syn-change');\n });\n }\n }\n\n // eslint-disable-next-line class-methods-use-this\n private preventLoosingFocus(event: MouseEvent) {\n // Don't lose focus of the input or propagate events\n event.stopPropagation();\n event.preventDefault();\n }\n\n /* eslint-disable @typescript-eslint/no-floating-promises */\n private handleOptionClick(event: MouseEvent) {\n const target = event.target as HTMLElement;\n const option = target.closest('syn-option');\n const oldValue = this.lastOptionValue;\n if (option && !option.disabled) {\n this.setSelectedOption(option);\n\n // Set focus after updating so the value is announced by screen readers\n this.updateComplete.then(() => this.displayInput.focus({ preventScroll: true }));\n\n if (this.value !== oldValue) {\n // Emit after updating\n this.updateComplete.then(() => {\n this.emit('syn-input');\n this.emit('syn-change');\n });\n }\n\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n }\n }\n /* eslint-enable @typescript-eslint/no-floating-promises */\n\n /**\n * Selects the following or previous option.\n *\n * @param isNext - A boolean indicating whether to select the following option (true)\n * or the previous option (false).\n */\n private selectNextOption(isNext: boolean) {\n const filteredOptions = this.getAllFilteredOptions();\n\n if (filteredOptions.length === 0) {\n return;\n }\n\n const currentOption = this.getCurrentOption();\n const currentIndex = filteredOptions.indexOf(currentOption!);\n let newIndex = Math.max(0, currentIndex);\n\n if (isNext) {\n const nextIndex = currentIndex + 1;\n newIndex = (nextIndex > filteredOptions.length - 1) ? 0 : nextIndex;\n } else {\n const previousIndex = currentIndex - 1;\n newIndex = previousIndex < 0 ? filteredOptions.length - 1 : previousIndex;\n }\n this.setCurrentOption(filteredOptions[newIndex]);\n scrollIntoView(this.getCurrentOption()!, this.listbox, 'vertical', 'auto');\n }\n\n private getAllFilteredOptions() {\n return this.getSlottedOptions().filter(option => !option.hidden);\n }\n\n private getCurrentOption() {\n return this.getAllFilteredOptions().find(option => option.current);\n }\n\n // Sets the current option, which is the option the user is currently interacting with\n // (e.g. via keyboard). Only one option may be \"current\" at a time.\n private setCurrentOption(option: SynOption | null) {\n const allOptions = this.getAllFilteredOptions();\n\n // Clear selection\n this.displayInput.removeAttribute('aria-activedescendant');\n\n allOptions.forEach(el => {\n // eslint-disable-next-line no-param-reassign\n el.current = false;\n el.setAttribute('aria-selected', 'false');\n });\n\n // Select the target option\n if (option) {\n // eslint-disable-next-line no-param-reassign\n option.current = true;\n option.setAttribute('aria-selected', 'true');\n this.displayInput.setAttribute('aria-activedescendant', option.id);\n }\n }\n\n /**\n * Updates the selected options cache, the current value, and the display value\n */\n private setSelectedOption(option: SynOption | undefined) {\n this.selectedOption = option;\n\n // Check if the selected option has a value,\n // if not take the text content of the option otherwise the input text\n const optionValue = this.selectedOption?.value || this.selectedOption?.getTextLabel();\n\n if (option) {\n this.lastOptionValue = optionValue || '';\n }\n\n // Update the value\n this.value = optionValue ?? this.displayInput.value;\n\n // Update validity and display label\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.updateComplete.then(() => {\n this.displayLabel = this.selectedOption?.getTextLabel() ?? this.displayInput.value;\n this.formControlController.updateValidity();\n });\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n @watch(['filter', 'getOption'], { waitUntilFirstUpdate: true })\n handlePropertiesChange() {\n this.createComboboxOptionsFromQuery(this.value);\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n\n // Close the listbox when the control is disabled\n if (this.disabled) {\n this.open = false;\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.handleOpenChange();\n }\n }\n\n @watch('value', { waitUntilFirstUpdate: true })\n handleValueChange() {\n // set the display label here in case of the value was set via property only\n this.displayLabel = this.value;\n this.createComboboxOptionsFromQuery(this.value);\n this.setCurrentOption(null);\n }\n\n @watch('open', { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.open && !this.disabled) {\n if (this.numberFilteredOptions === 0) {\n // Don't open the listbox if there are no options\n this.open = false;\n this.emit('syn-error');\n return;\n }\n\n // Show\n this.emit('syn-show');\n this.addOpenListeners();\n\n await stopAnimations(this);\n this.listbox.hidden = false;\n this.popup.active = true;\n\n const { keyframes, options } = getAnimation(this, 'combobox.show', { dir: this.localize.dir() });\n await animateTo(this.popup.popup, keyframes, options);\n\n this.emit('syn-after-show');\n return;\n }\n\n this.setCurrentOption(null);\n this.displayInput.removeAttribute('aria-activedescendant');\n // Hide\n this.emit('syn-hide');\n this.removeOpenListeners();\n\n await stopAnimations(this);\n const { keyframes, options } = getAnimation(this, 'combobox.hide', { dir: this.localize.dir() });\n await animateTo(this.popup.popup, keyframes, options);\n this.listbox.hidden = true;\n this.popup.active = false;\n\n this.emit('syn-after-hide');\n }\n\n /**\n * Shows the listbox. If it is not possible to open the listbox, because there are no\n * appropriate filtered options, a syn-error is emitted and the listbox stays closed.\n */\n async show() {\n if (this.open || this.disabled) {\n this.open = false;\n return undefined;\n }\n\n this.open = true;\n return Promise.race([waitForEvent(this, 'syn-after-show'), waitForEvent(this, 'syn-error')]);\n }\n\n /** Hides the listbox. */\n async hide() {\n if (!this.open || this.disabled) {\n this.open = false;\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'syn-after-hide');\n }\n\n /**\n * Checks for validity but does not show a validation message.\n * Returns `true` when valid and `false` when invalid.\n */\n checkValidity() {\n return this.valueInput.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.valueInput.reportValidity();\n }\n\n /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n this.valueInput.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n /** Sets focus on the control. */\n focus(options?: FocusOptions) {\n this.displayInput.focus(options);\n }\n\n /** Removes focus from the control. */\n blur() {\n this.displayInput.blur();\n }\n\n /* eslint-disable no-param-reassign, @typescript-eslint/no-floating-promises */\n private createComboboxOptionsFromQuery(queryString: string) {\n this.numberFilteredOptions = 0;\n this.isOptionRendererTriggered = true;\n\n // This is needed for angular. For some reason the handleDefaultSlotChange is not triggered\n // initially and therefore the cachedOptions are not set.\n if (this.cachedOptions.length === 0) {\n this.cacheSlottedOptionsAndOptgroups();\n }\n\n // Update the syn-option's based on the query string and getOption\n this.getSlottedOptions()\n .forEach(option => {\n // Use the original cached option, to do changes on it\n const cachedOption = this.cachedOptions.find(o => o.id === option.id) || option;\n const optionResult = this.getOption(cachedOption, queryString);\n let updatedOption = createOptionFromDifferentTypes(optionResult);\n\n // The type of the getOption function is incorrect, therefore use the original option\n if (!updatedOption) {\n updatedOption = cachedOption;\n }\n\n const hideOption = !(this.filter(updatedOption, queryString) || queryString === '');\n updatedOption.hidden = hideOption;\n option.replaceWith(updatedOption);\n\n if (!hideOption) {\n this.numberFilteredOptions += 1;\n }\n });\n\n // Update the syn-optgroup's if available\n const visibleOptgroups = this.getSlottedOptGroups().filter(optgroup => {\n const options = getAllOptions(Array.from(optgroup.children) as HTMLElement[]).flat();\n const isVisible = options.some(option => !option.hidden);\n optgroup.hidden = !isVisible;\n return isVisible;\n });\n\n // Hide the divider of the first visible optgroup, as it can unfortunately not be hidden via css\n visibleOptgroups[0]?.style.setProperty('--display-divider', 'none');\n\n // This is needed so the component does not endlessly rerender,\n // because the slot change event is endlessly retriggered otherwise.\n setTimeout(() => {\n this.isOptionRendererTriggered = false;\n }, 0);\n }\n /* eslint-enable no-param-reassign, @typescript-eslint/no-floating-promises */\n\n private async handleInput() {\n const inputValue = this.displayInput.value;\n this.value = inputValue;\n await this.updateComplete;\n this.open = this.numberFilteredOptions > 0;\n this.setSelectedOption(undefined);\n\n this.formControlController.updateValidity();\n this.emit('syn-input');\n }\n\n private handleChange() {\n // Only update the value and emit the event, if the change event occurred by\n // the user typing something in and removing focus of the combobox\n if (!this.selectedOption) {\n this.value = this.displayInput.value;\n // Update validity\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n this.updateComplete.then(() => {\n this.formControlController.updateValidity();\n });\n this.emit('syn-change');\n }\n }\n\n private getSlottedOptions() {\n return getAllOptions(getAssignedElementsForSlot(this.defaultSlot)).flat();\n }\n\n private getSlottedOptGroups(): SynOptGroup[] {\n return filterOnlyOptgroups(getAssignedElementsForSlot(this.defaultSlot));\n }\n\n /* eslint-disable no-param-reassign */\n private cacheSlottedOptionsAndOptgroups() {\n const slottedOptions = this.getSlottedOptions();\n const slottedOptgroups = this.getSlottedOptGroups();\n\n slottedOptions.forEach((option, index) => {\n option.id = option.id || `syn-combobox-option-${index}`;\n });\n\n slottedOptgroups.forEach((optgroup, index) => {\n optgroup.id = optgroup.id || `syn-combobox-optgroup-${index}`;\n });\n\n // Cache the slotted options\n this.cachedOptions = [...slottedOptions];\n }\n /* eslint-enable no-param-reassign */\n\n /* eslint-disable @typescript-eslint/no-floating-promises, complexity */\n /* @internal - used by options to update labels */\n public handleDefaultSlotChange() {\n if (!this.isOptionRendererTriggered) {\n // Rerun this handler when <syn-option> is registered\n if (!customElements.get('syn-option')) {\n customElements.whenDefined('syn-option').then(() => this.handleDefaultSlotChange());\n return;\n }\n\n this.cacheSlottedOptionsAndOptgroups();\n\n this.createComboboxOptionsFromQuery(this.value);\n\n if (this.hasFocus && this.value.length > 0 && !this.open) {\n this.show();\n }\n }\n }\n /* eslint-enable @typescript-eslint/no-floating-promises, complexity */\n\n /* eslint-disable @typescript-eslint/unbound-method */\n // eslint-disable-next-line complexity\n render() {\n const hasLabelSlot = this.hasSlotController.test('label');\n const hasHelpTextSlot = this.hasSlotController.test('help-text');\n const hasLabel = this.label ? true : !!hasLabelSlot;\n const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n const hasClearIcon = this.clearable && !this.disabled && this.value.length > 0;\n const isPlaceholderVisible = this.placeholder && this.value.length === 0;\n\n return html`\n <div\n part=\"form-control\"\n class=${classMap({\n 'form-control': true,\n 'form-control--has-help-text': hasHelpText,\n 'form-control--has-label': hasLabel,\n 'form-control--large': this.size === 'large',\n 'form-control--medium': this.size === 'medium',\n 'form-control--small': this.size === 'small',\n })}\n >\n <label\n id=\"label\"\n part=\"form-control-label\"\n class=\"form-control__label\"\n aria-hidden=${hasLabel ? 'false' : 'true'}\n @click=${this.handleLabelClick}\n >\n <slot name=\"label\">${this.label}</slot>\n </label>\n\n <div part=\"form-control-input\" class=\"form-control-input\">\n <syn-popup\n class=${classMap({\n combobox: true,\n 'combobox--bottom': this.placement === 'bottom',\n 'combobox--disabled': this.disabled,\n 'combobox--focused': this.hasFocus,\n 'combobox--large': this.size === 'large',\n 'combobox--medium': this.size === 'medium',\n 'combobox--open': this.open,\n 'combobox--placeholder-visible': isPlaceholderVisible,\n 'combobox--small': this.size === 'small',\n 'combobox--standard': true,\n 'combobox--top': this.placement === 'top',\n })}\n placement=${this.placement}\n strategy=${this.hoist ? 'fixed' : 'absolute'}\n flip\n shift\n sync=\"width\"\n auto-size=\"vertical\"\n auto-size-padding=\"10\"\n >\n <div\n part=\"combobox\"\n class=\"combobox__inputs\"\n slot=\"anchor\"\n @keydown=${this.handleComboboxKeyDown}\n @mousedown=${this.handleComboboxMouseDown}\n >\n <slot part=\"prefix\" name=\"prefix\" class=\"combobox__prefix\"></slot>\n\n <input\n part=\"display-input\"\n class=\"combobox__display-input\"\n type=\"text\"\n placeholder=${this.placeholder}\n .disabled=${this.disabled}\n .value=${this.displayLabel}\n autocomplete=\"off\"\n spellcheck=\"false\"\n autocapitalize=\"off\"\n aria-controls=\"listbox\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n aria-labelledby=\"label\"\n aria-disabled=${this.disabled ? 'true' : 'false'}\n aria-describedby=\"help-text\"\n role=\"combobox\"\n tabindex=\"0\"\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n\n aria-autocomplete=\"list\"\n aria-owns=\"listbox\"\n @input=${this.handleInput}\n @change=${this.handleChange}\n />\n\n <input\n class=\"combobox__value-input\"\n type=\"text\"\n ?disabled=${this.disabled}\n ?required=${this.required}\n .value=${this.value}\n tabindex=\"-1\"\n aria-hidden=\"true\"\n @focus=${() => this.focus()}\n @invalid=${this.handleInvalid}\n />\n \n ${hasClearIcon\n ? html`\n <button\n part=\"clear-button\"\n class=\"combobox__clear\"\n type=\"button\"\n aria-label=${this.localize.term('clearEntry')}\n @mousedown=${this.preventLoosingFocus}\n @click=${this.handleClearClick}\n tabindex=\"-1\"\n >\n <slot name=\"clear-icon\">\n <syn-icon name=\"x-circle-fill\" library=\"system\"></syn-icon>\n </slot>\n </button>\n `\n : ''}\n\n <slot name=\"suffix\" part=\"suffix\" class=\"combobox__suffix\"></slot>\n\n <slot name=\"expand-icon\" part=\"expand-icon\" class=\"combobox__expand-icon\">\n <syn-icon library=\"system\" name=\"chevron-down\"></syn-icon>\n </slot>\n </div>\n\n <div\n id=\"listbox\"\n role=\"listbox\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-labelledby=\"label\"\n part=\"listbox\"\n class=\"combobox__listbox\"\n tabindex=\"-1\"\n @mousedown=${this.preventLoosingFocus}\n @mouseup=${this.handleOptionClick}\n >\n <div class=\"listbox__options\" part=\"filtered-listbox\">\n <slot @slotchange=${this.handleDefaultSlotChange}></slot> \n </div>\n </div>\n </syn-popup>\n </div>\n \n <div\n part=\"form-control-help-text\"\n id=\"help-text\"\n class=\"form-control__help-text\"\n aria-hidden=${hasHelpText ? 'false' : 'true'}\n >\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n </div>\n `;\n }\n /* eslint-enable @typescript-eslint/unbound-method */\n}\n\nsetDefaultAnimation('combobox.show', {\n keyframes: [\n { opacity: 0, scale: 0.9 },\n { opacity: 1, scale: 1 },\n ],\n options: { duration: 100, easing: 'ease' },\n});\n\nsetDefaultAnimation('combobox.hide', {\n keyframes: [\n { opacity: 1, scale: 1 },\n { opacity: 0, scale: 0.9 },\n ],\n options: { duration: 100, easing: 'ease' },\n});\n"],
5
- "mappings": "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",
6
- "names": ["_a", "_b", "keyframes", "options"]
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/tag/tag.component.ts"],
4
- "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\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 } from 'lit/decorators.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIconButton from '../icon-button/icon-button.component.js';\nimport styles from './tag.styles.js';\nimport customStyles from './tag.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Tags are used as labels to organize things or to indicate a selection.\n * @documentation https://synergy.style/components/tag\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - The tag's content.\n *\n * @event syn-remove - Emitted when the remove button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart content - The tag's content.\n * @csspart remove-button - The tag's remove button, an `<syn-icon-button>`.\n * @csspart remove-button__base - The remove button's exported `base` part.\n */\nexport default class SynTag extends SynergyElement {\n static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n static dependencies = { 'syn-icon-button': SynIconButton };\n\n private readonly localize = new LocalizeController(this);\n\n /** The tag's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Makes the tag removable and shows a remove button. */\n @property({ type: Boolean }) removable = false;\n\n private handleRemoveClick() {\n this.emit('syn-remove');\n }\n\n render() {\n return html`\n <span\n part=\"base\"\n class=${classMap({\n tag: true,\n\n // Sizes\n 'tag--small': this.size === 'small',\n 'tag--medium': this.size === 'medium',\n 'tag--large': this.size === 'large',\n\n // Modifiers\n 'tag--removable': this.removable\n })}\n >\n <slot part=\"content\" class=\"tag__content\"></slot>\n\n ${this.removable\n ? html`\n <syn-icon-button\n part=\"remove-button\"\n exportparts=\"base:remove-button__base\"\n name=\"x-lg\"\n library=\"system\"\n label=${this.localize.term('remove')}\n class=\"tag__remove\"\n @click=${this.handleRemoveClick}\n tabindex=\"-1\"\n ></syn-icon-button>\n `\n : ''}\n </span>\n `;\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAQA,SAAS,gBAAgB;AACzB,SAAS,YAAY;AAErB,SAAS,gBAAgB;AAyBzB,IAAqB,SAArB,cAAoC,eAAe;AAAA,EAAnD;AAAA;AAIE,SAAiB,WAAW,IAAI,mBAAmB,IAAI;AAG1B,gBAAqC;AAGrC,qBAAY;AAAA;AAAA,EAEjC,oBAAoB;AAC1B,SAAK,KAAK,YAAY;AAAA,EACxB;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,KAAK;AAAA;AAAA,MAGL,cAAc,KAAK,SAAS;AAAA,MAC5B,eAAe,KAAK,SAAS;AAAA,MAC7B,cAAc,KAAK,SAAS;AAAA;AAAA,MAG5B,kBAAkB,KAAK;AAAA,IACzB,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,UAIA,KAAK,YACH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMY,KAAK,SAAS,KAAK,QAAQ,CAAC;AAAA;AAAA,yBAE3B,KAAK,iBAAiB;AAAA;AAAA;AAAA,gBAInC,EAAE;AAAA;AAAA;AAAA,EAGZ;AACF;AAnDqB,OACZ,SAAyB,CAAC,0BAAiB,oBAAQ,yBAAY;AADnD,OAEZ,eAAe,EAAE,mBAAmB,cAAc;AAK5B;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAPR,OAOU;AAGA;AAAA,EAA5B,SAAS,EAAE,MAAM,QAAQ,CAAC;AAAA,GAVR,OAUU;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/input/input.component.ts", "../../src/internal/longpress.ts"],
4
- "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\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 { HasSlotController } from '../../internal/slot.js';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynDivider from '../divider/divider.component.js';\nimport { longPress } from '../../internal/longpress.js';\nimport styles from './input.styles.js';\nimport customStyles from './input.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Inputs collect data from the user.\n * @documentation https://synergy.style/components/input\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-divider\n *\n * @slot label - The input's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the input.\n * @slot suffix - Used to append a presentational icon or similar element to the input.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot show-password-icon - An icon to use in lieu of the default show password icon.\n * @slot hide-password-icon - An icon to use in lieu of the default hide password icon.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n * @slot increment-number-stepper - An icon to use in lieu of the default increment number stepper icon.\n * @slot decrement-number-stepper - An icon to use in lieu of the default decrement number stepper icon.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-clear - Emitted when the clear button is activated.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control 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 form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart input - The internal `<input>` control.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart clear-button - The clear button.\n * @csspart password-toggle-button - The password toggle button.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart stepper - The container that wraps the number stepper.\n * @csspart decrement-number-stepper - The decrement number stepper button.\n * @csspart increment-number-stepper - The increment number stepper button.\n * @csspart divider - The divider between the increment and decrement number stepper buttons.\n */\nexport default class SynInput extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [componentStyles, formControlStyles, styles, formControlCustomStyles, customStyles];\n static dependencies = {\n\t\t'syn-icon': SynIcon,\n\t\t'syn-divider': SynDivider\n\t};\n\n private readonly formControlController = new FormControlController(this, {\n assumeInteractionOn: ['syn-blur', 'syn-input']\n });\n private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label', 'prefix', 'suffix');\n private readonly localize = new LocalizeController(this);\n\n @query('.input__control') input: HTMLInputElement;\n\n @state() private hasFocus = false;\n @property() title = ''; // make reactive to pass through\n\n private __numberInput = Object.assign(document.createElement('input'), { type: 'number' });\n private __dateInput = Object.assign(document.createElement('input'), { type: 'date' });\n\n /**\n * The type of input. Works the same as a native `<input>` element, but only a subset of types are supported. Defaults\n * to `text`.\n */\n @property({ reflect: true }) type:\n | 'date'\n | 'datetime-local'\n | 'email'\n | 'number'\n | 'password'\n | 'search'\n | 'tel'\n | 'text'\n | 'time'\n | 'url' = 'text';\n\n /** The name of the input, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /** The current value of the input, submitted as a name/value pair with form data. */\n @property() value = '';\n\n /** The default value of the form control. Primarily used for resetting the form control. */\n @defaultValue() defaultValue = '';\n\n /** The input's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** The input's label. If you need to display HTML, use the `label` slot instead. */\n @property() label = '';\n\n /** The input's help text. If you need to display HTML, use the `help-text` slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\n\n /** Adds a clear button when the input is not empty. */\n @property({ type: Boolean }) clearable = false;\n\n /** Disables the input. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Placeholder text to show as a hint when the input is empty. */\n @property() placeholder = '';\n\n /** Makes the input readonly. */\n @property({ type: Boolean, reflect: true }) readonly = false;\n\n /** Adds a button to toggle the password's visibility. Only applies to password types. */\n @property({ attribute: 'password-toggle', type: Boolean }) passwordToggle = false;\n\n /** Determines whether or not the password is currently visible. Only applies to password input types. */\n @property({ attribute: 'password-visible', type: Boolean }) passwordVisible = false;\n\n /** Hides the increment/decrement spin buttons for number inputs. */\n @property({ attribute: 'no-spin-buttons', type: Boolean }) noSpinButtons = 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 input a required field. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /** A regular expression pattern to validate input against. */\n @property() pattern: string;\n\n /** The minimum length of input that will be considered valid. */\n @property({ type: Number }) minlength: number;\n\n /** The maximum length of input that will be considered valid. */\n @property({ type: Number }) maxlength: number;\n\n /** The input's minimum value. Only applies to date and number input types. */\n @property() min: number | string;\n\n /** The input's maximum value. Only applies to date and number input types. */\n @property() max: number | string;\n\n /**\n * Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\n * implied, allowing any numeric value. Only applies to date and number input types.\n */\n @property() step: number | 'any';\n\n /** Controls whether and how text input is automatically capitalized as it is entered by the user. */\n @property() autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';\n\n /** Indicates whether the browser's autocorrect feature is on or off. */\n @property() autocorrect: 'off' | 'on';\n\n /**\n * Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n * [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.\n */\n @property() autocomplete: string;\n\n /** Indicates that the input should receive focus on page load. */\n @property({ type: Boolean }) autofocus: boolean;\n\n /** Used to customize the label or icon of the Enter key on virtual keyboards. */\n @property() enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';\n\n /** Enables spell checking on the input. */\n @property({\n type: Boolean,\n converter: {\n // Allow \"true|false\" attribute values but keep the property boolean\n fromAttribute: value => (!value || value === 'false' ? false : true),\n toAttribute: value => (value ? 'true' : 'false')\n }\n })\n spellcheck = true;\n\n /**\n * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\n * keyboard on supportive devices.\n */\n @property() inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n\n //\n // NOTE: We use an in-memory input for these getters/setters instead of the one in the template because the properties\n // can be set before the component is rendered.\n //\n\n /**\n * Gets or sets the current value as a `Date` object. Returns `null` if the value can't be converted. This will use the native `<input type=\"{{type}}\">` implementation and may result in an error.\n */\n get valueAsDate() {\n this.__dateInput.type = this.type;\n this.__dateInput.value = this.value;\n return this.input?.valueAsDate || this.__dateInput.valueAsDate;\n }\n\n set valueAsDate(newValue: Date | null) {\n this.__dateInput.type = this.type;\n this.__dateInput.valueAsDate = newValue;\n this.value = this.__dateInput.value;\n }\n\n /** Gets or sets the current value as a number. Returns `NaN` if the value can't be converted. */\n get valueAsNumber() {\n this.__numberInput.value = this.value;\n return this.input?.valueAsNumber || this.__numberInput.valueAsNumber;\n }\n\n set valueAsNumber(newValue: number) {\n this.__numberInput.valueAsNumber = newValue;\n this.value = this.__numberInput.value;\n }\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 handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleStep(){\n this.handleInput();\n this.input.focus();\n }\n\n private handleStepUp() {\n this.stepUp();\n this.handleStep();\n }\n\n private handleStepDown() {\n this.stepDown();\n this.handleStep();\n }\n \n private isDecrementDisabled() {\n if(this.disabled || this.readonly) {\n return true;\n }\n\n if (this.min === undefined || this.min === null || this.disabled) {\n return false;\n }\n\n const min = typeof this.min === 'string' ? parseFloat(this.min) : this.min\n return this.valueAsNumber <= min;\n }\n\n private isIncrementDisabled() {\n if(this.disabled || this.readonly) {\n return true;\n }\n\n if (this.max === undefined || this.max === null) {\n return false;\n }\n\n const max = typeof this.max === 'string' ? parseFloat(this.max) : this.max\n return this.valueAsNumber >= max;\n }\n\n private handleChange() {\n this.value = this.input.value;\n this.emit('syn-change');\n }\n\n private handleClearClick(event: MouseEvent) {\n event.preventDefault();\n\n if (this.value !== '') {\n this.value = '';\n this.emit('syn-clear');\n this.emit('syn-input');\n this.emit('syn-change');\n }\n\n this.input.focus();\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n private handleInput() {\n this.value = this.input.value;\n this.formControlController.updateValidity();\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 handleKeyDown(event: KeyboardEvent) {\n const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n // submitting to allow users to cancel the keydown event if they need to\n if (event.key === 'Enter' && !hasModifier) {\n setTimeout(() => {\n //\n // When using an Input Method Editor (IME), pressing enter will cause the form to submit unexpectedly. One way\n // to check for this is to look at event.isComposing, which will be true when the IME is open.\n //\n // See https://github.com/synergy-design-system/synergy/pull/988\n //\n if (!event.defaultPrevented && !event.isComposing) {\n this.formControlController.submit();\n }\n });\n }\n }\n\n private handlePasswordToggle() {\n this.passwordVisible = !this.passwordVisible;\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('step', { waitUntilFirstUpdate: true })\n handleStepChange() {\n // If step changes, the value may become invalid so we need to recheck after the update. We set the new step\n // imperatively so we don't have to wait for the next render to report the updated validity.\n this.input.step = String(this.step);\n this.formControlController.updateValidity();\n }\n\n @watch('value', { waitUntilFirstUpdate: true })\n async handleValueChange() {\n await this.updateComplete;\n this.formControlController.updateValidity();\n }\n\n /** Sets focus on the input. */\n focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the input. */\n blur() {\n this.input.blur();\n }\n\n /** Selects all the text in the input. */\n select() {\n this.input.select();\n }\n\n /** Sets the start and end positions of the text selection (0-based). */\n setSelectionRange(\n selectionStart: number,\n selectionEnd: number,\n selectionDirection: 'forward' | 'backward' | 'none' = 'none'\n ) {\n this.input.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n }\n\n /** Replaces a range of text with a new string. */\n setRangeText(\n replacement: string,\n start?: number,\n end?: number,\n selectMode: 'select' | 'start' | 'end' | 'preserve' = 'preserve'\n ) {\n const selectionStart = start ?? this.input.selectionStart!;\n const selectionEnd = end ?? this.input.selectionEnd!;\n\n this.input.setRangeText(replacement, selectionStart, selectionEnd, selectMode);\n\n if (this.value !== this.input.value) {\n this.value = this.input.value;\n }\n }\n\n /** Displays the browser picker for an input element (only works if the browser supports it for the input type). */\n showPicker() {\n if ('showPicker' in HTMLInputElement.prototype) {\n this.input.showPicker();\n }\n }\n\n /** Increments the value of a numeric input type by the value of the step attribute. */\n stepUp() {\n this.input.stepUp();\n if (this.value !== this.input.value) {\n this.value = this.input.value;\n }\n }\n\n /** Decrements the value of a numeric input type by the value of the step attribute. */\n stepDown() {\n this.input.stepDown();\n if (this.value !== this.input.value) {\n this.value = this.input.value;\n }\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 /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n this.input.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n render() {\n const hasLabelSlot = this.hasSlotController.test('label');\n const hasHelpTextSlot = this.hasSlotController.test('help-text');\n const hasPrefixSlot = this.hasSlotController.test('prefix');\n const hasSuffixSlot = this.hasSlotController.test('suffix');\n const hasLabel = this.label ? true : !!hasLabelSlot;\n const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n const hasClearIcon = this.clearable && !this.disabled && !this.readonly;\n const isClearIconVisible = hasClearIcon && (typeof this.value === 'number' || this.value.length > 0);\n\n return html`\n <div\n part=\"form-control\"\n class=${classMap({\n 'form-control': true,\n 'form-control--small': this.size === 'small',\n 'form-control--medium': this.size === 'medium',\n 'form-control--large': this.size === 'large',\n 'form-control--has-label': hasLabel,\n 'form-control--has-help-text': hasHelpText,\n 'form-control--has-prefix': hasPrefixSlot,\n 'form-control--has-suffix': hasSuffixSlot\n })}\n >\n <label\n part=\"form-control-label\"\n class=\"form-control__label\"\n for=\"input\"\n aria-hidden=${hasLabel ? 'false' : 'true'}\n >\n <slot name=\"label\">${this.label}</slot>\n </label>\n\n <div part=\"form-control-input\" class=\"form-control-input\">\n <div\n part=\"base\"\n class=${classMap({\n input: true,\n\n // Sizes\n 'input--small': this.size === 'small',\n 'input--medium': this.size === 'medium',\n 'input--large': this.size === 'large',\n\n // States\n 'input--standard': !this.readonly,\n 'input--readonly': this.readonly,\n 'input--disabled': this.disabled,\n 'input--focused': this.hasFocus,\n 'input--empty': !this.value,\n 'input--no-spin-buttons': this.noSpinButtons\n })}\n >\n <span part=\"prefix\" class=\"input__prefix\">\n <slot name=\"prefix\"></slot>\n </span>\n\n <input\n part=\"input\"\n id=\"input\"\n class=\"input__control\"\n type=${this.type === 'password' && this.passwordVisible ? 'text' : this.type}\n title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n name=${ifDefined(this.name)}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n placeholder=${ifDefined(this.placeholder)}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n min=${ifDefined(this.min)}\n max=${ifDefined(this.max)}\n step=${ifDefined(this.step as number)}\n .value=${live(this.value)}\n autocapitalize=${ifDefined(this.autocapitalize)}\n autocomplete=${ifDefined(this.autocomplete)}\n autocorrect=${ifDefined(this.autocorrect)}\n ?autofocus=${this.autofocus}\n spellcheck=${this.spellcheck}\n pattern=${ifDefined(this.pattern)}\n enterkeyhint=${ifDefined(this.enterkeyhint)}\n inputmode=${ifDefined(this.inputmode)}\n aria-describedby=\"help-text\"\n @change=${this.handleChange}\n @input=${this.handleInput}\n @invalid=${this.handleInvalid}\n @keydown=${this.handleKeyDown}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n />\n\n ${isClearIconVisible\n ? html`\n <button\n part=\"clear-button\"\n class=\"input__clear\"\n type=\"button\"\n aria-label=${this.localize.term('clearEntry')}\n @click=${this.handleClearClick}\n tabindex=\"-1\"\n >\n <slot name=\"clear-icon\">\n <syn-icon name=\"x-circle-fill\" library=\"system\"></syn-icon>\n </slot>\n </button>\n `\n : ''}\n ${this.passwordToggle && !this.disabled\n ? html`\n <button\n part=\"password-toggle-button\"\n class=\"input__password-toggle\"\n type=\"button\"\n aria-label=${this.localize.term(this.passwordVisible ? 'hidePassword' : 'showPassword')}\n @click=${this.handlePasswordToggle}\n tabindex=\"-1\"\n >\n ${this.passwordVisible\n ? html`\n <slot name=\"show-password-icon\">\n <syn-icon name=\"eye-slash\" library=\"system\"></syn-icon>\n </slot>\n `\n : html`\n <slot name=\"hide-password-icon\">\n <syn-icon name=\"eye\" library=\"system\"></syn-icon>\n </slot>\n `}\n </button>\n `\n : ''}\n\n <span part=\"suffix\" class=\"input__suffix\">\n <slot name=\"suffix\"></slot>\n </span>\n\n ${this.type === 'number' && !this.noSpinButtons\n ? html`\n <div part=\"stepper\" class=\"input__number-stepper\">\n <button\n part=\"decrement-number-stepper\"\n class=\"input__number-stepper-button\"\n type=\"button\"\n ?disabled=${this.isDecrementDisabled()}\n aria-hidden=\"true\"\n ${longPress({ start: () => this.handleStepDown(), end: () => this.handleChange()})}\n tabindex=\"-1\"\n >\n <slot name=\"decrement-number-stepper\">\n <syn-icon name=\"indeterminate\" library=\"system\"></syn-icon>\n </slot>\n </button>\n <syn-divider class=\"input__number-divider\" part=\"divider\" vertical></syn-divider>\n <button\n part=\"increment-number-stepper\"\n class=\"input__number-stepper-button\"\n type=\"button\"\n ?disabled=${this.isIncrementDisabled()}\n aria-hidden=\"true\"\n ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange()})}\n tabindex=\"-1\"\n >\n <slot name=\"increment-number-stepper\">\n <syn-icon name=\"add\" library=\"system\"></syn-icon>\n </slot>\n </button>\n </div>\n `\n : ''}\n </div>\n </div>\n\n <div\n part=\"form-control-help-text\"\n id=\"help-text\"\n class=\"form-control__help-text\"\n aria-hidden=${hasHelpText ? 'false' : 'true'}\n >\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n </div>\n `;\n }\n}\n", "import { type ElementPart, noChange, nothing } from 'lit';\nimport {\n AsyncDirective,\n type DirectiveParameters,\n type Part,\n PartType,\n directive,\n} from 'lit/async-directive.js';\n\ntype Callbacks = {\n start: () => void;\n end: () => void;\n};\n\n/**\n * A directive that determines,if a HTMLButtonElement is long pressed or only clicked.\n * Depending on the state it executes the callback once or repeating.\n *\n * Usage:\n *\n * <button\n * ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange()})}\n * >\n * my button\n * </button>\n */\nclass LongPressDirective extends AsyncDirective {\n host: HTMLButtonElement;\n\n observer: MutationObserver;\n\n callbacks: Callbacks;\n\n interval: NodeJS.Timeout;\n\n timeout: NodeJS.Timeout;\n\n constructor(part: Part) {\n super(part);\n if (part.type !== PartType.ELEMENT || !(part.element instanceof HTMLButtonElement)) {\n throw new Error('The `longPress` directive must be used on an HTMLButtonElement.');\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars, class-methods-use-this\n render(_callback: Callbacks): typeof nothing {\n return nothing;\n }\n\n update(part: ElementPart, [callbacks]: DirectiveParameters<this>): typeof noChange {\n // initial call\n if (this.callbacks === undefined && this.host === undefined) {\n this.host = part.element as HTMLButtonElement;\n this.callbacks = { ...callbacks };\n this.host.addEventListener('pointerdown', this.handlePointerDown);\n }\n\n return noChange;\n }\n\n protected disconnected(): void {\n this.stopSpinningAndCleanUp();\n this.host.removeEventListener('pointerdown', this.handlePointerDown);\n document.removeEventListener('pointerup', this.handlePointerUp);\n }\n\n private handlePointerDown = (event: PointerEvent) => {\n // do nothing if the click was not done from the left mouse button or if the button is disabled\n if (event.button !== 0 || this.host.disabled) {\n return;\n }\n this.spinOnLongPressCallback(event);\n };\n\n /**\n * Start spinning on long press clicks otherwise handle as single click event\n */\n private spinOnLongPressCallback(event: PointerEvent) {\n event.preventDefault();\n event.stopPropagation();\n\n // Start spinning only on long press\n this.timeout = setTimeout(() => {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n this.timeout = undefined;\n this.interval = setInterval(() => {\n this.callbacks.start();\n }, 50);\n }, 500);\n\n document.addEventListener('pointerup', this.handlePointerUp);\n\n // when buttons becoming disabled during long-press\n this.observer?.disconnect();\n this.observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.attributeName === 'disabled') {\n this.stopSpinningAndCleanUp();\n }\n });\n });\n this.observer.observe(this.host, { attributes: true });\n }\n\n private handlePointerUp = (pointerUp?: PointerEvent) => {\n pointerUp?.preventDefault();\n pointerUp?.stopPropagation();\n\n // we did not start to spin\n if (this.timeout) {\n this.callbacks.start();\n }\n\n this.stopSpinningAndCleanUp();\n\n this.callbacks.end();\n document.removeEventListener('pointerup', this.handlePointerUp);\n };\n\n /**\n * Stop the spinning and clean up all timer and observer\n */\n private stopSpinningAndCleanUp() {\n // stop spinning\n clearInterval(this.interval);\n\n clearTimeout(this.timeout);\n this.observer?.disconnect();\n }\n}\n\nexport const longPress = directive(LongPressDirective);\n\nexport type { LongPressDirective };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,SAAS,gBAAgB;AAIzB,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAC1B,SAAS,YAAY;AAErB,SAAS,UAAU,OAAO,aAAa;;;AChBvC,SAA2B,UAAU,eAAe;AACpD;AAAA,EACE;AAAA,EAGA;AAAA,EACA;AAAA,OACK;AAmBP,IAAM,qBAAN,cAAiC,eAAe;AAAA,EAW9C,YAAY,MAAY;AACtB,UAAM,IAAI;AA4BZ,SAAQ,oBAAoB,CAAC,UAAwB;AAEnD,UAAI,MAAM,WAAW,KAAK,KAAK,KAAK,UAAU;AAC5C;AAAA,MACF;AACA,WAAK,wBAAwB,KAAK;AAAA,IACpC;AAiCA,SAAQ,kBAAkB,CAAC,cAA6B;AACtD,6CAAW;AACX,6CAAW;AAGX,UAAI,KAAK,SAAS;AAChB,aAAK,UAAU,MAAM;AAAA,MACvB;AAEA,WAAK,uBAAuB;AAE5B,WAAK,UAAU,IAAI;AACnB,eAAS,oBAAoB,aAAa,KAAK,eAAe;AAAA,IAChE;AA/EE,QAAI,KAAK,SAAS,SAAS,WAAW,EAAE,KAAK,mBAAmB,oBAAoB;AAClF,YAAM,IAAI,MAAM,iEAAiE;AAAA,IACnF;AAAA,EACF;AAAA;AAAA,EAGA,OAAO,WAAsC;AAC3C,WAAO;AAAA,EACT;AAAA,EAEA,OAAO,MAAmB,CAAC,SAAS,GAA+C;AAEjF,QAAI,KAAK,cAAc,UAAa,KAAK,SAAS,QAAW;AAC3D,WAAK,OAAO,KAAK;AACjB,WAAK,YAAY,mBAAK;AACtB,WAAK,KAAK,iBAAiB,eAAe,KAAK,iBAAiB;AAAA,IAClE;AAEA,WAAO;AAAA,EACT;AAAA,EAEU,eAAqB;AAC7B,SAAK,uBAAuB;AAC5B,SAAK,KAAK,oBAAoB,eAAe,KAAK,iBAAiB;AACnE,aAAS,oBAAoB,aAAa,KAAK,eAAe;AAAA,EAChE;AAAA;AAAA;AAAA;AAAA,EAaQ,wBAAwB,OAAqB;AA7EvD;AA8EI,UAAM,eAAe;AACrB,UAAM,gBAAgB;AAGtB,SAAK,UAAU,WAAW,MAAM;AAG9B,WAAK,UAAU;AACf,WAAK,WAAW,YAAY,MAAM;AAChC,aAAK,UAAU,MAAM;AAAA,MACvB,GAAG,EAAE;AAAA,IACP,GAAG,GAAG;AAEN,aAAS,iBAAiB,aAAa,KAAK,eAAe;AAG3D,eAAK,aAAL,mBAAe;AACf,SAAK,WAAW,IAAI,iBAAiB,CAAC,cAAc;AAClD,gBAAU,QAAQ,CAAC,aAAa;AAC9B,YAAI,SAAS,kBAAkB,YAAY;AACzC,eAAK,uBAAuB;AAAA,QAC9B;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AACD,SAAK,SAAS,QAAQ,KAAK,MAAM,EAAE,YAAY,KAAK,CAAC;AAAA,EACvD;AAAA;AAAA;AAAA;AAAA,EAoBQ,yBAAyB;AA3HnC;AA6HI,kBAAc,KAAK,QAAQ;AAE3B,iBAAa,KAAK,OAAO;AACzB,eAAK,aAAL,mBAAe;AAAA,EACjB;AACF;AAEO,IAAM,YAAY,UAAU,kBAAkB;;;AD7DrD,IAAqB,WAArB,cAAsC,eAA6C;AAAA,EAAnF;AAAA;AAOE,SAAiB,wBAAwB,IAAI,sBAAsB,MAAM;AAAA,MACvE,qBAAqB,CAAC,YAAY,WAAW;AAAA,IAC/C,CAAC;AACD,SAAiB,oBAAoB,IAAI,kBAAkB,MAAM,aAAa,SAAS,UAAU,QAAQ;AACzG,SAAiB,WAAW,IAAI,mBAAmB,IAAI;AAI9C,SAAQ,WAAW;AAChB,iBAAQ;AAEpB;AAAA,SAAQ,gBAAgB,OAAO,OAAO,SAAS,cAAc,OAAO,GAAG,EAAE,MAAM,SAAS,CAAC;AACzF,SAAQ,cAAc,OAAO,OAAO,SAAS,cAAc,OAAO,GAAG,EAAE,MAAM,OAAO,CAAC;AAMxD,gBAUjB;AAGA,gBAAO;AAGP,iBAAQ;AAGJ,wBAAe;AAGF,gBAAqC;AAGtD,iBAAQ;AAGkB,oBAAW;AAGpB,qBAAY;AAGG,oBAAW;AAG3C,uBAAc;AAGkB,oBAAW;AAGI,0BAAiB;AAGhB,2BAAkB;AAGnB,yBAAgB;AAO9C,gBAAO;AAGQ,oBAAW;AAkDvD,sBAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgBb,IAAI,cAAc;AA7NpB;AA8NI,SAAK,YAAY,OAAO,KAAK;AAC7B,SAAK,YAAY,QAAQ,KAAK;AAC9B,aAAO,UAAK,UAAL,mBAAY,gBAAe,KAAK,YAAY;AAAA,EACrD;AAAA,EAEA,IAAI,YAAY,UAAuB;AACrC,SAAK,YAAY,OAAO,KAAK;AAC7B,SAAK,YAAY,cAAc;AAC/B,SAAK,QAAQ,KAAK,YAAY;AAAA,EAChC;AAAA;AAAA,EAGA,IAAI,gBAAgB;AA1OtB;AA2OI,SAAK,cAAc,QAAQ,KAAK;AAChC,aAAO,UAAK,UAAL,mBAAY,kBAAiB,KAAK,cAAc;AAAA,EACzD;AAAA,EAEA,IAAI,cAAc,UAAkB;AAClC,SAAK,cAAc,gBAAgB;AACnC,SAAK,QAAQ,KAAK,cAAc;AAAA,EAClC;AAAA;AAAA,EAGA,IAAI,WAAW;AACb,WAAO,KAAK,MAAM;AAAA,EACpB;AAAA;AAAA,EAGA,IAAI,oBAAoB;AACtB,WAAO,KAAK,MAAM;AAAA,EACpB;AAAA,EAEA,eAAe;AACb,SAAK,sBAAsB,eAAe;AAAA,EAC5C;AAAA,EAEQ,aAAa;AACnB,SAAK,WAAW;AAChB,SAAK,KAAK,UAAU;AAAA,EACtB;AAAA,EAEQ,aAAY;AAClB,SAAK,YAAY;AACjB,SAAK,MAAM,MAAM;AAAA,EACnB;AAAA,EAEQ,eAAe;AACrB,SAAK,OAAO;AACZ,SAAK,WAAW;AAAA,EAClB;AAAA,EAEQ,iBAAiB;AACvB,SAAK,SAAS;AACd,SAAK,WAAW;AAAA,EAClB;AAAA,EAEQ,sBAAsB;AAC5B,QAAG,KAAK,YAAY,KAAK,UAAU;AACjC,aAAO;AAAA,IACT;AAEA,QAAI,KAAK,QAAQ,UAAa,KAAK,QAAQ,QAAQ,KAAK,UAAU;AAChE,aAAO;AAAA,IACT;AAEA,UAAM,MAAM,OAAO,KAAK,QAAQ,WAAW,WAAW,KAAK,GAAG,IAAI,KAAK;AACvE,WAAO,KAAK,iBAAiB;AAAA,EAC/B;AAAA,EAEQ,sBAAsB;AAC5B,QAAG,KAAK,YAAY,KAAK,UAAU;AACjC,aAAO;AAAA,IACT;AAEA,QAAI,KAAK,QAAQ,UAAa,KAAK,QAAQ,MAAM;AAC/C,aAAO;AAAA,IACT;AAEA,UAAM,MAAM,OAAO,KAAK,QAAQ,WAAW,WAAW,KAAK,GAAG,IAAI,KAAK;AACvE,WAAO,KAAK,iBAAiB;AAAA,EAC/B;AAAA,EAEQ,eAAe;AACrB,SAAK,QAAQ,KAAK,MAAM;AACxB,SAAK,KAAK,YAAY;AAAA,EACxB;AAAA,EAEQ,iBAAiB,OAAmB;AAC1C,UAAM,eAAe;AAErB,QAAI,KAAK,UAAU,IAAI;AACrB,WAAK,QAAQ;AACb,WAAK,KAAK,WAAW;AACrB,WAAK,KAAK,WAAW;AACrB,WAAK,KAAK,YAAY;AAAA,IACxB;AAEA,SAAK,MAAM,MAAM;AAAA,EACnB;AAAA,EAEQ,cAAc;AACpB,SAAK,WAAW;AAChB,SAAK,KAAK,WAAW;AAAA,EACvB;AAAA,EAEQ,cAAc;AACpB,SAAK,QAAQ,KAAK,MAAM;AACxB,SAAK,sBAAsB,eAAe;AAC1C,SAAK,KAAK,WAAW;AAAA,EACvB;AAAA,EAEQ,cAAc,OAAc;AAClC,SAAK,sBAAsB,YAAY,KAAK;AAC5C,SAAK,sBAAsB,iBAAiB,KAAK;AAAA,EACnD;AAAA,EAEQ,cAAc,OAAsB;AAC1C,UAAM,cAAc,MAAM,WAAW,MAAM,WAAW,MAAM,YAAY,MAAM;AAI9E,QAAI,MAAM,QAAQ,WAAW,CAAC,aAAa;AACzC,iBAAW,MAAM;AAOf,YAAI,CAAC,MAAM,oBAAoB,CAAC,MAAM,aAAa;AACjD,eAAK,sBAAsB,OAAO;AAAA,QACpC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEQ,uBAAuB;AAC7B,SAAK,kBAAkB,CAAC,KAAK;AAAA,EAC/B;AAAA,EAGA,uBAAuB;AAErB,SAAK,sBAAsB,YAAY,KAAK,QAAQ;AAAA,EACtD;AAAA,EAGA,mBAAmB;AAGjB,SAAK,MAAM,OAAO,OAAO,KAAK,IAAI;AAClC,SAAK,sBAAsB,eAAe;AAAA,EAC5C;AAAA,EAGA,MAAM,oBAAoB;AACxB,UAAM,KAAK;AACX,SAAK,sBAAsB,eAAe;AAAA,EAC5C;AAAA;AAAA,EAGA,MAAM,SAAwB;AAC5B,SAAK,MAAM,MAAM,OAAO;AAAA,EAC1B;AAAA;AAAA,EAGA,OAAO;AACL,SAAK,MAAM,KAAK;AAAA,EAClB;AAAA;AAAA,EAGA,SAAS;AACP,SAAK,MAAM,OAAO;AAAA,EACpB;AAAA;AAAA,EAGA,kBACE,gBACA,cACA,qBAAsD,QACtD;AACA,SAAK,MAAM,kBAAkB,gBAAgB,cAAc,kBAAkB;AAAA,EAC/E;AAAA;AAAA,EAGA,aACE,aACA,OACA,KACA,aAAsD,YACtD;AACA,UAAM,iBAAiB,wBAAS,KAAK,MAAM;AAC3C,UAAM,eAAe,oBAAO,KAAK,MAAM;AAEvC,SAAK,MAAM,aAAa,aAAa,gBAAgB,cAAc,UAAU;AAE7E,QAAI,KAAK,UAAU,KAAK,MAAM,OAAO;AACnC,WAAK,QAAQ,KAAK,MAAM;AAAA,IAC1B;AAAA,EACF;AAAA;AAAA,EAGA,aAAa;AACX,QAAI,gBAAgB,iBAAiB,WAAW;AAC9C,WAAK,MAAM,WAAW;AAAA,IACxB;AAAA,EACF;AAAA;AAAA,EAGA,SAAS;AACP,SAAK,MAAM,OAAO;AAClB,QAAI,KAAK,UAAU,KAAK,MAAM,OAAO;AACnC,WAAK,QAAQ,KAAK,MAAM;AAAA,IAC1B;AAAA,EACF;AAAA;AAAA,EAGA,WAAW;AACT,SAAK,MAAM,SAAS;AACpB,QAAI,KAAK,UAAU,KAAK,MAAM,OAAO;AACnC,WAAK,QAAQ,KAAK,MAAM;AAAA,IAC1B;AAAA,EACF;AAAA;AAAA,EAGA,gBAAgB;AACd,WAAO,KAAK,MAAM,cAAc;AAAA,EAClC;AAAA;AAAA,EAGA,UAAkC;AAChC,WAAO,KAAK,sBAAsB,QAAQ;AAAA,EAC5C;AAAA;AAAA,EAGA,iBAAiB;AACf,WAAO,KAAK,MAAM,eAAe;AAAA,EACnC;AAAA;AAAA,EAGA,kBAAkB,SAAiB;AACjC,SAAK,MAAM,kBAAkB,OAAO;AACpC,SAAK,sBAAsB,eAAe;AAAA,EAC5C;AAAA,EAEA,SAAS;AACP,UAAM,eAAe,KAAK,kBAAkB,KAAK,OAAO;AACxD,UAAM,kBAAkB,KAAK,kBAAkB,KAAK,WAAW;AAC/D,UAAM,gBAAgB,KAAK,kBAAkB,KAAK,QAAQ;AAC1D,UAAM,gBAAgB,KAAK,kBAAkB,KAAK,QAAQ;AAC1D,UAAM,WAAW,KAAK,QAAQ,OAAO,CAAC,CAAC;AACvC,UAAM,cAAc,KAAK,WAAW,OAAO,CAAC,CAAC;AAC7C,UAAM,eAAe,KAAK,aAAa,CAAC,KAAK,YAAY,CAAC,KAAK;AAC/D,UAAM,qBAAqB,iBAAiB,OAAO,KAAK,UAAU,YAAY,KAAK,MAAM,SAAS;AAElG,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,gBAAgB;AAAA,MAChB,uBAAuB,KAAK,SAAS;AAAA,MACrC,wBAAwB,KAAK,SAAS;AAAA,MACtC,uBAAuB,KAAK,SAAS;AAAA,MACrC,2BAA2B;AAAA,MAC3B,+BAA+B;AAAA,MAC/B,4BAA4B;AAAA,MAC5B,4BAA4B;AAAA,IAC9B,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMc,WAAW,UAAU,MAAM;AAAA;AAAA,+BAEpB,KAAK,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAMrB,SAAS;AAAA,MACf,OAAO;AAAA;AAAA,MAGP,gBAAgB,KAAK,SAAS;AAAA,MAC9B,iBAAiB,KAAK,SAAS;AAAA,MAC/B,gBAAgB,KAAK,SAAS;AAAA;AAAA,MAG9B,mBAAmB,CAAC,KAAK;AAAA,MACzB,mBAAmB,KAAK;AAAA,MACxB,mBAAmB,KAAK;AAAA,MACxB,kBAAkB,KAAK;AAAA,MACvB,gBAAgB,CAAC,KAAK;AAAA,MACtB,0BAA0B,KAAK;AAAA,IACjC,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAUO,KAAK,SAAS,cAAc,KAAK,kBAAkB,SAAS,KAAK,IAAI;AAAA,sBACpE,KAAK,KAAuF;AAAA,qBAC7F,UAAU,KAAK,IAAI,CAAC;AAAA,0BACf,KAAK,QAAQ;AAAA,0BACb,KAAK,QAAQ;AAAA,0BACb,KAAK,QAAQ;AAAA,4BACX,UAAU,KAAK,WAAW,CAAC;AAAA,0BAC7B,UAAU,KAAK,SAAS,CAAC;AAAA,0BACzB,UAAU,KAAK,SAAS,CAAC;AAAA,oBAC/B,UAAU,KAAK,GAAG,CAAC;AAAA,oBACnB,UAAU,KAAK,GAAG,CAAC;AAAA,qBAClB,UAAU,KAAK,IAAc,CAAC;AAAA,uBAC5B,KAAK,KAAK,KAAK,CAAC;AAAA,+BACR,UAAU,KAAK,cAAc,CAAC;AAAA,6BAChC,UAAU,KAAK,YAAY,CAAC;AAAA,4BAC7B,UAAU,KAAK,WAAW,CAAC;AAAA,2BAC5B,KAAK,SAAS;AAAA,2BACd,KAAK,UAAU;AAAA,wBAClB,UAAU,KAAK,OAAO,CAAC;AAAA,6BAClB,UAAU,KAAK,YAAY,CAAC;AAAA,0BAC/B,UAAU,KAAK,SAAS,CAAC;AAAA;AAAA,wBAE3B,KAAK,YAAY;AAAA,uBAClB,KAAK,WAAW;AAAA,yBACd,KAAK,aAAa;AAAA,yBAClB,KAAK,aAAa;AAAA,uBACpB,KAAK,WAAW;AAAA,sBACjB,KAAK,UAAU;AAAA;AAAA;AAAA,cAGvB,qBACE;AAAA;AAAA;AAAA;AAAA;AAAA,iCAKiB,KAAK,SAAS,KAAK,YAAY,CAAC;AAAA,6BACpC,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAQlC,EAAE;AAAA,cACJ,KAAK,kBAAkB,CAAC,KAAK,WAC3B;AAAA;AAAA;AAAA;AAAA;AAAA,iCAKiB,KAAK,SAAS,KAAK,KAAK,kBAAkB,iBAAiB,cAAc,CAAC;AAAA,6BAC9E,KAAK,oBAAoB;AAAA;AAAA;AAAA,sBAGhC,KAAK,kBACH;AAAA;AAAA;AAAA;AAAA,4BAKA;AAAA;AAAA;AAAA;AAAA,yBAIC;AAAA;AAAA,oBAGT,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMJ,KAAK,SAAS,YAAY,CAAC,KAAK,gBAC9B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAMc,KAAK,oBAAoB,CAAC;AAAA;AAAA,oBAEpC,UAAU,EAAE,OAAO,MAAM,KAAK,eAAe,GAAG,KAAK,MAAM,KAAK,aAAa,EAAC,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAYtE,KAAK,oBAAoB,CAAC;AAAA;AAAA,oBAEpC,UAAU,EAAE,OAAO,MAAM,KAAK,aAAa,GAAG,KAAK,MAAM,KAAK,aAAa,EAAC,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBASpF,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAQQ,cAAc,UAAU,MAAM;AAAA;AAAA,mCAEnB,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA,EAI9C;AACF;AAnkBqB,SACZ,SAAyB,CAAC,0BAAiB,6BAAmB,sBAAQ,oCAAyB,2BAAY;AAD/F,SAEZ,eAAe;AAAA,EACtB,YAAY;AAAA,EACZ,eAAe;AAChB;AAQ2B;AAAA,EAAzB,MAAM,iBAAiB;AAAA,GAbL,SAaO;AAET;AAAA,EAAhB,MAAM;AAAA,GAfY,SAeF;AACL;AAAA,EAAX,SAAS;AAAA,GAhBS,SAgBP;AASiB;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAzBR,SAyBU;AAajB;AAAA,EAAX,SAAS;AAAA,GAtCS,SAsCP;AAGA;AAAA,EAAX,SAAS;AAAA,GAzCS,SAyCP;AAGI;AAAA,EAAf,aAAa;AAAA,GA5CK,SA4CH;AAGa;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GA/CR,SA+CU;AAGjB;AAAA,EAAX,SAAS;AAAA,GAlDS,SAkDP;AAG0B;AAAA,EAArC,SAAS,EAAE,WAAW,YAAY,CAAC;AAAA,GArDjB,SAqDmB;AAGT;AAAA,EAA5B,SAAS,EAAE,MAAM,QAAQ,CAAC;AAAA,GAxDR,SAwDU;AAGe;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GA3DvB,SA2DyB;AAGhC;AAAA,EAAX,SAAS;AAAA,GA9DS,SA8DP;AAGgC;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAjEvB,SAiEyB;AAGe;AAAA,EAA1D,SAAS,EAAE,WAAW,mBAAmB,MAAM,QAAQ,CAAC;AAAA,GApEtC,SAoEwC;AAGC;AAAA,EAA3D,SAAS,EAAE,WAAW,oBAAoB,MAAM,QAAQ,CAAC;AAAA,GAvEvC,SAuEyC;AAGD;AAAA,EAA1D,SAAS,EAAE,WAAW,mBAAmB,MAAM,QAAQ,CAAC;AAAA,GA1EtC,SA0EwC;AAO9B;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAjFR,SAiFU;AAGe;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GApFvB,SAoFyB;AAGhC;AAAA,EAAX,SAAS;AAAA,GAvFS,SAuFP;AAGgB;AAAA,EAA3B,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA1FP,SA0FS;AAGA;AAAA,EAA3B,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA7FP,SA6FS;AAGhB;AAAA,EAAX,SAAS;AAAA,GAhGS,SAgGP;AAGA;AAAA,EAAX,SAAS;AAAA,GAnGS,SAmGP;AAMA;AAAA,EAAX,SAAS;AAAA,GAzGS,SAyGP;AAGA;AAAA,EAAX,SAAS;AAAA,GA5GS,SA4GP;AAGA;AAAA,EAAX,SAAS;AAAA,GA/GS,SA+GP;AAMA;AAAA,EAAX,SAAS;AAAA,GArHS,SAqHP;AAGiB;AAAA,EAA5B,SAAS,EAAE,MAAM,QAAQ,CAAC;AAAA,GAxHR,SAwHU;AAGjB;AAAA,EAAX,SAAS;AAAA,GA3HS,SA2HP;AAWZ;AAAA,EARC,SAAS;AAAA,IACR,MAAM;AAAA,IACN,WAAW;AAAA;AAAA,MAET,eAAe,WAAU,CAAC,SAAS,UAAU,UAAU,QAAQ;AAAA,MAC/D,aAAa,WAAU,QAAQ,SAAS;AAAA,IAC1C;AAAA,EACF,CAAC;AAAA,GArIkB,SAsInB;AAMY;AAAA,EAAX,SAAS;AAAA,GA5IS,SA4IP;AAwJZ;AAAA,EADC,MAAM,YAAY,EAAE,sBAAsB,KAAK,CAAC;AAAA,GAnS9B,SAoSnB;AAMA;AAAA,EADC,MAAM,QAAQ,EAAE,sBAAsB,KAAK,CAAC;AAAA,GAzS1B,SA0SnB;AAQM;AAAA,EADL,MAAM,SAAS,EAAE,sBAAsB,KAAK,CAAC;AAAA,GAjT3B,SAkTb;",
6
- "names": []
7
- }