@synergy-design-system/components 2.10.2 → 2.11.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/{chunk.LNY6YUO6.js → chunk.22GTODGK.js} +2 -2
- package/dist/chunks/{chunk.65L6WCR6.js → chunk.2QWFZFFH.js} +2 -2
- package/dist/chunks/{chunk.OBS3SYSN.js → chunk.2TICTVUA.js} +2 -2
- package/dist/chunks/{chunk.RJA3VP67.js → chunk.3EBU2LXD.js} +2 -2
- package/dist/chunks/{chunk.KSCSAGWO.js → chunk.3F7LLZWJ.js} +3 -3
- package/dist/chunks/{chunk.JMZQTN66.js → chunk.3UEIMTUM.js} +2 -2
- package/dist/chunks/{chunk.X7OQSEX2.js → chunk.3XQJFQD3.js} +4 -4
- package/dist/chunks/{chunk.SZT7XVV5.js → chunk.52456FY5.js} +4 -4
- package/dist/chunks/{chunk.WVHXHIV3.js → chunk.53SVGYMQ.js} +6 -6
- package/dist/chunks/{chunk.MUNBPFME.js → chunk.562KEWJB.js} +9 -7
- package/dist/chunks/chunk.562KEWJB.js.map +7 -0
- package/dist/chunks/{chunk.G23DQN3P.js → chunk.57BMEZH4.js} +2 -2
- package/dist/chunks/{chunk.C3RIFO4H.js → chunk.5F7BRK2T.js} +2 -2
- package/dist/chunks/{chunk.ANZWKSQQ.js → chunk.5FHT5R4H.js} +2 -2
- package/dist/chunks/{chunk.4GYVNNIY.js → chunk.6APBFAPL.js} +3 -3
- package/dist/chunks/{chunk.LBKAFXWM.js → chunk.6HOOQIDR.js} +2 -2
- package/dist/chunks/{chunk.ZD4S3T2U.js → chunk.6QQOPHCI.js} +2 -2
- package/dist/chunks/{chunk.BSZ6RFHE.js → chunk.6S2HTHLG.js} +2 -2
- package/dist/chunks/{chunk.55WMAVZI.js → chunk.6ZJ4P2CQ.js} +2 -2
- package/dist/chunks/{chunk.W4AB6YT6.js → chunk.A3PJVQKK.js} +62 -9
- package/dist/chunks/chunk.A3PJVQKK.js.map +7 -0
- package/dist/chunks/{chunk.EBQLSITZ.js → chunk.AIA6FPT5.js} +2 -2
- package/dist/chunks/{chunk.YI56F4S6.js → chunk.AYGERGTM.js} +2 -2
- package/dist/chunks/{chunk.FUJKCUQU.js → chunk.BKZ45UEY.js} +120 -14
- package/dist/chunks/chunk.BKZ45UEY.js.map +7 -0
- package/dist/chunks/{chunk.Z4LBSDQQ.js → chunk.BNHWEIFH.js} +2 -2
- package/dist/chunks/chunk.BUV5EYAG.js +79 -0
- package/dist/chunks/chunk.BUV5EYAG.js.map +7 -0
- package/dist/chunks/{chunk.YI456JQR.js → chunk.C277SCSZ.js} +3 -3
- package/dist/chunks/{chunk.VSWCHKJF.js → chunk.CCRUEP7M.js} +2 -2
- package/dist/chunks/{chunk.MW6REDDI.js → chunk.CFVULRUC.js} +2 -2
- package/dist/chunks/{chunk.I74P2GKE.js → chunk.CSKJ56S5.js} +2 -2
- package/dist/chunks/{chunk.4RJU3JRS.js → chunk.CWMONTOP.js} +17 -10
- package/dist/chunks/chunk.CWMONTOP.js.map +7 -0
- package/dist/chunks/{chunk.QSOE7FEI.js → chunk.D65PFCEJ.js} +2 -2
- package/dist/chunks/{chunk.35V3TAOT.js → chunk.DFABWKX7.js} +18 -9
- package/dist/chunks/{chunk.35V3TAOT.js.map → chunk.DFABWKX7.js.map} +2 -2
- package/dist/chunks/{chunk.X5PAS7KR.js → chunk.DFEPTCPT.js} +2 -2
- package/dist/chunks/{chunk.TUSYVDNG.js → chunk.DPSKWKTR.js} +3 -3
- package/dist/chunks/chunk.DPSKWKTR.js.map +7 -0
- package/dist/chunks/{chunk.4CJHDWLS.js → chunk.DYN7NMNV.js} +6 -6
- package/dist/chunks/{chunk.COHNCXE2.js → chunk.E6TFQMCA.js} +2 -2
- package/dist/chunks/{chunk.EZNG7BSP.js → chunk.FW23ZE2I.js} +2 -2
- package/dist/chunks/{chunk.QLEW5NYG.js → chunk.GVYAQVL4.js} +2 -2
- package/dist/chunks/{chunk.77OODQEK.js → chunk.H4LGH4RY.js} +2 -2
- package/dist/chunks/{chunk.EQJ6P5VY.js → chunk.HVNSACCH.js} +5 -5
- package/dist/chunks/{chunk.NKAJ7Y5N.js → chunk.I4AFO6WB.js} +3 -3
- package/dist/chunks/{chunk.X7TOECRW.js → chunk.IKOSRIQR.js} +35 -6
- package/dist/chunks/{chunk.X7TOECRW.js.map → chunk.IKOSRIQR.js.map} +2 -2
- package/dist/chunks/{chunk.VIXHTZKQ.js → chunk.IP7J3EFJ.js} +2 -2
- package/dist/chunks/{chunk.DQIDBZ4W.js → chunk.J3FIBO4S.js} +2 -2
- package/dist/chunks/{chunk.MSKJVY76.js → chunk.J472ED7V.js} +2 -2
- package/dist/chunks/{chunk.BJNF6JKR.js → chunk.JI7DAHVB.js} +2 -2
- package/dist/chunks/{chunk.OB4SHXTW.js → chunk.JPFJQ7IC.js} +3 -3
- package/dist/chunks/{chunk.KJUDMZQL.js → chunk.K5HEN4XX.js} +2 -2
- package/dist/chunks/{chunk.OBF3X4XA.js → chunk.KKC6JEDF.js} +3 -3
- package/dist/chunks/{chunk.E2VFBJWM.js → chunk.KTDEUF2L.js} +2 -2
- package/dist/chunks/{chunk.QIXM5QAO.js → chunk.L2HBMWOG.js} +2 -2
- package/dist/chunks/{chunk.CWYEWSU2.js → chunk.LAFRJON3.js} +2 -2
- package/dist/chunks/{chunk.HI6A5JDS.js → chunk.LBKL2XVA.js} +2 -2
- package/dist/chunks/{chunk.FBYKWYEG.js → chunk.LZBVUDEZ.js} +2 -2
- package/dist/chunks/{chunk.XBLOPLSG.js → chunk.MEWILH5R.js} +3 -3
- package/dist/chunks/{chunk.SJGUHYQX.js → chunk.MMZJ2MAB.js} +2 -2
- package/dist/chunks/{chunk.3TN54QCH.js → chunk.MTQS455P.js} +2 -2
- package/dist/chunks/{chunk.F6ZFOBEI.js → chunk.MX2MUOFQ.js} +2 -2
- package/dist/chunks/{chunk.NAKOCW4V.js → chunk.NADHCVOW.js} +2 -2
- package/dist/chunks/{chunk.KG73YUXI.js → chunk.NL3RUWYS.js} +49 -1
- package/dist/chunks/chunk.NL3RUWYS.js.map +7 -0
- package/dist/chunks/{chunk.OM5LY7SW.js → chunk.NQWNOCC5.js} +2 -2
- package/dist/chunks/{chunk.U47W5TZK.js → chunk.OBTXUQOH.js} +3 -3
- package/dist/chunks/chunk.OI3HOOCT.js +13 -0
- package/dist/chunks/chunk.OI3HOOCT.js.map +7 -0
- package/dist/chunks/{chunk.DILF4NTS.js → chunk.OQFKPVKB.js} +2 -2
- package/dist/chunks/{chunk.4GVPZ7MN.js → chunk.PGU7HZCZ.js} +2 -2
- package/dist/chunks/{chunk.JQ47GWDL.js → chunk.PKYC7QF3.js} +6 -1
- package/dist/chunks/chunk.PKYC7QF3.js.map +7 -0
- package/dist/chunks/{chunk.I44TGPKY.js → chunk.PSMTIRVU.js} +5 -5
- package/dist/chunks/{chunk.CYPWCY4S.js → chunk.PWKONDP4.js} +3 -3
- package/dist/chunks/{chunk.TKOSP7ST.js → chunk.QBM6YNBE.js} +2 -2
- package/dist/chunks/{chunk.4WDUIIGW.js → chunk.QHLSATKL.js} +2 -2
- package/dist/chunks/{chunk.UEBFYZL4.js → chunk.QOFJLM7G.js} +6 -6
- package/dist/chunks/{chunk.X4HKLZCI.js → chunk.QSYZGCK6.js} +2 -2
- package/dist/chunks/{chunk.CRUL2A6N.js → chunk.SHMBVU6O.js} +2 -2
- package/dist/chunks/{chunk.OXZU2HKF.js → chunk.SODGQJWE.js} +2 -2
- package/dist/chunks/{chunk.V5EXCYKN.js → chunk.SP5JN45Z.js} +2 -2
- package/dist/chunks/{chunk.ONEE5QZP.js → chunk.SVQQ7D7R.js} +2 -2
- package/dist/chunks/{chunk.SBSWPMEE.js → chunk.TBWOPCIU.js} +2 -2
- package/dist/chunks/{chunk.XF2OGXME.js → chunk.TBXXS5CR.js} +3 -3
- package/dist/chunks/{chunk.SLC6CCXM.js → chunk.TENX6AHR.js} +2 -2
- package/dist/chunks/{chunk.3U3ZKA5L.js → chunk.TWSE2CPF.js} +3 -3
- package/dist/chunks/{chunk.7L7VOBIG.js → chunk.U4D75TJF.js} +5 -5
- package/dist/chunks/{chunk.AIFBZLAG.js → chunk.UA6EAWRH.js} +2 -2
- package/dist/chunks/{chunk.J2OXSQAK.js → chunk.UREJSW6U.js} +9 -8
- package/dist/chunks/{chunk.J2OXSQAK.js.map → chunk.UREJSW6U.js.map} +2 -2
- package/dist/chunks/{chunk.YDKCOIO3.js → chunk.VGWWMT6X.js} +2 -2
- package/dist/chunks/{chunk.BN4M6SXT.js → chunk.WJEFLT2K.js} +3 -3
- package/dist/chunks/{chunk.5JFH3SGK.js → chunk.WNDYFXRT.js} +4 -3
- package/dist/chunks/chunk.WNDYFXRT.js.map +7 -0
- package/dist/chunks/{chunk.W4H4PZKD.js → chunk.X3UJK6BA.js} +5 -5
- package/dist/chunks/{chunk.W4H4PZKD.js.map → chunk.X3UJK6BA.js.map} +2 -2
- package/dist/chunks/{chunk.2UZ6WGD2.js → chunk.X726K7GO.js} +2 -2
- package/dist/chunks/{chunk.NGI67WXT.js → chunk.XOXVVU5C.js} +19 -1
- package/dist/chunks/{chunk.NGI67WXT.js.map → chunk.XOXVVU5C.js.map} +2 -2
- package/dist/chunks/{chunk.U6TFGXE3.js → chunk.XPIZMD2N.js} +3 -3
- package/dist/chunks/{chunk.5LHTTV2Y.js → chunk.XR42LWNN.js} +2 -2
- package/dist/chunks/{chunk.3EFHJEPQ.js → chunk.Y33WE5JP.js} +2 -2
- package/dist/chunks/{chunk.J5LJA64M.js → chunk.YBDLRGEB.js} +3 -3
- package/dist/chunks/{chunk.SNLJCC6L.js → chunk.YRZPHAZZ.js} +2 -2
- package/dist/chunks/{chunk.ID52I6OH.js → chunk.YUQOT4CX.js} +2 -2
- package/dist/chunks/{chunk.EDQUG4GS.js → chunk.ZEB6KOH7.js} +4 -4
- package/dist/chunks/{chunk.ITZIZ4HF.js → chunk.ZO3RFJI7.js} +3 -3
- package/dist/chunks/{chunk.63UP5YZV.js → chunk.ZV4WQBDO.js} +6 -6
- package/dist/chunks/{chunk.ZMXKGMOQ.js → chunk.ZZWRQ5W3.js} +3 -3
- package/dist/components/accordion/accordion.component.js +2 -2
- package/dist/components/accordion/accordion.js +3 -3
- package/dist/components/alert/alert.component.d.ts +12 -1
- package/dist/components/alert/alert.component.js +5 -5
- package/dist/components/alert/alert.js +6 -6
- package/dist/components/alert/alert.styles.js +1 -1
- package/dist/components/badge/badge.component.js +2 -2
- package/dist/components/badge/badge.js +3 -3
- package/dist/components/breadcrumb/breadcrumb.component.js +3 -3
- package/dist/components/breadcrumb/breadcrumb.js +4 -4
- package/dist/components/breadcrumb-item/breadcrumb-item.component.js +2 -2
- package/dist/components/breadcrumb-item/breadcrumb-item.js +3 -3
- package/dist/components/button/button.component.js +4 -4
- package/dist/components/button/button.js +5 -5
- package/dist/components/button-group/button-group.component.js +2 -2
- package/dist/components/button-group/button-group.js +3 -3
- package/dist/components/card/card.component.js +2 -2
- package/dist/components/card/card.js +3 -3
- package/dist/components/checkbox/checkbox.component.js +3 -3
- package/dist/components/checkbox/checkbox.js +4 -4
- package/dist/components/combobox/combobox.component.js +5 -5
- package/dist/components/combobox/combobox.js +6 -6
- package/dist/components/combobox/combobox.styles.js +1 -1
- package/dist/components/details/details.component.js +3 -3
- package/dist/components/details/details.js +4 -4
- package/dist/components/dialog/dialog.component.js +4 -4
- package/dist/components/dialog/dialog.js +5 -5
- package/dist/components/divider/divider.component.js +2 -2
- package/dist/components/divider/divider.js +3 -3
- package/dist/components/drawer/drawer.component.js +4 -4
- package/dist/components/drawer/drawer.js +5 -5
- package/dist/components/dropdown/dropdown.component.js +3 -3
- package/dist/components/dropdown/dropdown.js +4 -4
- package/dist/components/file/file.component.js +5 -5
- package/dist/components/file/file.js +6 -6
- package/dist/components/header/header.component.js +4 -4
- package/dist/components/header/header.js +5 -5
- package/dist/components/icon/icon.component.js +2 -2
- package/dist/components/icon/icon.js +3 -3
- package/dist/components/icon-button/icon-button.component.js +3 -3
- package/dist/components/icon-button/icon-button.js +4 -4
- package/dist/components/input/input.component.js +4 -4
- package/dist/components/input/input.js +5 -5
- package/dist/components/menu/menu.component.js +2 -2
- package/dist/components/menu/menu.js +3 -3
- package/dist/components/menu-item/menu-item.component.js +5 -5
- package/dist/components/menu-item/menu-item.js +6 -6
- package/dist/components/menu-label/menu-label.component.js +3 -3
- package/dist/components/menu-label/menu-label.js +4 -4
- package/dist/components/nav-item/nav-item.component.js +3 -3
- package/dist/components/nav-item/nav-item.js +4 -4
- package/dist/components/optgroup/optgroup.component.js +3 -3
- package/dist/components/optgroup/optgroup.js +4 -4
- package/dist/components/option/option.component.js +3 -3
- package/dist/components/option/option.js +4 -4
- package/dist/components/popup/popup.component.js +2 -2
- package/dist/components/popup/popup.js +3 -3
- package/dist/components/prio-nav/prio-nav.component.js +8 -8
- package/dist/components/prio-nav/prio-nav.js +9 -9
- package/dist/components/progress-bar/progress-bar.component.js +2 -2
- package/dist/components/progress-bar/progress-bar.js +3 -3
- package/dist/components/progress-ring/progress-ring.component.js +2 -2
- package/dist/components/progress-ring/progress-ring.js +3 -3
- package/dist/components/radio/radio.component.js +3 -3
- package/dist/components/radio/radio.js +4 -4
- package/dist/components/radio-button/radio-button.component.js +2 -2
- package/dist/components/radio-button/radio-button.js +3 -3
- package/dist/components/radio-group/radio-group.component.js +3 -3
- package/dist/components/radio-group/radio-group.js +4 -4
- package/dist/components/range/range.component.js +5 -5
- package/dist/components/range/range.js +6 -6
- package/dist/components/range-tick/range-tick.component.js +2 -2
- package/dist/components/range-tick/range-tick.js +3 -3
- package/dist/components/resize-observer/resize-observer.component.d.ts +37 -0
- package/dist/components/resize-observer/resize-observer.component.js +11 -0
- package/dist/components/resize-observer/resize-observer.component.js.map +7 -0
- package/dist/components/resize-observer/resize-observer.styles.d.ts +8 -0
- package/dist/components/resize-observer/resize-observer.styles.js +8 -0
- package/dist/components/resize-observer/resize-observer.styles.js.map +7 -0
- package/dist/components/select/select.component.js +8 -8
- package/dist/components/select/select.js +9 -9
- package/dist/components/select/select.styles.js +1 -1
- package/dist/components/side-nav/side-nav.component.js +6 -6
- package/dist/components/side-nav/side-nav.js +7 -7
- package/dist/components/spinner/spinner.component.js +2 -2
- package/dist/components/spinner/spinner.js +3 -3
- package/dist/components/switch/switch.component.js +3 -3
- package/dist/components/switch/switch.js +4 -4
- package/dist/components/tab/tab.component.js +4 -4
- package/dist/components/tab/tab.js +5 -5
- package/dist/components/tab-group/tab-group.component.d.ts +15 -0
- package/dist/components/tab-group/tab-group.component.js +8 -6
- package/dist/components/tab-group/tab-group.custom.styles.js +1 -1
- package/dist/components/tab-group/tab-group.js +9 -7
- package/dist/components/tab-group/tab-group.styles.js +1 -1
- package/dist/components/tab-panel/tab-panel.component.js +2 -2
- package/dist/components/tab-panel/tab-panel.js +3 -3
- package/dist/components/tag/tag.component.js +5 -5
- package/dist/components/tag/tag.js +6 -6
- package/dist/components/textarea/textarea.component.js +2 -2
- package/dist/components/textarea/textarea.js +3 -3
- package/dist/components/tooltip/tooltip.component.js +4 -4
- package/dist/components/tooltip/tooltip.js +5 -5
- package/dist/custom-elements.json +300 -81
- package/dist/events/events.d.ts +1 -0
- package/dist/events/syn-after-hide.d.ts +3 -0
- package/dist/events/syn-after-show.d.ts +3 -0
- package/dist/events/syn-blur.d.ts +3 -0
- package/dist/events/syn-change.d.ts +3 -0
- package/dist/events/syn-clear.d.ts +3 -0
- package/dist/events/syn-close.d.ts +3 -0
- package/dist/events/syn-error.d.ts +3 -0
- package/dist/events/syn-focus.d.ts +3 -0
- package/dist/events/syn-hide.d.ts +3 -0
- package/dist/events/syn-initial-focus.d.ts +3 -0
- package/dist/events/syn-input.d.ts +3 -0
- package/dist/events/syn-invalid.d.ts +3 -0
- package/dist/events/syn-load.d.ts +3 -0
- package/dist/events/syn-remove.d.ts +3 -0
- package/dist/events/syn-reposition.d.ts +3 -0
- package/dist/events/syn-request-close.d.ts +3 -0
- package/dist/events/syn-resize.d.ts +17 -0
- package/dist/events/syn-select.d.ts +3 -0
- package/dist/events/syn-show.d.ts +3 -0
- package/dist/events/syn-tab-hide.d.ts +3 -0
- package/dist/events/syn-tab-show.d.ts +3 -0
- package/dist/internal/scrollend-polyfill.d.ts +7 -0
- package/dist/internal/synergy-element.d.ts +4 -0
- package/dist/styles/index.css +1 -1
- package/dist/synergy.js +107 -105
- package/dist/vscode.html-custom-data.json +45 -23
- package/package.json +21 -21
- package/dist/chunks/chunk.4RJU3JRS.js.map +0 -7
- package/dist/chunks/chunk.5JFH3SGK.js.map +0 -7
- package/dist/chunks/chunk.FUJKCUQU.js.map +0 -7
- package/dist/chunks/chunk.JQ47GWDL.js.map +0 -7
- package/dist/chunks/chunk.KG73YUXI.js.map +0 -7
- package/dist/chunks/chunk.MUNBPFME.js.map +0 -7
- package/dist/chunks/chunk.TUSYVDNG.js.map +0 -7
- package/dist/chunks/chunk.W4AB6YT6.js.map +0 -7
- /package/dist/chunks/{chunk.LNY6YUO6.js.map → chunk.22GTODGK.js.map} +0 -0
- /package/dist/chunks/{chunk.65L6WCR6.js.map → chunk.2QWFZFFH.js.map} +0 -0
- /package/dist/chunks/{chunk.OBS3SYSN.js.map → chunk.2TICTVUA.js.map} +0 -0
- /package/dist/chunks/{chunk.RJA3VP67.js.map → chunk.3EBU2LXD.js.map} +0 -0
- /package/dist/chunks/{chunk.KSCSAGWO.js.map → chunk.3F7LLZWJ.js.map} +0 -0
- /package/dist/chunks/{chunk.JMZQTN66.js.map → chunk.3UEIMTUM.js.map} +0 -0
- /package/dist/chunks/{chunk.X7OQSEX2.js.map → chunk.3XQJFQD3.js.map} +0 -0
- /package/dist/chunks/{chunk.SZT7XVV5.js.map → chunk.52456FY5.js.map} +0 -0
- /package/dist/chunks/{chunk.WVHXHIV3.js.map → chunk.53SVGYMQ.js.map} +0 -0
- /package/dist/chunks/{chunk.G23DQN3P.js.map → chunk.57BMEZH4.js.map} +0 -0
- /package/dist/chunks/{chunk.C3RIFO4H.js.map → chunk.5F7BRK2T.js.map} +0 -0
- /package/dist/chunks/{chunk.ANZWKSQQ.js.map → chunk.5FHT5R4H.js.map} +0 -0
- /package/dist/chunks/{chunk.4GYVNNIY.js.map → chunk.6APBFAPL.js.map} +0 -0
- /package/dist/chunks/{chunk.LBKAFXWM.js.map → chunk.6HOOQIDR.js.map} +0 -0
- /package/dist/chunks/{chunk.ZD4S3T2U.js.map → chunk.6QQOPHCI.js.map} +0 -0
- /package/dist/chunks/{chunk.BSZ6RFHE.js.map → chunk.6S2HTHLG.js.map} +0 -0
- /package/dist/chunks/{chunk.55WMAVZI.js.map → chunk.6ZJ4P2CQ.js.map} +0 -0
- /package/dist/chunks/{chunk.EBQLSITZ.js.map → chunk.AIA6FPT5.js.map} +0 -0
- /package/dist/chunks/{chunk.YI56F4S6.js.map → chunk.AYGERGTM.js.map} +0 -0
- /package/dist/chunks/{chunk.Z4LBSDQQ.js.map → chunk.BNHWEIFH.js.map} +0 -0
- /package/dist/chunks/{chunk.YI456JQR.js.map → chunk.C277SCSZ.js.map} +0 -0
- /package/dist/chunks/{chunk.VSWCHKJF.js.map → chunk.CCRUEP7M.js.map} +0 -0
- /package/dist/chunks/{chunk.MW6REDDI.js.map → chunk.CFVULRUC.js.map} +0 -0
- /package/dist/chunks/{chunk.I74P2GKE.js.map → chunk.CSKJ56S5.js.map} +0 -0
- /package/dist/chunks/{chunk.QSOE7FEI.js.map → chunk.D65PFCEJ.js.map} +0 -0
- /package/dist/chunks/{chunk.X5PAS7KR.js.map → chunk.DFEPTCPT.js.map} +0 -0
- /package/dist/chunks/{chunk.4CJHDWLS.js.map → chunk.DYN7NMNV.js.map} +0 -0
- /package/dist/chunks/{chunk.COHNCXE2.js.map → chunk.E6TFQMCA.js.map} +0 -0
- /package/dist/chunks/{chunk.EZNG7BSP.js.map → chunk.FW23ZE2I.js.map} +0 -0
- /package/dist/chunks/{chunk.QLEW5NYG.js.map → chunk.GVYAQVL4.js.map} +0 -0
- /package/dist/chunks/{chunk.77OODQEK.js.map → chunk.H4LGH4RY.js.map} +0 -0
- /package/dist/chunks/{chunk.EQJ6P5VY.js.map → chunk.HVNSACCH.js.map} +0 -0
- /package/dist/chunks/{chunk.NKAJ7Y5N.js.map → chunk.I4AFO6WB.js.map} +0 -0
- /package/dist/chunks/{chunk.VIXHTZKQ.js.map → chunk.IP7J3EFJ.js.map} +0 -0
- /package/dist/chunks/{chunk.DQIDBZ4W.js.map → chunk.J3FIBO4S.js.map} +0 -0
- /package/dist/chunks/{chunk.MSKJVY76.js.map → chunk.J472ED7V.js.map} +0 -0
- /package/dist/chunks/{chunk.BJNF6JKR.js.map → chunk.JI7DAHVB.js.map} +0 -0
- /package/dist/chunks/{chunk.OB4SHXTW.js.map → chunk.JPFJQ7IC.js.map} +0 -0
- /package/dist/chunks/{chunk.KJUDMZQL.js.map → chunk.K5HEN4XX.js.map} +0 -0
- /package/dist/chunks/{chunk.OBF3X4XA.js.map → chunk.KKC6JEDF.js.map} +0 -0
- /package/dist/chunks/{chunk.E2VFBJWM.js.map → chunk.KTDEUF2L.js.map} +0 -0
- /package/dist/chunks/{chunk.QIXM5QAO.js.map → chunk.L2HBMWOG.js.map} +0 -0
- /package/dist/chunks/{chunk.CWYEWSU2.js.map → chunk.LAFRJON3.js.map} +0 -0
- /package/dist/chunks/{chunk.HI6A5JDS.js.map → chunk.LBKL2XVA.js.map} +0 -0
- /package/dist/chunks/{chunk.FBYKWYEG.js.map → chunk.LZBVUDEZ.js.map} +0 -0
- /package/dist/chunks/{chunk.XBLOPLSG.js.map → chunk.MEWILH5R.js.map} +0 -0
- /package/dist/chunks/{chunk.SJGUHYQX.js.map → chunk.MMZJ2MAB.js.map} +0 -0
- /package/dist/chunks/{chunk.3TN54QCH.js.map → chunk.MTQS455P.js.map} +0 -0
- /package/dist/chunks/{chunk.F6ZFOBEI.js.map → chunk.MX2MUOFQ.js.map} +0 -0
- /package/dist/chunks/{chunk.NAKOCW4V.js.map → chunk.NADHCVOW.js.map} +0 -0
- /package/dist/chunks/{chunk.OM5LY7SW.js.map → chunk.NQWNOCC5.js.map} +0 -0
- /package/dist/chunks/{chunk.U47W5TZK.js.map → chunk.OBTXUQOH.js.map} +0 -0
- /package/dist/chunks/{chunk.DILF4NTS.js.map → chunk.OQFKPVKB.js.map} +0 -0
- /package/dist/chunks/{chunk.4GVPZ7MN.js.map → chunk.PGU7HZCZ.js.map} +0 -0
- /package/dist/chunks/{chunk.I44TGPKY.js.map → chunk.PSMTIRVU.js.map} +0 -0
- /package/dist/chunks/{chunk.CYPWCY4S.js.map → chunk.PWKONDP4.js.map} +0 -0
- /package/dist/chunks/{chunk.TKOSP7ST.js.map → chunk.QBM6YNBE.js.map} +0 -0
- /package/dist/chunks/{chunk.4WDUIIGW.js.map → chunk.QHLSATKL.js.map} +0 -0
- /package/dist/chunks/{chunk.UEBFYZL4.js.map → chunk.QOFJLM7G.js.map} +0 -0
- /package/dist/chunks/{chunk.X4HKLZCI.js.map → chunk.QSYZGCK6.js.map} +0 -0
- /package/dist/chunks/{chunk.CRUL2A6N.js.map → chunk.SHMBVU6O.js.map} +0 -0
- /package/dist/chunks/{chunk.OXZU2HKF.js.map → chunk.SODGQJWE.js.map} +0 -0
- /package/dist/chunks/{chunk.V5EXCYKN.js.map → chunk.SP5JN45Z.js.map} +0 -0
- /package/dist/chunks/{chunk.ONEE5QZP.js.map → chunk.SVQQ7D7R.js.map} +0 -0
- /package/dist/chunks/{chunk.SBSWPMEE.js.map → chunk.TBWOPCIU.js.map} +0 -0
- /package/dist/chunks/{chunk.XF2OGXME.js.map → chunk.TBXXS5CR.js.map} +0 -0
- /package/dist/chunks/{chunk.SLC6CCXM.js.map → chunk.TENX6AHR.js.map} +0 -0
- /package/dist/chunks/{chunk.3U3ZKA5L.js.map → chunk.TWSE2CPF.js.map} +0 -0
- /package/dist/chunks/{chunk.7L7VOBIG.js.map → chunk.U4D75TJF.js.map} +0 -0
- /package/dist/chunks/{chunk.AIFBZLAG.js.map → chunk.UA6EAWRH.js.map} +0 -0
- /package/dist/chunks/{chunk.YDKCOIO3.js.map → chunk.VGWWMT6X.js.map} +0 -0
- /package/dist/chunks/{chunk.BN4M6SXT.js.map → chunk.WJEFLT2K.js.map} +0 -0
- /package/dist/chunks/{chunk.2UZ6WGD2.js.map → chunk.X726K7GO.js.map} +0 -0
- /package/dist/chunks/{chunk.U6TFGXE3.js.map → chunk.XPIZMD2N.js.map} +0 -0
- /package/dist/chunks/{chunk.5LHTTV2Y.js.map → chunk.XR42LWNN.js.map} +0 -0
- /package/dist/chunks/{chunk.3EFHJEPQ.js.map → chunk.Y33WE5JP.js.map} +0 -0
- /package/dist/chunks/{chunk.J5LJA64M.js.map → chunk.YBDLRGEB.js.map} +0 -0
- /package/dist/chunks/{chunk.SNLJCC6L.js.map → chunk.YRZPHAZZ.js.map} +0 -0
- /package/dist/chunks/{chunk.ID52I6OH.js.map → chunk.YUQOT4CX.js.map} +0 -0
- /package/dist/chunks/{chunk.EDQUG4GS.js.map → chunk.ZEB6KOH7.js.map} +0 -0
- /package/dist/chunks/{chunk.ITZIZ4HF.js.map → chunk.ZO3RFJI7.js.map} +0 -0
- /package/dist/chunks/{chunk.63UP5YZV.js.map → chunk.ZV4WQBDO.js.map} +0 -0
- /package/dist/chunks/{chunk.ZMXKGMOQ.js.map → chunk.ZZWRQ5W3.js.map} +0 -0
|
@@ -10,7 +10,7 @@ import {
|
|
|
10
10
|
} from "./chunk.FKKJBKYL.js";
|
|
11
11
|
import {
|
|
12
12
|
SynButtonGroup
|
|
13
|
-
} from "./chunk.
|
|
13
|
+
} from "./chunk.CSKJ56S5.js";
|
|
14
14
|
import {
|
|
15
15
|
FormControlController,
|
|
16
16
|
customErrorValidityState,
|
|
@@ -26,7 +26,7 @@ import {
|
|
|
26
26
|
import {
|
|
27
27
|
SynergyElement,
|
|
28
28
|
component_styles_default
|
|
29
|
-
} from "./chunk.
|
|
29
|
+
} from "./chunk.IKOSRIQR.js";
|
|
30
30
|
import {
|
|
31
31
|
__decorateClass
|
|
32
32
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -361,4 +361,4 @@ __decorateClass([
|
|
|
361
361
|
export {
|
|
362
362
|
SynRadioGroup
|
|
363
363
|
};
|
|
364
|
-
//# sourceMappingURL=chunk.
|
|
364
|
+
//# sourceMappingURL=chunk.TWSE2CPF.js.map
|
|
@@ -9,24 +9,24 @@ import {
|
|
|
9
9
|
} from "./chunk.JNP34M27.js";
|
|
10
10
|
import {
|
|
11
11
|
SynPopup
|
|
12
|
-
} from "./chunk.
|
|
12
|
+
} from "./chunk.DPSKWKTR.js";
|
|
13
13
|
import {
|
|
14
14
|
SynSpinner
|
|
15
|
-
} from "./chunk.
|
|
15
|
+
} from "./chunk.JI7DAHVB.js";
|
|
16
16
|
import {
|
|
17
17
|
HasSlotController,
|
|
18
18
|
getTextContent
|
|
19
19
|
} from "./chunk.WVVQK5TE.js";
|
|
20
20
|
import {
|
|
21
21
|
SynIcon
|
|
22
|
-
} from "./chunk.
|
|
22
|
+
} from "./chunk.562KEWJB.js";
|
|
23
23
|
import {
|
|
24
24
|
watch
|
|
25
25
|
} from "./chunk.74IOULXM.js";
|
|
26
26
|
import {
|
|
27
27
|
SynergyElement,
|
|
28
28
|
component_styles_default
|
|
29
|
-
} from "./chunk.
|
|
29
|
+
} from "./chunk.IKOSRIQR.js";
|
|
30
30
|
import {
|
|
31
31
|
__decorateClass
|
|
32
32
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -187,4 +187,4 @@ __decorateClass([
|
|
|
187
187
|
export {
|
|
188
188
|
SynMenuItem
|
|
189
189
|
};
|
|
190
|
-
//# sourceMappingURL=chunk.
|
|
190
|
+
//# sourceMappingURL=chunk.U4D75TJF.js.map
|
|
@@ -10,7 +10,7 @@ import {
|
|
|
10
10
|
import {
|
|
11
11
|
SynergyElement,
|
|
12
12
|
component_styles_default
|
|
13
|
-
} from "./chunk.
|
|
13
|
+
} from "./chunk.IKOSRIQR.js";
|
|
14
14
|
import {
|
|
15
15
|
__decorateClass
|
|
16
16
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -62,4 +62,4 @@ __decorateClass([
|
|
|
62
62
|
export {
|
|
63
63
|
SynTabPanel
|
|
64
64
|
};
|
|
65
|
-
//# sourceMappingURL=chunk.
|
|
65
|
+
//# sourceMappingURL=chunk.UA6EAWRH.js.map
|
|
@@ -158,15 +158,12 @@ var combobox_styles_default = css`
|
|
|
158
158
|
margin-inline-end: var(--syn-input-spacing-large);
|
|
159
159
|
}
|
|
160
160
|
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
flex: 0;
|
|
164
|
-
display: inline-flex;
|
|
165
|
-
align-items: center;
|
|
166
|
-
color: var(--syn-input-placeholder-color);
|
|
161
|
+
.combobox--large.combobox--multiple .combobox__prefix::slotted(*) {
|
|
162
|
+
margin-inline-start: var(--syn-input-spacing-large);
|
|
167
163
|
}
|
|
168
164
|
|
|
169
|
-
|
|
165
|
+
/* Prefix and Suffix */
|
|
166
|
+
.combobox__prefix,
|
|
170
167
|
.combobox__suffix {
|
|
171
168
|
flex: 0;
|
|
172
169
|
display: inline-flex;
|
|
@@ -174,6 +171,10 @@ var combobox_styles_default = css`
|
|
|
174
171
|
color: var(--syn-input-placeholder-color);
|
|
175
172
|
}
|
|
176
173
|
|
|
174
|
+
.combobox__suffix::slotted(*) {
|
|
175
|
+
margin-inline-start: var(--syn-spacing-small);
|
|
176
|
+
}
|
|
177
|
+
|
|
177
178
|
/* Clear button */
|
|
178
179
|
.combobox__clear {
|
|
179
180
|
display: inline-flex;
|
|
@@ -342,4 +343,4 @@ var combobox_styles_default = css`
|
|
|
342
343
|
export {
|
|
343
344
|
combobox_styles_default
|
|
344
345
|
};
|
|
345
|
-
//# sourceMappingURL=chunk.
|
|
346
|
+
//# sourceMappingURL=chunk.UREJSW6U.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/combobox/combobox.styles.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 { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n :host {\n display: block;\n }\n\n /** The popup */\n .combobox {\n flex: 1 1 auto;\n display: inline-flex;\n width: 100%;\n position: relative;\n vertical-align: middle;\n }\n\n .combobox::part(popup) {\n z-index: var(--syn-z-index-dropdown);\n }\n\n .combobox[data-current-placement^='top']::part(popup) {\n transform-origin: bottom;\n }\n\n .combobox[data-current-placement^='bottom']::part(popup) {\n transform-origin: top;\n }\n\n /* Combobox */\n .combobox__inputs {\n flex: 1;\n display: flex;\n width: 100%;\n min-width: 0;\n position: relative;\n align-items: center;\n justify-content: start;\n font-family: var(--syn-input-font-family);\n font-weight: var(--syn-input-font-weight);\n letter-spacing: var(--syn-input-letter-spacing);\n vertical-align: middle;\n overflow: hidden;\n cursor: pointer;\n transition:\n var(--syn-transition-fast) color,\n var(--syn-transition-fast) border,\n var(--syn-transition-fast) box-shadow,\n var(--syn-transition-fast) background-color;\n }\n\n .combobox__display-input {\n position: relative;\n width: 100%;\n font: inherit;\n border: none;\n background: none;\n color: var(--syn-input-color);\n cursor: inherit;\n overflow: hidden;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n }\n\n .combobox__display-input::placeholder {\n color: var(--syn-input-placeholder-color);\n }\n\n .combobox:not(.combobox--disabled):hover .combobox__display-input {\n color: var(--syn-input-color-hover);\n }\n\n .combobox__display-input:focus {\n outline: none;\n }\n\n .combobox__value-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n }\n\n /* Standard combobox */\n .combobox--standard .combobox__inputs {\n background-color: var(--syn-input-background-color);\n border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n }\n\n .combobox--standard.combobox--disabled .combobox__inputs {\n background-color: var(--syn-input-background-color-disabled);\n border-color: var(--syn-input-border-color-disabled);\n color: var(--syn-input-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n outline: none;\n }\n\n .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,\n .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {\n background-color: var(--syn-input-background-color-focus);\n border-color: var(--syn-input-border-color-focus);\n box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);\n }\n\n/* Sizes */\n .combobox--small .combobox__inputs {\n border-radius: var(--syn-input-border-radius-small);\n font-size: var(--syn-input-font-size-small);\n min-height: var(--syn-input-height-small);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-small);\n }\n\n .combobox--small .combobox__clear {\n margin-inline-start: var(--syn-input-spacing-small);\n }\n\n .combobox--small .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-small);\n }\n\n .combobox--medium .combobox__inputs {\n border-radius: var(--syn-input-border-radius-medium);\n font-size: var(--syn-input-font-size-medium);\n min-height: var(--syn-input-height-medium);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-medium);\n }\n\n .combobox--medium .combobox__clear {\n margin-inline-start: var(--syn-input-spacing-medium);\n }\n\n .combobox--medium .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-medium);\n }\n\n .combobox--large .combobox__inputs {\n border-radius: var(--syn-input-border-radius-large);\n font-size: var(--syn-input-font-size-large);\n min-height: var(--syn-input-height-large);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-large);\n }\n\n .combobox--large .combobox__clear {\n margin-inline-start: var(--syn-input-spacing-large);\n }\n\n .combobox--large .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-large);\n }\n\n
|
|
5
|
-
"mappings": ";AAQA,SAAS,WAAW;AAEpB,IAAO,0BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
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 { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n :host {\n display: block;\n }\n\n /** The popup */\n .combobox {\n flex: 1 1 auto;\n display: inline-flex;\n width: 100%;\n position: relative;\n vertical-align: middle;\n }\n\n .combobox::part(popup) {\n z-index: var(--syn-z-index-dropdown);\n }\n\n .combobox[data-current-placement^='top']::part(popup) {\n transform-origin: bottom;\n }\n\n .combobox[data-current-placement^='bottom']::part(popup) {\n transform-origin: top;\n }\n\n /* Combobox */\n .combobox__inputs {\n flex: 1;\n display: flex;\n width: 100%;\n min-width: 0;\n position: relative;\n align-items: center;\n justify-content: start;\n font-family: var(--syn-input-font-family);\n font-weight: var(--syn-input-font-weight);\n letter-spacing: var(--syn-input-letter-spacing);\n vertical-align: middle;\n overflow: hidden;\n cursor: pointer;\n transition:\n var(--syn-transition-fast) color,\n var(--syn-transition-fast) border,\n var(--syn-transition-fast) box-shadow,\n var(--syn-transition-fast) background-color;\n }\n\n .combobox__display-input {\n position: relative;\n width: 100%;\n font: inherit;\n border: none;\n background: none;\n color: var(--syn-input-color);\n cursor: inherit;\n overflow: hidden;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n }\n\n .combobox__display-input::placeholder {\n color: var(--syn-input-placeholder-color);\n }\n\n .combobox:not(.combobox--disabled):hover .combobox__display-input {\n color: var(--syn-input-color-hover);\n }\n\n .combobox__display-input:focus {\n outline: none;\n }\n\n .combobox__value-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n }\n\n /* Standard combobox */\n .combobox--standard .combobox__inputs {\n background-color: var(--syn-input-background-color);\n border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n }\n\n .combobox--standard.combobox--disabled .combobox__inputs {\n background-color: var(--syn-input-background-color-disabled);\n border-color: var(--syn-input-border-color-disabled);\n color: var(--syn-input-color-disabled);\n opacity: 0.5;\n cursor: not-allowed;\n outline: none;\n }\n\n .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,\n .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {\n background-color: var(--syn-input-background-color-focus);\n border-color: var(--syn-input-border-color-focus);\n box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);\n }\n\n/* Sizes */\n .combobox--small .combobox__inputs {\n border-radius: var(--syn-input-border-radius-small);\n font-size: var(--syn-input-font-size-small);\n min-height: var(--syn-input-height-small);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-small);\n }\n\n .combobox--small .combobox__clear {\n margin-inline-start: var(--syn-input-spacing-small);\n }\n\n .combobox--small .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-small);\n }\n\n .combobox--medium .combobox__inputs {\n border-radius: var(--syn-input-border-radius-medium);\n font-size: var(--syn-input-font-size-medium);\n min-height: var(--syn-input-height-medium);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-medium);\n }\n\n .combobox--medium .combobox__clear {\n margin-inline-start: var(--syn-input-spacing-medium);\n }\n\n .combobox--medium .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-medium);\n }\n\n .combobox--large .combobox__inputs {\n border-radius: var(--syn-input-border-radius-large);\n font-size: var(--syn-input-font-size-large);\n min-height: var(--syn-input-height-large);\n padding-block: 0;\n padding-inline: var(--syn-input-spacing-large);\n }\n\n .combobox--large .combobox__clear {\n margin-inline-start: var(--syn-input-spacing-large);\n }\n\n .combobox--large .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-large);\n }\n\n .combobox--large.combobox--multiple .combobox__prefix::slotted(*) {\n margin-inline-start: var(--syn-input-spacing-large);\n }\n\n/* Prefix and Suffix */\n .combobox__prefix,\n .combobox__suffix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: var(--syn-input-placeholder-color);\n }\n\n .combobox__suffix::slotted(*) {\n margin-inline-start: var(--syn-spacing-small);\n }\n\n /* Clear button */\n .combobox__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: var(--syn-input-icon-color);\n border: none;\n background: none;\n padding: 0;\n transition: var(--syn-transition-fast) color;\n cursor: pointer;\n }\n\n .combobox__clear:hover {\n color: var(--syn-input-icon-color-hover);\n }\n\n .combobox__clear:focus {\n outline: none;\n }\n\n /* Expand icon */\n .combobox__expand-icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n transition: var(--syn-transition-medium) rotate ease;\n rotate: 0;\n margin-inline-start: var(--syn-spacing-small);\n }\n\n .combobox--open .combobox__expand-icon {\n rotate: -180deg;\n }\n\n /* Listbox */\n .combobox__listbox {\n display: block;\n position: relative;\n font-family: var(--syn-font-sans);\n font-size: var(--syn-font-size-medium);\n font-weight: var(--syn-font-weight-normal);\n box-shadow: var(--syn-shadow-large);\n background: var(--syn-panel-background-color);\n border: solid var(--syn-panel-border-width) var(--syn-panel-border-color);\n border-radius: var(--syn-border-radius-medium);\n padding-block: var(--syn-spacing-x-small);\n padding-inline: 0;\n overflow: auto;\n overscroll-behavior: none;\n\n /* Make sure it adheres to the popup's auto size */\n max-width: var(--auto-size-available-width);\n max-height: var(--auto-size-available-height);\n }\n\n .combobox__listbox ::slotted(syn-divider) {\n --spacing: var(--syn-spacing-x-small);\n }\n\n .combobox__listbox ::slotted(small) {\n display: block;\n font-size: var(--syn-font-size-small);\n font-weight: var(--syn-font-weight-semibold);\n color: var(--syn-color-neutral-500);\n padding-block: var(--syn-spacing-2x-small);\n padding-inline: var(--syn-spacing-x-large);\n }\n\n\n /**\n * Invalid user data\n */\n :host([data-user-invalid]) .combobox__inputs {\n border-color: var(--syn-input-border-color-focus-error);\n }\n\n :host([data-user-invalid]) .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,\n :host([data-user-invalid]) .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {\n border-color: var(--syn-input-border-color-focus-error);\n box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-error);\n }\n\n /* Clear button */\n .combobox__clear {\n color: var(--syn-input-icon-icon-clearable-color);\n font-size: var(--syn-spacing-large);\n }\n\n .combobox--small .combobox__clear {\n font-size: var(--syn-spacing-medium);\n }\n\n .combobox--large .combobox__clear {\n font-size: var(--syn-spacing-x-large);\n }\n\n .combobox--medium .combobox__clear {\n margin-inline-start: var(--syn-spacing-small);\n }\n\n /* Expand icon */\n .combobox__expand-icon {\n color: var(--syn-color-neutral-950);\n font-size: var(--syn-spacing-large);\n margin-inline-start: var(--syn-spacing-small);\n }\n\n /* Change combobox border on hover */\n .combobox:not(.combobox--disabled):hover .combobox__inputs {\n border-color: var(--syn-input-color-hover);\n }\n\n /* Prefix and Suffix */\n\n /* Small */\n .combobox--small .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-spacing-x-small);\n }\n\n .combobox--small .combobox__suffix::slotted(*) {\n margin-inline-start: var(--syn-spacing-x-small);\n }\n\n .combobox--medium .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-small);\n }\n\n .combobox--medium .combobox__suffix::slotted(*) {\n margin-inline-start: var(--syn-input-spacing-small);\n }\n\n .combobox--large .combobox__prefix::slotted(*) {\n margin-inline-end: var(--syn-input-spacing-medium);\n }\n\n .combobox--large .combobox__suffix::slotted(*) {\n margin-inline-start: var(--syn-input-spacing-medium);\n }\n\n .combobox__prefix,\n .combobox__suffix {\n color: var(--syn-input-help-text-color);\n }\n\n\n\n /* Listbox */\n .combobox__listbox {\n /* @todo: Should be --syn-border-radius-medium, which should be set to 0 */\n border-radius: var(--syn-border-radius-none);\n box-shadow: var(--syn-shadow-medium);\n }\n\n /**\n * Make sure to hide the syn-divider for the first syn-optgroup\n * Note! ::slotted does currently not work with ::part, so we\n * opted for using a css variable here.\n */\n .combobox__listbox ::slotted(syn-optgroup:first-of-type) {\n --display-divider: none;\n }\n`;\n"],
|
|
5
|
+
"mappings": ";AAQA,SAAS,WAAW;AAEpB,IAAO,0BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynRadioGroup
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.TWSE2CPF.js";
|
|
4
4
|
|
|
5
5
|
// src/components/radio-group/radio-group.ts
|
|
6
6
|
var radio_group_default = SynRadioGroup;
|
|
@@ -9,4 +9,4 @@ SynRadioGroup.define("syn-radio-group");
|
|
|
9
9
|
export {
|
|
10
10
|
radio_group_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.VGWWMT6X.js.map
|
|
@@ -13,7 +13,7 @@ import {
|
|
|
13
13
|
} from "./chunk.5732DMBC.js";
|
|
14
14
|
import {
|
|
15
15
|
SynIconButton
|
|
16
|
-
} from "./chunk.
|
|
16
|
+
} from "./chunk.OBTXUQOH.js";
|
|
17
17
|
import {
|
|
18
18
|
waitForEvent
|
|
19
19
|
} from "./chunk.C2ENQBPM.js";
|
|
@@ -37,7 +37,7 @@ import {
|
|
|
37
37
|
import {
|
|
38
38
|
SynergyElement,
|
|
39
39
|
component_styles_default
|
|
40
|
-
} from "./chunk.
|
|
40
|
+
} from "./chunk.IKOSRIQR.js";
|
|
41
41
|
import {
|
|
42
42
|
__decorateClass
|
|
43
43
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -393,4 +393,4 @@ setDefaultAnimation("drawer.overlay.hide", {
|
|
|
393
393
|
export {
|
|
394
394
|
SynDrawer
|
|
395
395
|
};
|
|
396
|
-
//# sourceMappingURL=chunk.
|
|
396
|
+
//# sourceMappingURL=chunk.WJEFLT2K.js.map
|
|
@@ -23,7 +23,7 @@ import {
|
|
|
23
23
|
import {
|
|
24
24
|
SynergyElement,
|
|
25
25
|
component_styles_default
|
|
26
|
-
} from "./chunk.
|
|
26
|
+
} from "./chunk.IKOSRIQR.js";
|
|
27
27
|
import {
|
|
28
28
|
__decorateClass
|
|
29
29
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -78,9 +78,10 @@ var SynTextarea = class extends SynergyElement {
|
|
|
78
78
|
this.formControlController.updateValidity();
|
|
79
79
|
}
|
|
80
80
|
disconnectedCallback() {
|
|
81
|
+
var _a;
|
|
81
82
|
super.disconnectedCallback();
|
|
82
83
|
if (this.input) {
|
|
83
|
-
this.resizeObserver.unobserve(this.input);
|
|
84
|
+
(_a = this.resizeObserver) == null ? void 0 : _a.unobserve(this.input);
|
|
84
85
|
}
|
|
85
86
|
}
|
|
86
87
|
handleBlur() {
|
|
@@ -360,4 +361,4 @@ __decorateClass([
|
|
|
360
361
|
export {
|
|
361
362
|
SynTextarea
|
|
362
363
|
};
|
|
363
|
-
//# sourceMappingURL=chunk.
|
|
364
|
+
//# sourceMappingURL=chunk.WNDYFXRT.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/components/textarea/textarea.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 './textarea.styles.js';\nimport customStyles from './textarea.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @documentation https://synergy.style/components/textarea\n * @status stable\n * @since 2.0\n *\n * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the input. 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 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 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 textarea - The internal `<textarea>` control.\n */\nexport default class SynTextarea extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [componentStyles, formControlStyles, styles, formControlCustomStyles, customStyles];\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');\n private resizeObserver: ResizeObserver;\n\n @query('.textarea__control') input: HTMLTextAreaElement;\n\n @state() private hasFocus = false;\n @property() title = ''; // make reactive to pass through\n\n /** The name of the textarea, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /** The current value of the textarea, submitted as a name/value pair with form data. */\n @property() value = '';\n\n /** The textarea's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** The textarea's label. If you need to display HTML, use the `label` slot instead. */\n @property() label = '';\n\n /** The textarea's help text. If you need to display HTML, use the `help-text` slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\n\n /** Placeholder text to show as a hint when the input is empty. */\n @property() placeholder = '';\n\n /** The number of rows to display by default. */\n @property({ type: Number }) rows = 4;\n\n /** Controls how the textarea can be resized. */\n @property() resize: 'none' | 'vertical' | 'auto' = 'vertical';\n\n /** Disables the textarea. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Makes the textarea readonly. */\n @property({ type: Boolean, reflect: true }) readonly = 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 textarea a required field. */\n @property({ type: Boolean, reflect: true }) required = false;\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 /** 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: string;\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 textarea. */\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 /** The default value of the form control. Primarily used for resetting the form control. */\n @defaultValue() defaultValue = '';\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 connectedCallback() {\n super.connectedCallback();\n this.resizeObserver = new ResizeObserver(() => this.setTextareaHeight());\n\n this.updateComplete.then(() => {\n this.setTextareaHeight();\n this.resizeObserver.observe(this.input);\n });\n }\n\n firstUpdated() {\n this.formControlController.updateValidity();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this.input) {\n this.resizeObserver?.unobserve(this.input);\n }\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleChange() {\n this.value = this.input.value;\n this.setTextareaHeight();\n this.emit('syn-change');\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.emit('syn-input');\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private setTextareaHeight() {\n if (this.resize === 'auto') {\n this.input.style.height = 'auto';\n this.input.style.height = `${this.input.scrollHeight}px`;\n } else {\n (this.input.style.height as string | undefined) = undefined;\n }\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('rows', { waitUntilFirstUpdate: true })\n handleRowsChange() {\n this.setTextareaHeight();\n }\n\n @watch('value', { waitUntilFirstUpdate: true })\n async handleValueChange() {\n await this.updateComplete;\n this.formControlController.updateValidity();\n this.setTextareaHeight();\n }\n\n /** Sets focus on the textarea. */\n focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the textarea. */\n blur() {\n this.input.blur();\n }\n\n /** Selects all the text in the textarea. */\n select() {\n this.input.select();\n }\n\n /** Gets or sets the textarea's scroll position. */\n scrollPosition(position?: { top?: number; left?: number }): { top: number; left: number } | undefined {\n if (position) {\n if (typeof position.top === 'number') this.input.scrollTop = position.top;\n if (typeof position.left === 'number') this.input.scrollLeft = position.left;\n return undefined;\n }\n\n return {\n top: this.input.scrollTop,\n left: this.input.scrollTop\n };\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 this.setTextareaHeight();\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 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--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 })}\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 textarea: true,\n 'textarea--small': this.size === 'small',\n 'textarea--medium': this.size === 'medium',\n 'textarea--large': this.size === 'large',\n 'textarea--standard': !this.readonly,\n 'textarea--readonly': this.readonly,\n 'textarea--disabled': this.disabled,\n 'textarea--focused': this.hasFocus,\n 'textarea--empty': !this.value,\n 'textarea--resize-none': this.resize === 'none',\n 'textarea--resize-vertical': this.resize === 'vertical',\n 'textarea--resize-auto': this.resize === 'auto'\n })}\n >\n <textarea\n part=\"textarea\"\n id=\"input\"\n class=\"textarea__control\"\n title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n name=${ifDefined(this.name)}\n .value=${live(this.value)}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n placeholder=${ifDefined(this.placeholder)}\n rows=${ifDefined(this.rows)}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n autocapitalize=${ifDefined(this.autocapitalize)}\n autocorrect=${ifDefined(this.autocorrect)}\n ?autofocus=${this.autofocus}\n spellcheck=${ifDefined(this.spellcheck)}\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 @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n ></textarea>\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynSpinner
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.JI7DAHVB.js";
|
|
4
4
|
import {
|
|
5
5
|
FormControlController,
|
|
6
6
|
validValidityState
|
|
@@ -17,7 +17,7 @@ import {
|
|
|
17
17
|
} from "./chunk.WVVQK5TE.js";
|
|
18
18
|
import {
|
|
19
19
|
SynIcon
|
|
20
|
-
} from "./chunk.
|
|
20
|
+
} from "./chunk.562KEWJB.js";
|
|
21
21
|
import {
|
|
22
22
|
LocalizeController
|
|
23
23
|
} from "./chunk.GIU3H3J3.js";
|
|
@@ -27,7 +27,7 @@ import {
|
|
|
27
27
|
import {
|
|
28
28
|
SynergyElement,
|
|
29
29
|
component_styles_default
|
|
30
|
-
} from "./chunk.
|
|
30
|
+
} from "./chunk.IKOSRIQR.js";
|
|
31
31
|
import {
|
|
32
32
|
__decorateClass
|
|
33
33
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -182,7 +182,7 @@ var SynButton = class extends SynergyElement {
|
|
|
182
182
|
title=${this.title}
|
|
183
183
|
name=${ifDefined(isLink ? void 0 : this.name)}
|
|
184
184
|
value=${ifDefined(isLink ? void 0 : this.value)}
|
|
185
|
-
href=${ifDefined(isLink ? this.href : void 0)}
|
|
185
|
+
href=${ifDefined(isLink && !this.disabled ? this.href : void 0)}
|
|
186
186
|
target=${ifDefined(isLink ? this.target : void 0)}
|
|
187
187
|
download=${ifDefined(isLink ? this.download : void 0)}
|
|
188
188
|
rel=${ifDefined(isLink ? this.rel : void 0)}
|
|
@@ -287,4 +287,4 @@ __decorateClass([
|
|
|
287
287
|
export {
|
|
288
288
|
SynButton
|
|
289
289
|
};
|
|
290
|
-
//# sourceMappingURL=chunk.
|
|
290
|
+
//# sourceMappingURL=chunk.X3UJK6BA.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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.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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
|
|
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
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynRange
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.YBDLRGEB.js";
|
|
4
4
|
|
|
5
5
|
// src/components/range/range.ts
|
|
6
6
|
var range_default = SynRange;
|
|
@@ -9,4 +9,4 @@ SynRange.define("syn-range");
|
|
|
9
9
|
export {
|
|
10
10
|
range_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.X726K7GO.js.map
|
|
@@ -227,9 +227,27 @@ var tab_group_custom_styles_default = css`
|
|
|
227
227
|
border-bottom: none;
|
|
228
228
|
border-top: solid var(--track-width) var(--track-color);
|
|
229
229
|
}
|
|
230
|
+
|
|
231
|
+
/**
|
|
232
|
+
* Shoelace 2.17 introduced a new attribute "fixed-scroll-controls".
|
|
233
|
+
* Per default, tab-groups now hide the scroll buttons when they are not needed.
|
|
234
|
+
* "fixed-scroll-controls" will keep the scroll buttons visible at all times,
|
|
235
|
+
* which is the default behavior of Synergy.
|
|
236
|
+
* For this reason, we make the buttons visible by default, but show them in a "disabled" state when they are not needed.
|
|
237
|
+
*/
|
|
238
|
+
.tab-group--has-scroll-controls .tab-group__scroll-button--start--hidden,
|
|
239
|
+
.tab-group--has-scroll-controls .tab-group__scroll-button--end--hidden {
|
|
240
|
+
visibility: visible;
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
.tab-group--has-scroll-controls .tab-group__scroll-button--start--hidden::part(base),
|
|
244
|
+
.tab-group--has-scroll-controls .tab-group__scroll-button--end--hidden::part(base) {
|
|
245
|
+
opacity: var(--syn-input-disabled-opacity);
|
|
246
|
+
pointer-events: none;
|
|
247
|
+
}
|
|
230
248
|
`;
|
|
231
249
|
|
|
232
250
|
export {
|
|
233
251
|
tab_group_custom_styles_default
|
|
234
252
|
};
|
|
235
|
-
//# sourceMappingURL=chunk.
|
|
253
|
+
//# sourceMappingURL=chunk.XOXVVU5C.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/tab-group/tab-group.custom.styles.ts"],
|
|
4
|
-
"sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n /* stylelint-disable no-descending-specificity */\n /* Write custom CSS here */\n :host {\n --track-width: var(--syn-border-width-small);\n --track-color: var(--syn-color-neutral-300);\n --indicator-width: var(--syn-border-width-x-large);\n }\n\n /* we need to augment the size of the height of the tab-group__nav to make the focus outline and the hiding white border visible of the tab because of overflow-x value */\n .tab-group--top .tab-group__body {\n position: relative;\n top: calc(-1 * var(--syn-panel-border-width));\n }\n\n .tab-group--top .tab-group__nav {\n padding: 0 0 var(--syn-panel-border-width) 0;\n }\n\n /**\n * Indicator\n */\n .tab-group--top .tab-group__indicator {\n border-bottom: solid var(--indicator-width) var(--indicator-color);\n bottom: 0;\n }\n\n .tab-group--start .tab-group__indicator {\n border-right: solid var(--indicator-width) var(--indicator-color);\n right: 0;\n }\n\n .tab-group--start.tab-group--rtl .tab-group__indicator {\n left: 0;\n }\n\n .tab-group--end .tab-group__indicator {\n border-inline-start: solid var(--indicator-width) var(--indicator-color);\n left: 0;\n }\n\n .tab-group--end.tab-group--rtl .tab-group__indicator {\n right: 0;\n }\n\n /**\n * Panel\n */\n .tab-group--top ::slotted(syn-tab-panel) {\n --padding: var(--syn-spacing-large) 0;\n }\n\n .tab-group--start ::slotted(syn-tab-panel) {\n --padding: 0 var(--syn-spacing-large);\n }\n\n .tab-group--end ::slotted(syn-tab-panel) {\n --padding: 0 var(--syn-spacing-large);\n }\n\n /**\n * Contained styling\n */ \n .tab-group--contained .tab-group__tabs {\n border: none;\n }\n\n .tab-group--contained ::slotted(syn-tab-panel) {\n --padding: var(--syn-spacing-large);\n\n background-color: var(--syn-panel-background-color);\n border: var(--syn-panel-border-width) solid var(--syn-panel-border-color);\n border-radius: var(--syn-border-radius-medium);\n }\n\n /* Stretch the tab panel container for non-top placements, otherwise the borders are not drawn correctly */\n .tab-group--contained:not(.tab-group--top) ::slotted(syn-tab-panel) {\n height: 100%;\n }\n\n /* Draw the correct border radii of the panel depending on the placement and direction */\n .tab-group--top.tab-group--contained:not(.tab-group--sharp):not(.tab-group--has-scroll-controls) ::slotted(syn-tab-panel:first-of-type),\n .tab-group--start.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:first-of-type) {\n border-start-start-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--start.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:last-of-type) {\n border-end-start-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--end.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:last-of-type) {\n border-end-end-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--end.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:first-of-type) {\n border-start-end-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--contained .tab-group__indicator {\n /* Remove the animation of the indicator */\n transition: none;\n \n /* Needed, otherwise the indicator is hidden under the background of the tab */\n z-index: 2;\n }\n\n /* Contained styling for tabs */\n .tab-group--contained ::slotted(syn-tab) {\n --background-color: var(--syn-panel-background-color);\n --border-width: var(--syn-panel-border-width);\n\n position: relative;\n z-index: 1;\n }\n\n /* Top */\n .tab-group--top.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab) {\n --border-radius: var(--syn-border-radius-medium) var(--syn-border-radius-medium) var(--syn-border-radius-none) var(--syn-border-radius-none);\n }\n\n .tab-group--top.tab-group--contained ::slotted(syn-tab[active]) {\n --border-color: var(--syn-panel-border-color) var(--syn-panel-border-color) var(--syn-panel-background-color);\n\n /* We need to move the tab down, so the bottom border, hides parts of the border of the tab-group */\n top: var(--syn-panel-border-width);\n }\n\n .tab-group--top.tab-group--contained ::slotted(syn-tab:not([active])) {\n /* We need to move down the non-active tabs also, so we don't get jumping of the tab text content */\n top: var(--syn-panel-border-width);\n }\n\n /* Start & End with rtl */\n .tab-group--start.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab),\n .tab-group--end.tab-group--rtl.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab) {\n --border-radius: var(--syn-border-radius-medium) var(--syn-border-radius-none) var(--syn-border-radius-none) var(--syn-border-radius-medium);\n }\n\n .tab-group--start.tab-group--contained ::slotted(syn-tab[active]),\n .tab-group--end.tab-group--rtl.tab-group--contained ::slotted(syn-tab[active]) {\n --border-color: var(--syn-panel-border-color) var(--syn-panel-background-color) var(--syn-panel-border-color) var(--syn-panel-border-color) ;\n\n /* We need to move the tab right, so the right border, hides parts of the border of the tab-group */\n left: var(--syn-panel-border-width);\n right: unset;\n }\n\n .tab-group--start.tab-group--contained ::slotted(syn-tab:not([active])),\n .tab-group--end.tab-group--rtl.tab-group--contained ::slotted(syn-tab:not([active])) {\n /* We need to move right the non-active tabs also, so we don't get jumping of the tab text content */\n left: var(--syn-panel-border-width);\n right: unset;\n }\n\n /* End & Start with rtl */\n .tab-group--end.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab),\n .tab-group--start.tab-group--rtl.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab) {\n --border-radius: var(--syn-border-radius-none) var(--syn-border-radius-medium) var(--syn-border-radius-medium) var(--syn-border-radius-none);\n }\n\n .tab-group--end.tab-group--contained ::slotted(syn-tab[active]),\n .tab-group--start.tab-group--rtl.tab-group--contained ::slotted(syn-tab[active]) {\n --border-color: var(--syn-panel-border-color) var(--syn-panel-border-color) var(--syn-panel-border-color) var(--syn-panel-background-color);\n\n /* We need to move the tab left, so the left border, hides parts of the border of the tab-group */\n left: unset;\n right: var(--syn-panel-border-width);\n }\n\n .tab-group--end.tab-group--contained ::slotted(syn-tab:not([active])),\n .tab-group--start.tab-group--rtl.tab-group--contained ::slotted(syn-tab:not([active])) {\n /* We need to move left the non-active tabs also, so we don't get jumping of the tab text content */\n left: unset;\n right: var(--syn-panel-border-width);\n }\n\n\n /**\n * Sharp styling\n */\n .tab-group--sharp ::slotted(syn-tab-panel) {\n border-radius: var(--syn-border-radius-none);\n }\n\n\n /**\n * Scroll buttons\n */\n .tab-group--has-scroll-controls .tab-group__nav-container {\n padding: 0 calc(var(--syn-spacing-x-large) + var( --syn-spacing-2x-small));\n }\n\n .tab-group__scroll-button {\n /* we need to move the scroll buttons to the top, to align the borders with the border of the tab-group--nav */\n bottom: var(--syn-panel-border-width);\n color: var(--syn-color-neutral-950);\n font-size: var(--syn-font-size-medium);\n width: calc(var(--syn-spacing-x-large) + var( --syn-spacing-2x-small));\n }\n\n .tab-group__scroll-button::part(base) {\n padding: calc(var(--syn-spacing-small) - var(--syn-spacing-3x-small));\n }\n\n /* Make sure the direction of the chevrons match the scrolling directions. */\n .tab-group--has-scroll-controls:not(.tab-group--rtl) .tab-group__scroll-button--start,\n .tab-group--rtl .tab-group__scroll-button--end {\n rotate: 180deg;\n }\n\n .tab-group--has-scroll-controls:not(.tab-group--contained) .tab-group__scroll-button--start {\n border-top: solid var(--track-width) var(--track-color);\n }\n\n .tab-group--has-scroll-controls:not(.tab-group--contained) .tab-group__scroll-button--end {\n border-bottom: solid var(--track-width) var(--track-color);\n }\n\n .tab-group--rtl:not(.tab-group--contained) .tab-group__scroll-button--start {\n border-bottom: solid var(--track-width) var(--track-color);\n border-top: none;\n }\n\n .tab-group--rtl:not(.tab-group--contained) .tab-group__scroll-button--end {\n border-bottom: none;\n border-top: solid var(--track-width) var(--track-color);\n }\n`;\n"],
|
|
5
|
-
"mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,kCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
4
|
+
"sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n /* stylelint-disable no-descending-specificity */\n /* Write custom CSS here */\n :host {\n --track-width: var(--syn-border-width-small);\n --track-color: var(--syn-color-neutral-300);\n --indicator-width: var(--syn-border-width-x-large);\n }\n\n /* we need to augment the size of the height of the tab-group__nav to make the focus outline and the hiding white border visible of the tab because of overflow-x value */\n .tab-group--top .tab-group__body {\n position: relative;\n top: calc(-1 * var(--syn-panel-border-width));\n }\n\n .tab-group--top .tab-group__nav {\n padding: 0 0 var(--syn-panel-border-width) 0;\n }\n\n /**\n * Indicator\n */\n .tab-group--top .tab-group__indicator {\n border-bottom: solid var(--indicator-width) var(--indicator-color);\n bottom: 0;\n }\n\n .tab-group--start .tab-group__indicator {\n border-right: solid var(--indicator-width) var(--indicator-color);\n right: 0;\n }\n\n .tab-group--start.tab-group--rtl .tab-group__indicator {\n left: 0;\n }\n\n .tab-group--end .tab-group__indicator {\n border-inline-start: solid var(--indicator-width) var(--indicator-color);\n left: 0;\n }\n\n .tab-group--end.tab-group--rtl .tab-group__indicator {\n right: 0;\n }\n\n /**\n * Panel\n */\n .tab-group--top ::slotted(syn-tab-panel) {\n --padding: var(--syn-spacing-large) 0;\n }\n\n .tab-group--start ::slotted(syn-tab-panel) {\n --padding: 0 var(--syn-spacing-large);\n }\n\n .tab-group--end ::slotted(syn-tab-panel) {\n --padding: 0 var(--syn-spacing-large);\n }\n\n /**\n * Contained styling\n */ \n .tab-group--contained .tab-group__tabs {\n border: none;\n }\n\n .tab-group--contained ::slotted(syn-tab-panel) {\n --padding: var(--syn-spacing-large);\n\n background-color: var(--syn-panel-background-color);\n border: var(--syn-panel-border-width) solid var(--syn-panel-border-color);\n border-radius: var(--syn-border-radius-medium);\n }\n\n /* Stretch the tab panel container for non-top placements, otherwise the borders are not drawn correctly */\n .tab-group--contained:not(.tab-group--top) ::slotted(syn-tab-panel) {\n height: 100%;\n }\n\n /* Draw the correct border radii of the panel depending on the placement and direction */\n .tab-group--top.tab-group--contained:not(.tab-group--sharp):not(.tab-group--has-scroll-controls) ::slotted(syn-tab-panel:first-of-type),\n .tab-group--start.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:first-of-type) {\n border-start-start-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--start.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:last-of-type) {\n border-end-start-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--end.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:last-of-type) {\n border-end-end-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--end.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab-panel:first-of-type) {\n border-start-end-radius: var(--syn-border-radius-none);\n }\n\n .tab-group--contained .tab-group__indicator {\n /* Remove the animation of the indicator */\n transition: none;\n \n /* Needed, otherwise the indicator is hidden under the background of the tab */\n z-index: 2;\n }\n\n /* Contained styling for tabs */\n .tab-group--contained ::slotted(syn-tab) {\n --background-color: var(--syn-panel-background-color);\n --border-width: var(--syn-panel-border-width);\n\n position: relative;\n z-index: 1;\n }\n\n /* Top */\n .tab-group--top.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab) {\n --border-radius: var(--syn-border-radius-medium) var(--syn-border-radius-medium) var(--syn-border-radius-none) var(--syn-border-radius-none);\n }\n\n .tab-group--top.tab-group--contained ::slotted(syn-tab[active]) {\n --border-color: var(--syn-panel-border-color) var(--syn-panel-border-color) var(--syn-panel-background-color);\n\n /* We need to move the tab down, so the bottom border, hides parts of the border of the tab-group */\n top: var(--syn-panel-border-width);\n }\n\n .tab-group--top.tab-group--contained ::slotted(syn-tab:not([active])) {\n /* We need to move down the non-active tabs also, so we don't get jumping of the tab text content */\n top: var(--syn-panel-border-width);\n }\n\n /* Start & End with rtl */\n .tab-group--start.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab),\n .tab-group--end.tab-group--rtl.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab) {\n --border-radius: var(--syn-border-radius-medium) var(--syn-border-radius-none) var(--syn-border-radius-none) var(--syn-border-radius-medium);\n }\n\n .tab-group--start.tab-group--contained ::slotted(syn-tab[active]),\n .tab-group--end.tab-group--rtl.tab-group--contained ::slotted(syn-tab[active]) {\n --border-color: var(--syn-panel-border-color) var(--syn-panel-background-color) var(--syn-panel-border-color) var(--syn-panel-border-color) ;\n\n /* We need to move the tab right, so the right border, hides parts of the border of the tab-group */\n left: var(--syn-panel-border-width);\n right: unset;\n }\n\n .tab-group--start.tab-group--contained ::slotted(syn-tab:not([active])),\n .tab-group--end.tab-group--rtl.tab-group--contained ::slotted(syn-tab:not([active])) {\n /* We need to move right the non-active tabs also, so we don't get jumping of the tab text content */\n left: var(--syn-panel-border-width);\n right: unset;\n }\n\n /* End & Start with rtl */\n .tab-group--end.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab),\n .tab-group--start.tab-group--rtl.tab-group--contained:not(.tab-group--sharp) ::slotted(syn-tab) {\n --border-radius: var(--syn-border-radius-none) var(--syn-border-radius-medium) var(--syn-border-radius-medium) var(--syn-border-radius-none);\n }\n\n .tab-group--end.tab-group--contained ::slotted(syn-tab[active]),\n .tab-group--start.tab-group--rtl.tab-group--contained ::slotted(syn-tab[active]) {\n --border-color: var(--syn-panel-border-color) var(--syn-panel-border-color) var(--syn-panel-border-color) var(--syn-panel-background-color);\n\n /* We need to move the tab left, so the left border, hides parts of the border of the tab-group */\n left: unset;\n right: var(--syn-panel-border-width);\n }\n\n .tab-group--end.tab-group--contained ::slotted(syn-tab:not([active])),\n .tab-group--start.tab-group--rtl.tab-group--contained ::slotted(syn-tab:not([active])) {\n /* We need to move left the non-active tabs also, so we don't get jumping of the tab text content */\n left: unset;\n right: var(--syn-panel-border-width);\n }\n\n\n /**\n * Sharp styling\n */\n .tab-group--sharp ::slotted(syn-tab-panel) {\n border-radius: var(--syn-border-radius-none);\n }\n\n\n /**\n * Scroll buttons\n */\n .tab-group--has-scroll-controls .tab-group__nav-container {\n padding: 0 calc(var(--syn-spacing-x-large) + var( --syn-spacing-2x-small));\n }\n\n .tab-group__scroll-button {\n /* we need to move the scroll buttons to the top, to align the borders with the border of the tab-group--nav */\n bottom: var(--syn-panel-border-width);\n color: var(--syn-color-neutral-950);\n font-size: var(--syn-font-size-medium);\n width: calc(var(--syn-spacing-x-large) + var( --syn-spacing-2x-small));\n }\n\n .tab-group__scroll-button::part(base) {\n padding: calc(var(--syn-spacing-small) - var(--syn-spacing-3x-small));\n }\n\n /* Make sure the direction of the chevrons match the scrolling directions. */\n .tab-group--has-scroll-controls:not(.tab-group--rtl) .tab-group__scroll-button--start,\n .tab-group--rtl .tab-group__scroll-button--end {\n rotate: 180deg;\n }\n\n .tab-group--has-scroll-controls:not(.tab-group--contained) .tab-group__scroll-button--start {\n border-top: solid var(--track-width) var(--track-color);\n }\n\n .tab-group--has-scroll-controls:not(.tab-group--contained) .tab-group__scroll-button--end {\n border-bottom: solid var(--track-width) var(--track-color);\n }\n\n .tab-group--rtl:not(.tab-group--contained) .tab-group__scroll-button--start {\n border-bottom: solid var(--track-width) var(--track-color);\n border-top: none;\n }\n\n .tab-group--rtl:not(.tab-group--contained) .tab-group__scroll-button--end {\n border-bottom: none;\n border-top: solid var(--track-width) var(--track-color);\n }\n\n /**\n * Shoelace 2.17 introduced a new attribute \"fixed-scroll-controls\".\n * Per default, tab-groups now hide the scroll buttons when they are not needed.\n * \"fixed-scroll-controls\" will keep the scroll buttons visible at all times,\n * which is the default behavior of Synergy.\n * For this reason, we make the buttons visible by default, but show them in a \"disabled\" state when they are not needed.\n */\n .tab-group--has-scroll-controls .tab-group__scroll-button--start--hidden,\n .tab-group--has-scroll-controls .tab-group__scroll-button--end--hidden {\n visibility: visible;\n }\n\n .tab-group--has-scroll-controls .tab-group__scroll-button--start--hidden::part(base),\n .tab-group--has-scroll-controls .tab-group__scroll-button--end--hidden::part(base) {\n opacity: var(--syn-input-disabled-opacity);\n pointer-events: none;\n }\n`;\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,kCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -6,14 +6,14 @@ import {
|
|
|
6
6
|
} from "./chunk.EHSNF4SS.js";
|
|
7
7
|
import {
|
|
8
8
|
SynIcon
|
|
9
|
-
} from "./chunk.
|
|
9
|
+
} from "./chunk.562KEWJB.js";
|
|
10
10
|
import {
|
|
11
11
|
watch
|
|
12
12
|
} from "./chunk.74IOULXM.js";
|
|
13
13
|
import {
|
|
14
14
|
SynergyElement,
|
|
15
15
|
component_styles_default
|
|
16
|
-
} from "./chunk.
|
|
16
|
+
} from "./chunk.IKOSRIQR.js";
|
|
17
17
|
import {
|
|
18
18
|
__decorateClass
|
|
19
19
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -112,4 +112,4 @@ __decorateClass([
|
|
|
112
112
|
export {
|
|
113
113
|
SynRadio
|
|
114
114
|
};
|
|
115
|
-
//# sourceMappingURL=chunk.
|
|
115
|
+
//# sourceMappingURL=chunk.XPIZMD2N.js.map
|
|
@@ -10,7 +10,7 @@ import {
|
|
|
10
10
|
import {
|
|
11
11
|
SynergyElement,
|
|
12
12
|
component_styles_default
|
|
13
|
-
} from "./chunk.
|
|
13
|
+
} from "./chunk.IKOSRIQR.js";
|
|
14
14
|
import {
|
|
15
15
|
__decorateClass
|
|
16
16
|
} from "./chunk.2GFK6XTO.js";
|
|
@@ -58,4 +58,4 @@ __decorateClass([
|
|
|
58
58
|
export {
|
|
59
59
|
SynBadge
|
|
60
60
|
};
|
|
61
|
-
//# sourceMappingURL=chunk.
|
|
61
|
+
//# sourceMappingURL=chunk.XR42LWNN.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynPopup
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.DPSKWKTR.js";
|
|
4
4
|
|
|
5
5
|
// src/components/popup/popup.ts
|
|
6
6
|
var popup_default = SynPopup;
|
|
@@ -9,4 +9,4 @@ SynPopup.define("syn-popup");
|
|
|
9
9
|
export {
|
|
10
10
|
popup_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.Y33WE5JP.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynTooltip
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.53SVGYMQ.js";
|
|
4
4
|
import {
|
|
5
5
|
range_styles_default
|
|
6
6
|
} from "./chunk.277APOW3.js";
|
|
@@ -30,7 +30,7 @@ import {
|
|
|
30
30
|
import {
|
|
31
31
|
SynergyElement,
|
|
32
32
|
component_styles_default
|
|
33
|
-
} from "./chunk.
|
|
33
|
+
} from "./chunk.IKOSRIQR.js";
|
|
34
34
|
import {
|
|
35
35
|
__decorateClass,
|
|
36
36
|
__privateAdd,
|
|
@@ -633,4 +633,4 @@ __decorateClass([
|
|
|
633
633
|
export {
|
|
634
634
|
SynRange
|
|
635
635
|
};
|
|
636
|
-
//# sourceMappingURL=chunk.
|
|
636
|
+
//# sourceMappingURL=chunk.YBDLRGEB.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynTabGroup
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.BKZ45UEY.js";
|
|
4
4
|
|
|
5
5
|
// src/components/tab-group/tab-group.ts
|
|
6
6
|
var tab_group_default = SynTabGroup;
|
|
@@ -9,4 +9,4 @@ SynTabGroup.define("syn-tab-group");
|
|
|
9
9
|
export {
|
|
10
10
|
tab_group_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.YRZPHAZZ.js.map
|