@synergy-design-system/components 2.19.3 → 2.20.0-settings.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.Z463JNSB.js → chunk.24C4XJAI.js} +9 -3
- package/dist/chunks/chunk.24C4XJAI.js.map +7 -0
- package/dist/chunks/{chunk.ZJF7NESZ.js → chunk.24DN2XDS.js} +13 -7
- package/dist/chunks/chunk.24DN2XDS.js.map +7 -0
- package/dist/chunks/{chunk.M4CVCPA7.js → chunk.2QFNK7XL.js} +2 -2
- package/dist/chunks/{chunk.T2TZJ6RL.js → chunk.3HW4J22U.js} +5 -5
- package/dist/chunks/{chunk.O353RCGZ.js → chunk.4AKA2QRO.js} +2 -2
- package/dist/chunks/{chunk.2Z4KRXQR.js → chunk.4ZPJSGD5.js} +2 -2
- package/dist/chunks/{chunk.KUHEM2HU.js → chunk.53THUSDO.js} +2 -2
- package/dist/chunks/{chunk.JZ54BAZN.js → chunk.742PBV5R.js} +13 -7
- package/dist/chunks/chunk.742PBV5R.js.map +7 -0
- package/dist/chunks/{chunk.JXFOMI34.js → chunk.7467Z6PG.js} +2 -2
- package/dist/chunks/{chunk.FDXNWNID.js → chunk.7EYHNKMM.js} +3 -3
- package/dist/chunks/{chunk.3CBZSMFD.js → chunk.7LASULTQ.js} +2 -2
- package/dist/chunks/{chunk.BJI3TUDD.js → chunk.7NZ7JAEV.js} +2 -2
- package/dist/chunks/{chunk.A5SZJGAY.js → chunk.7XMTQ7P7.js} +3 -3
- package/dist/chunks/{chunk.WMWANLUG.js → chunk.7Y7O45CM.js} +8 -2
- package/dist/chunks/chunk.7Y7O45CM.js.map +7 -0
- package/dist/chunks/{chunk.5BPFEOW3.js → chunk.A2JLMFJ4.js} +2 -2
- package/dist/chunks/{chunk.WCA3YMN7.js → chunk.AIQ3EJZY.js} +8 -2
- package/dist/chunks/chunk.AIQ3EJZY.js.map +7 -0
- package/dist/chunks/{chunk.GSWYXK3F.js → chunk.AQS4YK7Q.js} +2 -2
- package/dist/chunks/{chunk.CKX7E6DW.js → chunk.AS3TB27D.js} +6 -6
- package/dist/chunks/{chunk.E6TS35BF.js → chunk.B2WOBIWW.js} +2 -2
- package/dist/chunks/{chunk.RJTTUG4P.js → chunk.BA7XLIED.js} +9 -3
- package/dist/chunks/{chunk.RJTTUG4P.js.map → chunk.BA7XLIED.js.map} +2 -2
- package/dist/chunks/{chunk.KCEUZKGJ.js → chunk.BJTRYICX.js} +2 -2
- package/dist/chunks/{chunk.CHXBQL3V.js → chunk.BO7VIZR3.js} +14 -8
- package/dist/chunks/chunk.BO7VIZR3.js.map +7 -0
- package/dist/chunks/{chunk.UD2SVXHT.js → chunk.BPZOCAHJ.js} +2 -2
- package/dist/chunks/{chunk.CMORZHVE.js → chunk.BWESHYBN.js} +2 -2
- package/dist/chunks/{chunk.Y5LNS47Z.js → chunk.DERBT2MN.js} +14 -8
- package/dist/chunks/chunk.DERBT2MN.js.map +7 -0
- package/dist/chunks/{chunk.R7UQZGOB.js → chunk.DYUCTKM6.js} +2 -2
- package/dist/chunks/{chunk.AVEHVAVI.js → chunk.E72GLNXI.js} +2 -2
- package/dist/chunks/{chunk.442H67H2.js → chunk.EBYGA33B.js} +2 -2
- package/dist/chunks/{chunk.KYW2PJQJ.js → chunk.EMGPXY5T.js} +2 -2
- package/dist/chunks/{chunk.TATHCQUC.js → chunk.EMU2E2VE.js} +9 -3
- package/dist/chunks/{chunk.TATHCQUC.js.map → chunk.EMU2E2VE.js.map} +2 -2
- package/dist/chunks/{chunk.MPJHH2MY.js → chunk.EVECGQOP.js} +10 -4
- package/dist/chunks/chunk.EVECGQOP.js.map +7 -0
- package/dist/chunks/{chunk.KQKYLYB5.js → chunk.FAREQGAK.js} +2 -2
- package/dist/chunks/{chunk.WQTGLVFD.js → chunk.FLB37Q2Y.js} +6 -6
- package/dist/chunks/{chunk.7C65TMZT.js → chunk.HCMNEIRN.js} +6 -6
- package/dist/chunks/{chunk.XWYGFKWO.js → chunk.HNVPPNYZ.js} +2 -2
- package/dist/chunks/{chunk.F7L6D6XY.js → chunk.HPQBH3O2.js} +2 -2
- package/dist/chunks/{chunk.DYAGSNTK.js → chunk.HZ3S4J3T.js} +2 -2
- package/dist/chunks/{chunk.NM5ZFEE5.js → chunk.IBQDKFYH.js} +7 -7
- package/dist/chunks/{chunk.Z4WZ7MIE.js → chunk.IFWSRMUK.js} +2 -2
- package/dist/chunks/{chunk.TVERPVR4.js → chunk.J53UXHXV.js} +2 -2
- package/dist/chunks/{chunk.S3JJZL3O.js → chunk.JBLFNOCX.js} +16 -10
- package/dist/chunks/chunk.JBLFNOCX.js.map +7 -0
- package/dist/chunks/{chunk.WSJXYSXY.js → chunk.JHPSR3AP.js} +2 -2
- package/dist/chunks/{chunk.SAH3XRAD.js → chunk.JNAG6IBY.js} +2 -2
- package/dist/chunks/chunk.JSEL4YPW.js +147 -0
- package/dist/chunks/chunk.JSEL4YPW.js.map +7 -0
- package/dist/chunks/{chunk.6WYS7WDW.js → chunk.LHNUNBCA.js} +2 -2
- package/dist/chunks/{chunk.YA4ZNSNS.js → chunk.LYMHXGME.js} +2 -2
- package/dist/chunks/{chunk.SMRWRBBB.js → chunk.LYNLLR54.js} +9 -9
- package/dist/chunks/{chunk.JGZ2DM63.js → chunk.LZ27X5R6.js} +2 -2
- package/dist/chunks/{chunk.O3D7AIEY.js → chunk.MDG7KZFO.js} +2 -2
- package/dist/chunks/{chunk.AEYAHBYW.js → chunk.MGET4VXP.js} +2 -2
- package/dist/chunks/{chunk.UUSZZYBI.js → chunk.MKQXTHWU.js} +2 -2
- package/dist/chunks/{chunk.UUSZZYBI.js.map → chunk.MKQXTHWU.js.map} +1 -1
- package/dist/chunks/{chunk.CZDXNQOI.js → chunk.N54SVWTA.js} +2 -2
- package/dist/chunks/{chunk.4SALHO5R.js → chunk.NL4FKYIJ.js} +2 -2
- package/dist/chunks/{chunk.WJWII3OP.js → chunk.NM5EI7ZH.js} +2 -2
- package/dist/chunks/{chunk.3CZBIEJQ.js → chunk.NN73HBIU.js} +6 -6
- package/dist/chunks/{chunk.DRWE6CQ2.js → chunk.NUCBTPTS.js} +14 -8
- package/dist/chunks/chunk.NUCBTPTS.js.map +7 -0
- package/dist/chunks/{chunk.O45X5N4K.js → chunk.O7JPMKUW.js} +14 -8
- package/dist/chunks/chunk.O7JPMKUW.js.map +7 -0
- package/dist/chunks/{chunk.54OV4Y3P.js → chunk.OFA3YJLS.js} +2 -2
- package/dist/chunks/chunk.OLCT57R5.js +69 -0
- package/dist/chunks/chunk.OLCT57R5.js.map +7 -0
- package/dist/chunks/{chunk.ZA44ZRKT.js → chunk.P5XIUYNV.js} +2 -2
- package/dist/chunks/{chunk.762BUPQP.js → chunk.PDAOZ7HN.js} +2 -2
- package/dist/chunks/{chunk.ODBT7EDN.js → chunk.PLSOGFSX.js} +2 -2
- package/dist/chunks/{chunk.RR3NOQXW.js → chunk.Q33XUREM.js} +2 -2
- package/dist/chunks/{chunk.EFBKBI5I.js → chunk.QMVBPAZF.js} +2 -2
- package/dist/chunks/{chunk.T2IZ4JC5.js → chunk.QWMAKCAT.js} +2 -2
- package/dist/chunks/{chunk.OH3XIKJC.js → chunk.R2HFUCJI.js} +24 -18
- package/dist/chunks/chunk.R2HFUCJI.js.map +7 -0
- package/dist/chunks/chunk.RSCUHBW3.js +1 -0
- package/dist/chunks/chunk.RSCUHBW3.js.map +7 -0
- package/dist/chunks/{chunk.26PAD6S5.js → chunk.S7PAQRVY.js} +7 -7
- package/dist/chunks/{chunk.3GWNIY5V.js → chunk.SKA5Y7HA.js} +3 -3
- package/dist/chunks/{chunk.VKKATLHB.js → chunk.SNHVIH7F.js} +2 -2
- package/dist/chunks/{chunk.U627OKOV.js → chunk.ST3V3ZVP.js} +2 -2
- package/dist/chunks/{chunk.JM2MZ7RR.js → chunk.SWUXKALS.js} +2 -2
- package/dist/chunks/{chunk.HTQBFNY7.js → chunk.SXFIFBVM.js} +10 -4
- package/dist/chunks/chunk.SXFIFBVM.js.map +7 -0
- package/dist/chunks/{chunk.IMPVWVTM.js → chunk.SYWSXUHZ.js} +2 -2
- package/dist/chunks/{chunk.IOTPBNBD.js → chunk.T53XYA43.js} +8 -2
- package/dist/chunks/chunk.T53XYA43.js.map +7 -0
- package/dist/chunks/{chunk.4QCEBUCC.js → chunk.TL5RQ2KH.js} +2 -2
- package/dist/chunks/{chunk.E44AHYCS.js → chunk.TXQLKFUU.js} +9 -3
- package/dist/chunks/chunk.TXQLKFUU.js.map +7 -0
- package/dist/chunks/chunk.UPDPVGHT.js +59 -0
- package/dist/chunks/chunk.UPDPVGHT.js.map +7 -0
- package/dist/chunks/{chunk.YADYVOVB.js → chunk.UXHC3W5U.js} +6 -6
- package/dist/chunks/{chunk.Z6ZZHCIT.js → chunk.UY5AOQHP.js} +2 -2
- package/dist/chunks/{chunk.EPPQVZQW.js → chunk.UYGCYMDS.js} +2 -2
- package/dist/chunks/{chunk.II2KA3OR.js → chunk.VKRMYKYH.js} +4 -10
- package/dist/chunks/chunk.VKRMYKYH.js.map +7 -0
- package/dist/chunks/{chunk.XNZSIB7Q.js → chunk.VL74BJLP.js} +2 -2
- package/dist/chunks/{chunk.WGTTDIKF.js → chunk.VLE3Q74Y.js} +2 -2
- package/dist/chunks/{chunk.3DYXH3I6.js → chunk.VOOMTA4X.js} +2 -2
- package/dist/chunks/{chunk.OLTMUBJR.js → chunk.WLHRVKAR.js} +2 -2
- package/dist/chunks/{chunk.JZC3FVVX.js → chunk.WLYLSH3H.js} +2 -2
- package/dist/chunks/{chunk.TMJ25O52.js → chunk.WMUMEYQJ.js} +6 -6
- package/dist/chunks/{chunk.ZX5CHJI2.js → chunk.XCILIICJ.js} +14 -8
- package/dist/chunks/chunk.XCILIICJ.js.map +7 -0
- package/dist/chunks/{chunk.GOLBL7J7.js → chunk.XMSHEZ3R.js} +2 -2
- package/dist/chunks/{chunk.C2IY7RL4.js → chunk.XP47Y2SU.js} +2 -2
- package/dist/chunks/{chunk.5OUUMC6G.js → chunk.XSS62TBI.js} +2 -2
- package/dist/chunks/{chunk.PHUCYRO7.js → chunk.XY3WHMD7.js} +2 -2
- package/dist/chunks/{chunk.CIHRDJFX.js → chunk.Y334QFFZ.js} +6 -6
- package/dist/chunks/{chunk.QSA255YJ.js → chunk.Y4EGILWE.js} +2 -2
- package/dist/chunks/{chunk.5IR2ODKZ.js → chunk.YQLTFWYX.js} +2 -2
- package/dist/chunks/{chunk.OX7ASSRL.js → chunk.YTMSHKEA.js} +9 -9
- package/dist/chunks/{chunk.ZXZA6GQW.js → chunk.Z2PVOPJK.js} +9 -3
- package/dist/chunks/chunk.Z2PVOPJK.js.map +7 -0
- package/dist/chunks/{chunk.FLSPWXQV.js → chunk.Z4OFLKEQ.js} +2 -2
- package/dist/chunks/{chunk.SS6UWTDZ.js → chunk.ZDIDYG6H.js} +2 -2
- package/dist/components/accordion/accordion.component.js +6 -3
- package/dist/components/accordion/accordion.js +7 -4
- package/dist/components/alert/alert.component.js +12 -9
- package/dist/components/alert/alert.js +13 -10
- package/dist/components/badge/badge.component.js +7 -4
- package/dist/components/badge/badge.js +8 -5
- package/dist/components/breadcrumb/breadcrumb.component.js +7 -7
- package/dist/components/breadcrumb/breadcrumb.js +8 -8
- 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 +10 -7
- package/dist/components/button/button.js +11 -8
- 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 +8 -5
- package/dist/components/checkbox/checkbox.js +9 -6
- package/dist/components/combobox/combobox.component.js +13 -10
- package/dist/components/combobox/combobox.js +14 -11
- package/dist/components/details/details.component.js +9 -6
- package/dist/components/details/details.js +10 -7
- package/dist/components/dialog/dialog.component.js +11 -8
- package/dist/components/dialog/dialog.js +12 -9
- package/dist/components/divider/divider.component.js +2 -2
- package/dist/components/divider/divider.js +3 -3
- package/dist/components/drawer/drawer.component.js +10 -7
- package/dist/components/drawer/drawer.js +11 -8
- package/dist/components/dropdown/dropdown.component.js +4 -4
- package/dist/components/dropdown/dropdown.js +5 -5
- package/dist/components/file/file.component.js +11 -8
- package/dist/components/file/file.js +12 -9
- package/dist/components/header/header.component.js +7 -7
- package/dist/components/header/header.js +8 -8
- 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 +6 -3
- package/dist/components/icon-button/icon-button.js +7 -4
- package/dist/components/input/input.component.js +11 -8
- package/dist/components/input/input.custom.styles.js +1 -1
- package/dist/components/input/input.js +12 -9
- 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 +8 -8
- package/dist/components/menu-item/menu-item.js +9 -9
- 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 +5 -5
- package/dist/components/option/option.js +6 -6
- 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 +11 -11
- package/dist/components/prio-nav/prio-nav.js +12 -12
- 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 +6 -3
- package/dist/components/radio/radio.js +7 -4
- package/dist/components/radio-button/radio-button.component.js +5 -2
- package/dist/components/radio-button/radio-button.js +6 -3
- package/dist/components/radio-group/radio-group.component.js +6 -3
- package/dist/components/radio-group/radio-group.js +7 -4
- package/dist/components/range/range.component.js +8 -5
- package/dist/components/range/range.js +9 -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.js +2 -2
- package/dist/components/select/select.component.js +12 -9
- package/dist/components/select/select.js +13 -10
- package/dist/components/side-nav/side-nav.component.js +12 -9
- package/dist/components/side-nav/side-nav.js +13 -10
- package/dist/components/spinner/spinner.component.js +2 -2
- package/dist/components/spinner/spinner.js +3 -3
- package/dist/components/switch/switch.component.js +5 -2
- package/dist/components/switch/switch.js +6 -3
- package/dist/components/tab/tab.component.js +9 -6
- package/dist/components/tab/tab.js +10 -7
- package/dist/components/tab-group/tab-group.component.js +10 -7
- package/dist/components/tab-group/tab-group.js +11 -8
- 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 +9 -6
- package/dist/components/tag/tag.js +10 -7
- package/dist/components/textarea/textarea.component.js +5 -2
- package/dist/components/textarea/textarea.js +6 -3
- package/dist/components/tooltip/tooltip.component.js +4 -4
- package/dist/components/tooltip/tooltip.js +5 -5
- package/dist/components/validate/utility.js +2 -2
- package/dist/components/validate/validate.component.js +14 -11
- package/dist/components/validate/validate.js +15 -12
- package/dist/custom-elements.json +233 -233
- package/dist/events/events.d.ts +1 -0
- package/dist/events/syn-default-settings-changed.d.ts +16 -0
- package/dist/styles/index.css +1 -1
- package/dist/synergy.d.ts +1 -0
- package/dist/synergy.js +142 -126
- package/dist/utilities/defaultSettings/base.d.ts +87 -0
- package/dist/utilities/defaultSettings/base.js +10 -0
- package/dist/utilities/defaultSettings/base.js.map +7 -0
- package/dist/utilities/defaultSettings/decorator.d.ts +12 -0
- package/dist/utilities/defaultSettings/decorator.js +10 -0
- package/dist/utilities/defaultSettings/decorator.js.map +7 -0
- package/dist/utilities/defaultSettings/functions.d.ts +41 -0
- package/dist/utilities/defaultSettings/functions.js +21 -0
- package/dist/utilities/defaultSettings/functions.js.map +7 -0
- package/dist/utilities/defaultSettings/index.d.ts +3 -0
- package/dist/utilities/defaultSettings/index.js +20 -0
- package/dist/utilities/defaultSettings/index.js.map +7 -0
- package/dist/vscode.html-custom-data.json +49 -49
- package/package.json +3 -3
- package/dist/chunks/chunk.CHXBQL3V.js.map +0 -7
- package/dist/chunks/chunk.DRWE6CQ2.js.map +0 -7
- package/dist/chunks/chunk.E44AHYCS.js.map +0 -7
- package/dist/chunks/chunk.HTQBFNY7.js.map +0 -7
- package/dist/chunks/chunk.II2KA3OR.js.map +0 -7
- package/dist/chunks/chunk.IOTPBNBD.js.map +0 -7
- package/dist/chunks/chunk.JZ54BAZN.js.map +0 -7
- package/dist/chunks/chunk.MPJHH2MY.js.map +0 -7
- package/dist/chunks/chunk.O45X5N4K.js.map +0 -7
- package/dist/chunks/chunk.OH3XIKJC.js.map +0 -7
- package/dist/chunks/chunk.S3JJZL3O.js.map +0 -7
- package/dist/chunks/chunk.WCA3YMN7.js.map +0 -7
- package/dist/chunks/chunk.WMWANLUG.js.map +0 -7
- package/dist/chunks/chunk.Y5LNS47Z.js.map +0 -7
- package/dist/chunks/chunk.Z463JNSB.js.map +0 -7
- package/dist/chunks/chunk.ZJF7NESZ.js.map +0 -7
- package/dist/chunks/chunk.ZX5CHJI2.js.map +0 -7
- package/dist/chunks/chunk.ZXZA6GQW.js.map +0 -7
- /package/dist/chunks/{chunk.M4CVCPA7.js.map → chunk.2QFNK7XL.js.map} +0 -0
- /package/dist/chunks/{chunk.T2TZJ6RL.js.map → chunk.3HW4J22U.js.map} +0 -0
- /package/dist/chunks/{chunk.O353RCGZ.js.map → chunk.4AKA2QRO.js.map} +0 -0
- /package/dist/chunks/{chunk.2Z4KRXQR.js.map → chunk.4ZPJSGD5.js.map} +0 -0
- /package/dist/chunks/{chunk.KUHEM2HU.js.map → chunk.53THUSDO.js.map} +0 -0
- /package/dist/chunks/{chunk.JXFOMI34.js.map → chunk.7467Z6PG.js.map} +0 -0
- /package/dist/chunks/{chunk.FDXNWNID.js.map → chunk.7EYHNKMM.js.map} +0 -0
- /package/dist/chunks/{chunk.3CBZSMFD.js.map → chunk.7LASULTQ.js.map} +0 -0
- /package/dist/chunks/{chunk.BJI3TUDD.js.map → chunk.7NZ7JAEV.js.map} +0 -0
- /package/dist/chunks/{chunk.A5SZJGAY.js.map → chunk.7XMTQ7P7.js.map} +0 -0
- /package/dist/chunks/{chunk.5BPFEOW3.js.map → chunk.A2JLMFJ4.js.map} +0 -0
- /package/dist/chunks/{chunk.GSWYXK3F.js.map → chunk.AQS4YK7Q.js.map} +0 -0
- /package/dist/chunks/{chunk.CKX7E6DW.js.map → chunk.AS3TB27D.js.map} +0 -0
- /package/dist/chunks/{chunk.E6TS35BF.js.map → chunk.B2WOBIWW.js.map} +0 -0
- /package/dist/chunks/{chunk.KCEUZKGJ.js.map → chunk.BJTRYICX.js.map} +0 -0
- /package/dist/chunks/{chunk.UD2SVXHT.js.map → chunk.BPZOCAHJ.js.map} +0 -0
- /package/dist/chunks/{chunk.CMORZHVE.js.map → chunk.BWESHYBN.js.map} +0 -0
- /package/dist/chunks/{chunk.R7UQZGOB.js.map → chunk.DYUCTKM6.js.map} +0 -0
- /package/dist/chunks/{chunk.AVEHVAVI.js.map → chunk.E72GLNXI.js.map} +0 -0
- /package/dist/chunks/{chunk.442H67H2.js.map → chunk.EBYGA33B.js.map} +0 -0
- /package/dist/chunks/{chunk.KYW2PJQJ.js.map → chunk.EMGPXY5T.js.map} +0 -0
- /package/dist/chunks/{chunk.KQKYLYB5.js.map → chunk.FAREQGAK.js.map} +0 -0
- /package/dist/chunks/{chunk.WQTGLVFD.js.map → chunk.FLB37Q2Y.js.map} +0 -0
- /package/dist/chunks/{chunk.7C65TMZT.js.map → chunk.HCMNEIRN.js.map} +0 -0
- /package/dist/chunks/{chunk.XWYGFKWO.js.map → chunk.HNVPPNYZ.js.map} +0 -0
- /package/dist/chunks/{chunk.F7L6D6XY.js.map → chunk.HPQBH3O2.js.map} +0 -0
- /package/dist/chunks/{chunk.DYAGSNTK.js.map → chunk.HZ3S4J3T.js.map} +0 -0
- /package/dist/chunks/{chunk.NM5ZFEE5.js.map → chunk.IBQDKFYH.js.map} +0 -0
- /package/dist/chunks/{chunk.Z4WZ7MIE.js.map → chunk.IFWSRMUK.js.map} +0 -0
- /package/dist/chunks/{chunk.TVERPVR4.js.map → chunk.J53UXHXV.js.map} +0 -0
- /package/dist/chunks/{chunk.WSJXYSXY.js.map → chunk.JHPSR3AP.js.map} +0 -0
- /package/dist/chunks/{chunk.SAH3XRAD.js.map → chunk.JNAG6IBY.js.map} +0 -0
- /package/dist/chunks/{chunk.6WYS7WDW.js.map → chunk.LHNUNBCA.js.map} +0 -0
- /package/dist/chunks/{chunk.YA4ZNSNS.js.map → chunk.LYMHXGME.js.map} +0 -0
- /package/dist/chunks/{chunk.SMRWRBBB.js.map → chunk.LYNLLR54.js.map} +0 -0
- /package/dist/chunks/{chunk.JGZ2DM63.js.map → chunk.LZ27X5R6.js.map} +0 -0
- /package/dist/chunks/{chunk.O3D7AIEY.js.map → chunk.MDG7KZFO.js.map} +0 -0
- /package/dist/chunks/{chunk.AEYAHBYW.js.map → chunk.MGET4VXP.js.map} +0 -0
- /package/dist/chunks/{chunk.CZDXNQOI.js.map → chunk.N54SVWTA.js.map} +0 -0
- /package/dist/chunks/{chunk.4SALHO5R.js.map → chunk.NL4FKYIJ.js.map} +0 -0
- /package/dist/chunks/{chunk.WJWII3OP.js.map → chunk.NM5EI7ZH.js.map} +0 -0
- /package/dist/chunks/{chunk.3CZBIEJQ.js.map → chunk.NN73HBIU.js.map} +0 -0
- /package/dist/chunks/{chunk.54OV4Y3P.js.map → chunk.OFA3YJLS.js.map} +0 -0
- /package/dist/chunks/{chunk.ZA44ZRKT.js.map → chunk.P5XIUYNV.js.map} +0 -0
- /package/dist/chunks/{chunk.762BUPQP.js.map → chunk.PDAOZ7HN.js.map} +0 -0
- /package/dist/chunks/{chunk.ODBT7EDN.js.map → chunk.PLSOGFSX.js.map} +0 -0
- /package/dist/chunks/{chunk.RR3NOQXW.js.map → chunk.Q33XUREM.js.map} +0 -0
- /package/dist/chunks/{chunk.EFBKBI5I.js.map → chunk.QMVBPAZF.js.map} +0 -0
- /package/dist/chunks/{chunk.T2IZ4JC5.js.map → chunk.QWMAKCAT.js.map} +0 -0
- /package/dist/chunks/{chunk.26PAD6S5.js.map → chunk.S7PAQRVY.js.map} +0 -0
- /package/dist/chunks/{chunk.3GWNIY5V.js.map → chunk.SKA5Y7HA.js.map} +0 -0
- /package/dist/chunks/{chunk.VKKATLHB.js.map → chunk.SNHVIH7F.js.map} +0 -0
- /package/dist/chunks/{chunk.U627OKOV.js.map → chunk.ST3V3ZVP.js.map} +0 -0
- /package/dist/chunks/{chunk.JM2MZ7RR.js.map → chunk.SWUXKALS.js.map} +0 -0
- /package/dist/chunks/{chunk.IMPVWVTM.js.map → chunk.SYWSXUHZ.js.map} +0 -0
- /package/dist/chunks/{chunk.4QCEBUCC.js.map → chunk.TL5RQ2KH.js.map} +0 -0
- /package/dist/chunks/{chunk.YADYVOVB.js.map → chunk.UXHC3W5U.js.map} +0 -0
- /package/dist/chunks/{chunk.Z6ZZHCIT.js.map → chunk.UY5AOQHP.js.map} +0 -0
- /package/dist/chunks/{chunk.EPPQVZQW.js.map → chunk.UYGCYMDS.js.map} +0 -0
- /package/dist/chunks/{chunk.XNZSIB7Q.js.map → chunk.VL74BJLP.js.map} +0 -0
- /package/dist/chunks/{chunk.WGTTDIKF.js.map → chunk.VLE3Q74Y.js.map} +0 -0
- /package/dist/chunks/{chunk.3DYXH3I6.js.map → chunk.VOOMTA4X.js.map} +0 -0
- /package/dist/chunks/{chunk.OLTMUBJR.js.map → chunk.WLHRVKAR.js.map} +0 -0
- /package/dist/chunks/{chunk.JZC3FVVX.js.map → chunk.WLYLSH3H.js.map} +0 -0
- /package/dist/chunks/{chunk.TMJ25O52.js.map → chunk.WMUMEYQJ.js.map} +0 -0
- /package/dist/chunks/{chunk.GOLBL7J7.js.map → chunk.XMSHEZ3R.js.map} +0 -0
- /package/dist/chunks/{chunk.C2IY7RL4.js.map → chunk.XP47Y2SU.js.map} +0 -0
- /package/dist/chunks/{chunk.5OUUMC6G.js.map → chunk.XSS62TBI.js.map} +0 -0
- /package/dist/chunks/{chunk.PHUCYRO7.js.map → chunk.XY3WHMD7.js.map} +0 -0
- /package/dist/chunks/{chunk.CIHRDJFX.js.map → chunk.Y334QFFZ.js.map} +0 -0
- /package/dist/chunks/{chunk.QSA255YJ.js.map → chunk.Y4EGILWE.js.map} +0 -0
- /package/dist/chunks/{chunk.5IR2ODKZ.js.map → chunk.YQLTFWYX.js.map} +0 -0
- /package/dist/chunks/{chunk.OX7ASSRL.js.map → chunk.YTMSHKEA.js.map} +0 -0
- /package/dist/chunks/{chunk.FLSPWXQV.js.map → chunk.Z4OFLKEQ.js.map} +0 -0
- /package/dist/chunks/{chunk.SS6UWTDZ.js.map → chunk.ZDIDYG6H.js.map} +0 -0
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import {
|
|
2
|
+
addGlobalEventNotification,
|
|
3
|
+
enableExperimentalSettingEmitEvents,
|
|
4
|
+
extractDefaultSettingsForElement,
|
|
5
|
+
removeGlobalEventNotification,
|
|
6
|
+
resetGlobalDefaultSettings,
|
|
7
|
+
setDefaultSettingsForElement,
|
|
8
|
+
setGlobalDefaultSettings
|
|
9
|
+
} from "../../chunks/chunk.JSEL4YPW.js";
|
|
10
|
+
import "../../chunks/chunk.UPDPVGHT.js";
|
|
11
|
+
import "../../chunks/chunk.2GFK6XTO.js";
|
|
12
|
+
export {
|
|
13
|
+
addGlobalEventNotification,
|
|
14
|
+
enableExperimentalSettingEmitEvents,
|
|
15
|
+
extractDefaultSettingsForElement,
|
|
16
|
+
removeGlobalEventNotification,
|
|
17
|
+
resetGlobalDefaultSettings,
|
|
18
|
+
setDefaultSettingsForElement,
|
|
19
|
+
setGlobalDefaultSettings
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=functions.js.map
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import "../../chunks/chunk.RSCUHBW3.js";
|
|
2
|
+
import {
|
|
3
|
+
enableDefaultSettings
|
|
4
|
+
} from "../../chunks/chunk.OLCT57R5.js";
|
|
5
|
+
import {
|
|
6
|
+
enableExperimentalSettingEmitEvents,
|
|
7
|
+
resetGlobalDefaultSettings,
|
|
8
|
+
setDefaultSettingsForElement,
|
|
9
|
+
setGlobalDefaultSettings
|
|
10
|
+
} from "../../chunks/chunk.JSEL4YPW.js";
|
|
11
|
+
import "../../chunks/chunk.UPDPVGHT.js";
|
|
12
|
+
import "../../chunks/chunk.2GFK6XTO.js";
|
|
13
|
+
export {
|
|
14
|
+
enableDefaultSettings,
|
|
15
|
+
enableExperimentalSettingEmitEvents,
|
|
16
|
+
resetGlobalDefaultSettings,
|
|
17
|
+
setDefaultSettingsForElement,
|
|
18
|
+
setGlobalDefaultSettings
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -29,29 +29,6 @@
|
|
|
29
29
|
}
|
|
30
30
|
]
|
|
31
31
|
},
|
|
32
|
-
{
|
|
33
|
-
"name": "syn-badge",
|
|
34
|
-
"description": "Badges are used to draw attention and display statuses or counts.\n---\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
35
|
-
"attributes": [
|
|
36
|
-
{
|
|
37
|
-
"name": "variant",
|
|
38
|
-
"description": "The badge's theme variant.",
|
|
39
|
-
"values": [
|
|
40
|
-
{ "name": "primary" },
|
|
41
|
-
{ "name": "success" },
|
|
42
|
-
{ "name": "neutral" },
|
|
43
|
-
{ "name": "warning" },
|
|
44
|
-
{ "name": "danger" }
|
|
45
|
-
]
|
|
46
|
-
}
|
|
47
|
-
],
|
|
48
|
-
"references": [
|
|
49
|
-
{
|
|
50
|
-
"name": "Documentation",
|
|
51
|
-
"url": "https://synergy.style/components/badge"
|
|
52
|
-
}
|
|
53
|
-
]
|
|
54
|
-
},
|
|
55
32
|
{
|
|
56
33
|
"name": "syn-alert",
|
|
57
34
|
"description": "Alerts are used to display important messages inline or as toast notifications.\n---\n\n\n### **Events:**\n - **syn-show** - Emitted when the alert opens.\n- **syn-after-show** - Emitted after the alert opens and all animations are complete.\n- **syn-hide** - Emitted when the alert closes.\n- **syn-after-hide** - Emitted after the alert closes and all animations are complete.\n\n### **Methods:**\n - **show()** - Shows the alert.\n- **hide()** - Hides the alert\n- **toast()** - Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden.\n\n### **Slots:**\n - _default_ - The alert's main content.\n- **icon** - An icon to show in the alert. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the optional icon.\n- **message** - The container that wraps the alert's main content.\n- **close-button** - The close button, an `<syn-icon-button>`.\n- **close-button__base** - The close button's exported `base` part.",
|
|
@@ -91,51 +68,42 @@
|
|
|
91
68
|
]
|
|
92
69
|
},
|
|
93
70
|
{
|
|
94
|
-
"name": "syn-
|
|
95
|
-
"description": "
|
|
71
|
+
"name": "syn-badge",
|
|
72
|
+
"description": "Badges are used to draw attention and display statuses or counts.\n---\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
96
73
|
"attributes": [
|
|
97
74
|
{
|
|
98
|
-
"name": "
|
|
99
|
-
"description": "The
|
|
100
|
-
"values": [
|
|
75
|
+
"name": "variant",
|
|
76
|
+
"description": "The badge's theme variant.",
|
|
77
|
+
"values": [
|
|
78
|
+
{ "name": "primary" },
|
|
79
|
+
{ "name": "success" },
|
|
80
|
+
{ "name": "neutral" },
|
|
81
|
+
{ "name": "warning" },
|
|
82
|
+
{ "name": "danger" }
|
|
83
|
+
]
|
|
101
84
|
}
|
|
102
85
|
],
|
|
103
86
|
"references": [
|
|
104
87
|
{
|
|
105
88
|
"name": "Documentation",
|
|
106
|
-
"url": "https://synergy.style/components/
|
|
89
|
+
"url": "https://synergy.style/components/badge"
|
|
107
90
|
}
|
|
108
91
|
]
|
|
109
92
|
},
|
|
110
93
|
{
|
|
111
|
-
"name": "syn-breadcrumb
|
|
112
|
-
"description": "
|
|
94
|
+
"name": "syn-breadcrumb",
|
|
95
|
+
"description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n---\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
113
96
|
"attributes": [
|
|
114
97
|
{
|
|
115
|
-
"name": "
|
|
116
|
-
"description": "
|
|
117
|
-
"values": []
|
|
118
|
-
},
|
|
119
|
-
{
|
|
120
|
-
"name": "target",
|
|
121
|
-
"description": "Tells the browser where to open the link. Only used when `href` is set.",
|
|
122
|
-
"values": [
|
|
123
|
-
{ "name": "_blank" },
|
|
124
|
-
{ "name": "_parent" },
|
|
125
|
-
{ "name": "_self" },
|
|
126
|
-
{ "name": "_top" }
|
|
127
|
-
]
|
|
128
|
-
},
|
|
129
|
-
{
|
|
130
|
-
"name": "rel",
|
|
131
|
-
"description": "The `rel` attribute to use on the link. Only used when `href` is set.",
|
|
98
|
+
"name": "label",
|
|
99
|
+
"description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
|
|
132
100
|
"values": []
|
|
133
101
|
}
|
|
134
102
|
],
|
|
135
103
|
"references": [
|
|
136
104
|
{
|
|
137
105
|
"name": "Documentation",
|
|
138
|
-
"url": "https://synergy.style/components/breadcrumb
|
|
106
|
+
"url": "https://synergy.style/components/breadcrumb"
|
|
139
107
|
}
|
|
140
108
|
]
|
|
141
109
|
},
|
|
@@ -302,6 +270,38 @@
|
|
|
302
270
|
}
|
|
303
271
|
]
|
|
304
272
|
},
|
|
273
|
+
{
|
|
274
|
+
"name": "syn-breadcrumb-item",
|
|
275
|
+
"description": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.\n---\n\n\n### **Slots:**\n - _default_ - The breadcrumb item's label.\n- **prefix** - An optional prefix, usually an icon or icon button.\n- **suffix** - An optional suffix, usually an icon or icon button.\n- **separator** - The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<syn-breadcrumb>` instead.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The breadcrumb item's label.\n- **prefix** - The container that wraps the prefix.\n- **suffix** - The container that wraps the suffix.\n- **separator** - The container that wraps the separator.",
|
|
276
|
+
"attributes": [
|
|
277
|
+
{
|
|
278
|
+
"name": "href",
|
|
279
|
+
"description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
|
|
280
|
+
"values": []
|
|
281
|
+
},
|
|
282
|
+
{
|
|
283
|
+
"name": "target",
|
|
284
|
+
"description": "Tells the browser where to open the link. Only used when `href` is set.",
|
|
285
|
+
"values": [
|
|
286
|
+
{ "name": "_blank" },
|
|
287
|
+
{ "name": "_parent" },
|
|
288
|
+
{ "name": "_self" },
|
|
289
|
+
{ "name": "_top" }
|
|
290
|
+
]
|
|
291
|
+
},
|
|
292
|
+
{
|
|
293
|
+
"name": "rel",
|
|
294
|
+
"description": "The `rel` attribute to use on the link. Only used when `href` is set.",
|
|
295
|
+
"values": []
|
|
296
|
+
}
|
|
297
|
+
],
|
|
298
|
+
"references": [
|
|
299
|
+
{
|
|
300
|
+
"name": "Documentation",
|
|
301
|
+
"url": "https://synergy.style/components/breadcrumb-item"
|
|
302
|
+
}
|
|
303
|
+
]
|
|
304
|
+
},
|
|
305
305
|
{
|
|
306
306
|
"name": "syn-checkbox",
|
|
307
307
|
"description": "Checkboxes allow the user to toggle an option on or off.\n---\n\n\n### **Events:**\n - **syn-blur** - Emitted when the checkbox loses focus.\n- **syn-change** - Emitted when the checked state changes.\n- **syn-focus** - Emitted when the checkbox gains focus.\n- **syn-input** - Emitted when the checkbox receives input.\n- **syn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the checkbox.\n- **focus(options: _FocusOptions_)** - Sets focus on the checkbox.\n- **blur()** - Removes focus from the checkbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n\n### **Slots:**\n - _default_ - The checkbox's label.\n- **help-text** - Text that describes how to use the checkbox. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the checkbox's checked state.\n- **control--checked** - Matches the control part when the checkbox is checked.\n- **control--indeterminate** - Matches the control part when the checkbox is indeterminate.\n- **checked-icon** - The checked icon, an `<syn-icon>` element.\n- **indeterminate-icon** - The indeterminate icon, an `<syn-icon>` element.\n- **label** - The container that wraps the checkbox's label.\n- **form-control-help-text** - The help text's wrapper.",
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"url": "https://www.sick.com"
|
|
5
5
|
},
|
|
6
6
|
"name": "@synergy-design-system/components",
|
|
7
|
-
"version": "2.
|
|
7
|
+
"version": "2.20.0-settings.1",
|
|
8
8
|
"description": "",
|
|
9
9
|
"repository": {
|
|
10
10
|
"type": "git",
|
|
@@ -97,9 +97,9 @@
|
|
|
97
97
|
"unist-util-visit": "^5.0.0",
|
|
98
98
|
"user-agent-data-types": "^0.4.2",
|
|
99
99
|
"vendorism": "^5.0.0",
|
|
100
|
-
"@synergy-design-system/eslint-config-syn": "0.1.0",
|
|
101
100
|
"@synergy-design-system/stylelint-config-syn": "0.1.0",
|
|
102
|
-
"@synergy-design-system/tokens": "2.17.0"
|
|
101
|
+
"@synergy-design-system/tokens": "2.17.0",
|
|
102
|
+
"@synergy-design-system/eslint-config-syn": "0.1.0"
|
|
103
103
|
},
|
|
104
104
|
"release": {
|
|
105
105
|
"branches": [
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/components/select/select.component.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { animateTo, stopAnimations } from '../../internal/animate.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { FormControlController } from '../../internal/form.js';\nimport { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { scrollIntoView } from '../../internal/scroll.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { waitForEvent } from '../../internal/event.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynPopup from '../popup/popup.component.js';\nimport SynTag from '../tag/tag.component.js';\nimport styles from './select.styles.js';\nimport customStyles from './select.custom.styles.js';\nimport type { CSSResultGroup, TemplateResult } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\nimport type { SynRemoveEvent } from '../../events/syn-remove.js';\nimport type SynOption from '../option/option.component.js';\n\n/**\n * @summary Selects allow you to choose items from a menu of predefined options.\n * @documentation https://synergy.style/components/select\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-popup\n * @dependency syn-tag\n *\n * @slot - The listbox options. Must be `<syn-option>` elements. You can use `<syn-divider>` to group items visually.\n * @slot label - The input's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the select's menu opens.\n * @event syn-after-show - Emitted after the select's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the select's menu closes.\n * @event syn-after-hide - Emitted after the select's menu closes and all animations are complete.\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 select's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, suffix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label, an `<input>` element.\n * @csspart listbox - The listbox container where options are slotted.\n * @csspart tags - The container that houses option tags when `multiselect` is used.\n * @csspart tag - The individual tags that represent each multiselect option.\n * @csspart tag__base - The tag's base part.\n * @csspart tag__content - The tag's content part.\n * @csspart tag__remove-button - The tag's remove button.\n * @csspart tag__remove-button__base - The tag's remove button base part.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n */\nexport default class SynSelect extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [componentStyles, formControlStyles, styles, formControlCustomStyles, customStyles];\n static dependencies = {\n 'syn-icon': SynIcon,\n 'syn-popup': SynPopup,\n 'syn-tag': SynTag\n };\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 readonly localize = new LocalizeController(this);\n private typeToSelectString = '';\n private typeToSelectTimeout: number;\n private closeWatcher: CloseWatcher | null;\n\n @query('.select') popup: SynPopup;\n @query('.select__combobox') combobox: HTMLSlotElement;\n @query('.select__display-input') displayInput: HTMLInputElement;\n @query('.select__value-input') valueInput: HTMLInputElement;\n @query('.select__listbox') listbox: HTMLSlotElement;\n\n @state() private hasFocus = false;\n @state() displayLabel = '';\n @state() currentOption: SynOption;\n @state() selectedOptions: SynOption[] = [];\n @state() private valueHasChanged: boolean = false;\n\n /** The name of the select, submitted as a name/value pair with form data. */\n @property() name = '';\n\n private _value: string | string[] = '';\n\n get value() {\n return this._value;\n }\n\n /**\n * The current value of the select, submitted as a name/value pair with form data. When `multiple` is enabled, the\n * value attribute will be a space-delimited list of values based on the options selected, and the value property will\n * be an array. **For this reason, values must not contain spaces.**\n */\n @state()\n set value(val: string | string[]) {\n if (this.multiple) {\n val = Array.isArray(val) ? val : val.split(' ');\n } else {\n val = Array.isArray(val) ? val.join(' ') : val;\n }\n\n if (this._value === val) {\n return;\n }\n\n this.valueHasChanged = true;\n this._value = val;\n }\n\n /** The default value of the form control. Primarily used for resetting the form control. */\n @property({ attribute: 'value' }) defaultValue: string | string[] = '';\n\n /** The select's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Placeholder text to show as a hint when the select is empty. */\n @property() placeholder = '';\n\n /** Allows more than one option to be selected. */\n @property({ type: Boolean, reflect: true }) multiple = false;\n\n /**\n * The maximum number of selected options to show when `multiple` is true. After the maximum, \"+n\" will be shown to\n * indicate the number of additional items that are selected. Set to 0 to remove the limit.\n */\n @property({ attribute: 'max-options-visible', type: Number }) maxOptionsVisible = 3;\n\n /** Disables the select control. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Adds a clear button when the select is not empty. */\n @property({ type: Boolean }) clearable = false;\n\n /**\n * Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can\n * use the `show()` and `hide()` methods and this attribute will reflect the select's open state.\n */\n @property({ type: Boolean, reflect: true }) open = false;\n\n /**\n * Enable this option to prevent the listbox from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.\n */\n @property({ type: Boolean }) hoist = false;\n\n /** The select's label. If you need to display HTML, use the `label` slot instead. */\n @property() label = '';\n\n /**\n * The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox\n * inside of the viewport.\n */\n @property({ reflect: true }) placement: 'top' | 'bottom' = 'bottom';\n\n /** The select's help text. If you need to display HTML, use the `help-text` slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\n\n /**\n * By default, form controls are associated with the nearest containing `<form>` element. 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 /** The select's required attribute. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /**\n * A function that customizes the tags to be rendered when multiple=true. The first argument is the option, the second\n * is the current tag's index. The function should return either a Lit TemplateResult or a string containing trusted HTML of the symbol to render at\n * the specified value.\n */\n @property() getTag: (option: SynOption, index: number) => TemplateResult | string | HTMLElement = option => {\n return html`\n <syn-tag\n part=\"tag\"\n exportparts=\"\n base:tag__base,\n content:tag__content,\n remove-button:tag__remove-button,\n remove-button__base:tag__remove-button__base\n \"\n size=${this.size}\n removable\n @syn-remove=${(event: SynRemoveEvent) => this.handleTagRemove(event, option)}\n >\n ${option.getTextLabel()}\n </syn-tag>\n `;\n };\n\n /** Gets the validity state object */\n get validity() {\n return this.valueInput.validity;\n }\n\n /** Gets the validation message */\n get validationMessage() {\n return this.valueInput.validationMessage;\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n setTimeout(() => {\n this.handleDefaultSlotChange();\n });\n\n // Because this is a form control, it shouldn't be opened initially\n this.open = false;\n }\n\n private addOpenListeners() {\n //\n // Listen on the root node instead of the document in case the elements are inside a shadow root\n //\n // https://github.com/synergy-design-system/synergy/issues/1763\n //\n document.addEventListener('focusin', this.handleDocumentFocusIn);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n\n // If the component is rendered in a shadow root, we need to attach the focusin listener there too\n if (this.getRootNode() !== document) {\n this.getRootNode().addEventListener('focusin', this.handleDocumentFocusIn);\n }\n\n if ('CloseWatcher' in window) {\n this.closeWatcher?.destroy();\n this.closeWatcher = new CloseWatcher();\n this.closeWatcher.onclose = () => {\n if (this.open) {\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n }\n };\n }\n }\n\n private removeOpenListeners() {\n document.removeEventListener('focusin', this.handleDocumentFocusIn);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n\n if (this.getRootNode() !== document) {\n this.getRootNode().removeEventListener('focusin', this.handleDocumentFocusIn);\n }\n\n this.closeWatcher?.destroy();\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.displayInput.setSelectionRange(0, 0);\n this.emit('syn-focus');\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleDocumentFocusIn = (event: KeyboardEvent) => {\n // Close when focusing out of the select\n const path = event.composedPath();\n if (this && !path.includes(this)) {\n this.hide();\n }\n };\n\n private handleDocumentKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n const isClearButton = target.closest('.select__clear') !== null;\n const isIconButton = target.closest('syn-icon-button') !== null;\n\n // Ignore presses when the target is an icon button (e.g. the remove button in <syn-tag>)\n if (isClearButton || isIconButton) {\n return;\n }\n\n // Close when pressing escape\n if (event.key === 'Escape' && this.open && !this.closeWatcher) {\n event.preventDefault();\n event.stopPropagation();\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n }\n\n // Handle enter and space. When pressing space, we allow for type to select behaviors so if there's anything in the\n // buffer we _don't_ close it.\n if (event.key === 'Enter' || (event.key === ' ' && this.typeToSelectString === '')) {\n event.preventDefault();\n event.stopImmediatePropagation();\n\n // If it's not open, open it\n if (!this.open) {\n this.show();\n return;\n }\n\n // If it is open, update the value based on the current selection and close it\n if (this.currentOption && !this.currentOption.disabled) {\n this.valueHasChanged = true;\n if (this.multiple) {\n this.toggleOptionSelection(this.currentOption);\n } else {\n this.setSelectedOptions(this.currentOption);\n }\n\n // Emit after updating\n this.updateComplete.then(() => {\n this.emit('syn-input');\n this.emit('syn-change');\n });\n\n if (!this.multiple) {\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n }\n }\n\n return;\n }\n\n // Navigate options\n if (['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) {\n const allOptions = this.getAllOptions();\n const currentIndex = allOptions.indexOf(this.currentOption);\n let newIndex = Math.max(0, currentIndex);\n\n // Prevent scrolling\n event.preventDefault();\n\n // Open it\n if (!this.open) {\n this.show();\n\n // If an option is already selected, stop here because we want that one to remain highlighted when the listbox\n // opens for the first time\n if (this.currentOption) {\n return;\n }\n }\n\n if (event.key === 'ArrowDown') {\n newIndex = currentIndex + 1;\n if (newIndex > allOptions.length - 1) newIndex = 0;\n } else if (event.key === 'ArrowUp') {\n newIndex = currentIndex - 1;\n if (newIndex < 0) newIndex = allOptions.length - 1;\n } else if (event.key === 'Home') {\n newIndex = 0;\n } else if (event.key === 'End') {\n newIndex = allOptions.length - 1;\n }\n\n this.setCurrentOption(allOptions[newIndex]);\n }\n\n // All other \"printable\" keys trigger type to select\n if ((event.key && event.key.length === 1) || event.key === 'Backspace') {\n const allOptions = this.getAllOptions();\n\n // Don't block important key combos like CMD+R\n if (event.metaKey || event.ctrlKey || event.altKey) {\n return;\n }\n\n // Open, unless the key that triggered is backspace\n if (!this.open) {\n if (event.key === 'Backspace') {\n return;\n }\n\n this.show();\n }\n\n event.stopPropagation();\n event.preventDefault();\n\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = window.setTimeout(() => (this.typeToSelectString = ''), 1000);\n\n if (event.key === 'Backspace') {\n this.typeToSelectString = this.typeToSelectString.slice(0, -1);\n } else {\n this.typeToSelectString += event.key.toLowerCase();\n }\n\n for (const option of allOptions) {\n const label = option.getTextLabel().toLowerCase();\n\n if (label.startsWith(this.typeToSelectString)) {\n this.setCurrentOption(option);\n break;\n }\n }\n }\n };\n\n private handleDocumentMouseDown = (event: MouseEvent) => {\n // Close when clicking outside of the select\n const path = event.composedPath();\n if (this && !path.includes(this)) {\n this.hide();\n }\n };\n\n private handleLabelClick() {\n this.displayInput.focus();\n }\n\n private handleComboboxMouseDown(event: MouseEvent) {\n const path = event.composedPath();\n const isIconButton = path.some(el => el instanceof Element && el.tagName.toLowerCase() === 'syn-icon-button');\n\n // Ignore disabled controls and clicks on tags (remove buttons)\n if (this.disabled || isIconButton) {\n return;\n }\n\n event.preventDefault();\n this.displayInput.focus({ preventScroll: true });\n this.open = !this.open;\n }\n\n private handleComboboxKeyDown(event: KeyboardEvent) {\n if (event.key === 'Tab') {\n return;\n }\n\n event.stopPropagation();\n this.handleDocumentKeyDown(event);\n }\n\n private handleClearClick(event: MouseEvent) {\n event.stopPropagation();\n\n this.valueHasChanged = true;\n\n if (this.value !== '') {\n this.setSelectedOptions([]);\n this.displayInput.focus({ preventScroll: true });\n\n // Emit after update\n this.updateComplete.then(() => {\n this.emit('syn-clear');\n this.emit('syn-input');\n this.emit('syn-change');\n });\n }\n }\n\n private handleClearMouseDown(event: MouseEvent) {\n // Don't lose focus or propagate events when clicking the clear button\n event.stopPropagation();\n event.preventDefault();\n }\n\n private handleOptionClick(event: MouseEvent) {\n const target = event.target as HTMLElement;\n const option = target.closest('syn-option');\n const oldValue = this.value;\n\n if (option && !option.disabled) {\n this.valueHasChanged = true;\n if (this.multiple) {\n this.toggleOptionSelection(option);\n } else {\n this.setSelectedOptions(option);\n }\n\n // Set focus after updating so the value is announced by screen readers\n this.updateComplete.then(() => this.displayInput.focus({ preventScroll: true }));\n\n if (this.value !== oldValue) {\n // Emit after updating\n this.updateComplete.then(() => {\n this.emit('syn-input');\n this.emit('syn-change');\n });\n }\n\n if (!this.multiple) {\n this.hide();\n this.displayInput.focus({ preventScroll: true });\n }\n }\n }\n\n /* @internal - used by options to update labels */\n public handleDefaultSlotChange() {\n if (!customElements.get('syn-option')) {\n customElements.whenDefined('syn-option').then(() => this.handleDefaultSlotChange());\n }\n\n const allOptions = this.getAllOptions();\n const val = this.valueHasChanged ? this.value : this.defaultValue;\n const value = Array.isArray(val) ? val : [val];\n const values: string[] = [];\n\n // Check for duplicate values in menu items\n allOptions.forEach(option => values.push(option.value));\n\n // Select only the options that match the new value\n this.setSelectedOptions(allOptions.filter(el => value.includes(el.value)));\n }\n\n private handleTagRemove(event: SynRemoveEvent, option: SynOption) {\n event.stopPropagation();\n\n this.valueHasChanged = true;\n\n if (!this.disabled) {\n this.toggleOptionSelection(option, false);\n\n // Emit after updating\n this.updateComplete.then(() => {\n this.emit('syn-input');\n this.emit('syn-change');\n });\n }\n }\n\n // Gets an array of all <syn-option> elements\n private getAllOptions() {\n return [...this.querySelectorAll<SynOption>('syn-option')];\n }\n\n // Gets the first <syn-option> element\n private getFirstOption() {\n return this.querySelector<SynOption>('syn-option');\n }\n\n // Sets the current option, which is the option the user is currently interacting with (e.g. via keyboard). Only one\n // option may be \"current\" at a time.\n private setCurrentOption(option: SynOption | null) {\n const allOptions = this.getAllOptions();\n\n // Clear selection\n allOptions.forEach(el => {\n el.current = false;\n el.tabIndex = -1;\n });\n\n // Select the target option\n if (option) {\n this.currentOption = option;\n option.current = true;\n option.tabIndex = 0;\n option.focus();\n }\n }\n\n // Sets the selected option(s)\n private setSelectedOptions(option: SynOption | SynOption[]) {\n const allOptions = this.getAllOptions();\n const newSelectedOptions = Array.isArray(option) ? option : [option];\n\n // Clear existing selection\n allOptions.forEach(el => (el.selected = false));\n\n // Set the new selection\n if (newSelectedOptions.length) {\n newSelectedOptions.forEach(el => (el.selected = true));\n }\n\n // Update selection, value, and display label\n this.selectionChanged();\n }\n\n // Toggles an option's selected state\n private toggleOptionSelection(option: SynOption, force?: boolean) {\n if (force === true || force === false) {\n option.selected = force;\n } else {\n option.selected = !option.selected;\n }\n\n this.selectionChanged();\n }\n\n // This method must be called whenever the selection changes. It will update the selected options cache, the current\n // value, and the display value\n private selectionChanged() {\n const options = this.getAllOptions();\n // Update selected options cache\n this.selectedOptions = options.filter(el => el.selected);\n\n // Keep a reference to the previous `valueHasChanged`. Changes made here don't count has changing the value.\n const cachedValueHasChanged = this.valueHasChanged;\n\n // Update the value and display label\n if (this.multiple) {\n this.value = this.selectedOptions.map(el => el.value);\n\n if (this.placeholder && this.value.length === 0) {\n // When no items are selected, keep the value empty so the placeholder shows\n this.displayLabel = '';\n } else {\n this.displayLabel = this.localize.term('numOptionsSelected', this.selectedOptions.length);\n }\n } else {\n const selectedOption = this.selectedOptions[0];\n this.value = selectedOption?.value ?? '';\n this.displayLabel = selectedOption?.getTextLabel?.() ?? '';\n }\n this.valueHasChanged = cachedValueHasChanged;\n\n // Update validity\n this.updateComplete.then(() => {\n this.formControlController.updateValidity();\n });\n }\n\n protected get tags() {\n return this.selectedOptions.map((option, index) => {\n if (index < this.maxOptionsVisible || this.maxOptionsVisible <= 0) {\n const tag = this.getTag(option, index);\n // Wrap so we can handle the remove\n return html`<div @syn-remove=${(e: SynRemoveEvent) => this.handleTagRemove(e, option)}>\n ${typeof tag === 'string' ? unsafeHTML(tag) : tag}\n </div>`;\n } else if (index === this.maxOptionsVisible) {\n // Hit tag limit\n return html`<syn-tag size=${this.size}>+${this.selectedOptions.length - index}</syn-tag>`;\n }\n return html``;\n });\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n // Close the listbox when the control is disabled\n if (this.disabled) {\n this.open = false;\n this.handleOpenChange();\n }\n }\n\n attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null) {\n super.attributeChangedCallback(name, oldVal, newVal);\n\n /** This is a backwards compatibility call. In a new major version we should make a clean separation between \"value\" the attribute mapping to \"defaultValue\" property and \"value\" the property not reflecting. */\n if (name === 'value') {\n const cachedValueHasChanged = this.valueHasChanged;\n this.value = this.defaultValue;\n\n // Set it back to false since this isn't an interaction.\n this.valueHasChanged = cachedValueHasChanged;\n }\n }\n\n @watch(['defaultValue', 'value'], { waitUntilFirstUpdate: true })\n handleValueChange() {\n if (!this.valueHasChanged) {\n const cachedValueHasChanged = this.valueHasChanged;\n this.value = this.defaultValue;\n\n // Set it back to false since this isn't an interaction.\n this.valueHasChanged = cachedValueHasChanged;\n }\n\n const allOptions = this.getAllOptions();\n const value = Array.isArray(this.value) ? this.value : [this.value];\n\n // Select only the options that match the new value\n this.setSelectedOptions(allOptions.filter(el => value.includes(el.value)));\n }\n\n @watch('open', { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.open && !this.disabled) {\n // Reset the current option\n this.setCurrentOption(this.selectedOptions[0] || this.getFirstOption());\n\n // Show\n this.emit('syn-show');\n this.addOpenListeners();\n\n await stopAnimations(this);\n this.listbox.hidden = false;\n this.popup.active = true;\n\n // Select the appropriate option based on value after the listbox opens\n requestAnimationFrame(() => {\n this.setCurrentOption(this.currentOption);\n });\n\n const { keyframes, options } = getAnimation(this, 'select.show', { dir: this.localize.dir() });\n await animateTo(this.popup.popup, keyframes, options);\n\n // Make sure the current option is scrolled into view (required for Safari)\n if (this.currentOption) {\n scrollIntoView(this.currentOption, this.listbox, 'vertical', 'auto');\n }\n\n this.emit('syn-after-show');\n } else {\n // Hide\n this.emit('syn-hide');\n this.removeOpenListeners();\n\n await stopAnimations(this);\n const { keyframes, options } = getAnimation(this, 'select.hide', { dir: this.localize.dir() });\n await animateTo(this.popup.popup, keyframes, options);\n this.listbox.hidden = true;\n this.popup.active = false;\n\n this.emit('syn-after-hide');\n }\n }\n\n /** Shows the listbox. */\n async show() {\n if (this.open || this.disabled) {\n this.open = false;\n return undefined;\n }\n\n this.open = true;\n return waitForEvent(this, 'syn-after-show');\n }\n\n /** Hides the listbox. */\n async hide() {\n if (!this.open || this.disabled) {\n this.open = false;\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'syn-after-hide');\n }\n\n /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */\n checkValidity() {\n return this.valueInput.checkValidity();\n }\n\n /** Gets the associated form, if one exists. */\n getForm(): HTMLFormElement | null {\n return this.formControlController.getForm();\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n reportValidity() {\n return this.valueInput.reportValidity();\n }\n\n /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n this.valueInput.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n /** Sets focus on the control. */\n focus(options?: FocusOptions) {\n this.displayInput.focus(options);\n }\n\n /** Removes focus from the control. */\n blur() {\n this.displayInput.blur();\n }\n\n render() {\n const hasLabelSlot = this.hasSlotController.test('label');\n const hasHelpTextSlot = this.hasSlotController.test('help-text');\n const hasLabel = this.label ? true : !!hasLabelSlot;\n const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n const hasClearIcon = this.clearable && !this.disabled && this.value.length > 0;\n const isPlaceholderVisible = this.placeholder && this.value && this.value.length <= 0;\n\n return html`\n <div\n part=\"form-control\"\n class=${classMap({\n 'form-control': true,\n 'form-control--small': this.size === 'small',\n 'form-control--medium': this.size === 'medium',\n 'form-control--large': this.size === 'large',\n 'form-control--has-label': hasLabel,\n 'form-control--has-help-text': hasHelpText\n })}\n >\n <label\n id=\"label\"\n part=\"form-control-label\"\n class=\"form-control__label\"\n aria-hidden=${hasLabel ? 'false' : 'true'}\n @click=${this.handleLabelClick}\n >\n <slot name=\"label\">${this.label}</slot>\n </label>\n\n <div part=\"form-control-input\" class=\"form-control-input\">\n <syn-popup\n class=${classMap({\n select: true,\n 'select--standard': true,\n 'select--open': this.open,\n 'select--disabled': this.disabled,\n 'select--multiple': this.multiple,\n 'select--focused': this.hasFocus,\n 'select--placeholder-visible': isPlaceholderVisible,\n 'select--top': this.placement === 'top',\n 'select--bottom': this.placement === 'bottom',\n 'select--small': this.size === 'small',\n 'select--medium': this.size === 'medium',\n 'select--large': this.size === 'large'\n })}\n placement=${this.placement}\n strategy=${this.hoist ? 'fixed' : 'absolute'}\n flip\n shift\n sync=\"width\"\n auto-size=\"vertical\"\n auto-size-padding=\"10\"\n >\n <div\n part=\"combobox\"\n class=\"select__combobox\"\n slot=\"anchor\"\n @keydown=${this.handleComboboxKeyDown}\n @mousedown=${this.handleComboboxMouseDown}\n >\n <slot part=\"prefix\" name=\"prefix\" class=\"select__prefix\"></slot>\n\n <input\n part=\"display-input\"\n class=\"select__display-input\"\n type=\"text\"\n placeholder=${this.placeholder}\n .disabled=${this.disabled}\n .value=${this.displayLabel}\n autocomplete=\"off\"\n spellcheck=\"false\"\n autocapitalize=\"off\"\n readonly\n aria-controls=\"listbox\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n aria-labelledby=\"label\"\n aria-disabled=${this.disabled ? 'true' : 'false'}\n aria-describedby=\"help-text\"\n role=\"combobox\"\n tabindex=\"0\"\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n />\n\n ${this.multiple ? html`<div part=\"tags\" class=\"select__tags\">${this.tags}</div>` : ''}\n\n <input\n class=\"select__value-input\"\n type=\"text\"\n ?disabled=${this.disabled}\n ?required=${this.required}\n .value=${Array.isArray(this.value) ? this.value.join(', ') : this.value}\n tabindex=\"-1\"\n aria-hidden=\"true\"\n @focus=${() => this.focus()}\n @invalid=${this.handleInvalid}\n />\n\n ${hasClearIcon\n ? html`\n <button\n part=\"clear-button\"\n class=\"select__clear\"\n type=\"button\"\n aria-label=${this.localize.term('clearEntry')}\n @mousedown=${this.handleClearMouseDown}\n @click=${this.handleClearClick}\n tabindex=\"-1\"\n >\n <slot name=\"clear-icon\">\n <syn-icon name=\"x-circle-fill\" library=\"system\"></syn-icon>\n </slot>\n </button>\n `\n : ''}\n\n <slot name=\"suffix\" part=\"suffix\" class=\"select__suffix\"></slot>\n\n <slot name=\"expand-icon\" part=\"expand-icon\" class=\"select__expand-icon\">\n <syn-icon library=\"system\" name=\"chevron-down\"></syn-icon>\n </slot>\n </div>\n\n <div\n id=\"listbox\"\n role=\"listbox\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-multiselectable=${this.multiple ? 'true' : 'false'}\n aria-labelledby=\"label\"\n part=\"listbox\"\n class=\"select__listbox\"\n tabindex=\"-1\"\n @mouseup=${this.handleOptionClick}\n @slotchange=${this.handleDefaultSlotChange}\n >\n <slot></slot>\n </div>\n </syn-popup>\n </div>\n\n <div\n part=\"form-control-help-text\"\n id=\"help-text\"\n class=\"form-control__help-text\"\n aria-hidden=${hasHelpText ? 'false' : 'true'}\n >\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n </div>\n `;\n }\n}\n\nsetDefaultAnimation('select.show', {\n keyframes: [\n { opacity: 0, scale: 0.9 },\n { opacity: 1, scale: 1 }\n ],\n options: { duration: 100, easing: 'ease' }\n});\n\nsetDefaultAnimation('select.hide', {\n keyframes: [\n { opacity: 1, scale: 1 },\n { opacity: 0, scale: 0.9 }\n ],\n options: { duration: 100, easing: 'ease' }\n});\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/components/input/input.component.ts", "../../src/internal/longpress.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { defaultValue } from '../../internal/default-value.js';\nimport { FormControlController } from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynDivider from '../divider/divider.component.js';\nimport { longPress } from '../../internal/longpress.js';\nimport styles from './input.styles.js';\nimport customStyles from './input.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Inputs collect data from the user.\n * @documentation https://synergy.style/components/input\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-divider\n *\n * @slot label - The input's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the input.\n * @slot suffix - Used to append a presentational icon or similar element to the input.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot show-password-icon - An icon to use in lieu of the default show password icon.\n * @slot hide-password-icon - An icon to use in lieu of the default hide password icon.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n * @slot increment-number-stepper - An icon to use in lieu of the default increment number stepper icon.\n * @slot decrement-number-stepper - An icon to use in lieu of the default decrement number stepper icon.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-clear - Emitted when the clear button is activated.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart input - The internal `<input>` control.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart clear-button - The clear button.\n * @csspart password-toggle-button - The password toggle button.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart stepper - The container that wraps the number stepper.\n * @csspart decrement-number-stepper - The decrement number stepper button.\n * @csspart increment-number-stepper - The increment number stepper button.\n * @csspart divider - The divider between the increment and decrement number stepper buttons.\n */\nexport default class SynInput extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = [componentStyles, formControlStyles, styles, formControlCustomStyles, customStyles];\n static dependencies = {\n\t\t'syn-icon': SynIcon,\n\t\t'syn-divider': SynDivider\n\t};\n\n private readonly formControlController = new FormControlController(this, {\n assumeInteractionOn: ['syn-blur', 'syn-input']\n });\n private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label', 'prefix', 'suffix');\n private readonly localize = new LocalizeController(this);\n\n @query('.input__control') input: HTMLInputElement;\n\n @state() private hasFocus = false;\n @property() title = ''; // make reactive to pass through\n\n private __numberInput = Object.assign(document.createElement('input'), { type: 'number' });\n private __dateInput = Object.assign(document.createElement('input'), { type: 'date' });\n\n /**\n * The type of input. Works the same as a native `<input>` element, but only a subset of types are supported. Defaults\n * to `text`.\n */\n @property({ reflect: true }) type:\n | 'date'\n | 'datetime-local'\n | 'email'\n | 'number'\n | 'password'\n | 'search'\n | 'tel'\n | 'text'\n | 'time'\n | 'url' = 'text';\n\n /** The name of the input, submitted as a name/value pair with form data. */\n @property() name = '';\n\n /** The current value of the input, submitted as a name/value pair with form data. */\n @property() value = '';\n\n /** The default value of the form control. Primarily used for resetting the form control. */\n @defaultValue() defaultValue = '';\n\n /** The input's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** The input's label. If you need to display HTML, use the `label` slot instead. */\n @property() label = '';\n\n /** The input's help text. If you need to display HTML, use the `help-text` slot instead. */\n @property({ attribute: 'help-text' }) helpText = '';\n\n /** Adds a clear button when the input is not empty. */\n @property({ type: Boolean }) clearable = false;\n\n /** Disables the input. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Placeholder text to show as a hint when the input is empty. */\n @property() placeholder = '';\n\n /** Makes the input readonly. */\n @property({ type: Boolean, reflect: true }) readonly = false;\n\n /** Adds a button to toggle the password's visibility. Only applies to password types. */\n @property({ attribute: 'password-toggle', type: Boolean }) passwordToggle = false;\n\n /** Determines whether or not the password is currently visible. Only applies to password input types. */\n @property({ attribute: 'password-visible', type: Boolean }) passwordVisible = false;\n\n /** Hides the increment/decrement spin buttons for number inputs. */\n @property({ attribute: 'no-spin-buttons', type: Boolean }) noSpinButtons = false;\n\n /**\n * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\n * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in\n * the same document or shadow root for this to work.\n */\n @property({ reflect: true }) form = '';\n\n /** Makes the input a required field. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /** A regular expression pattern to validate input against. */\n @property() pattern: string;\n\n /** The minimum length of input that will be considered valid. */\n @property({ type: Number }) minlength: number;\n\n /** The maximum length of input that will be considered valid. */\n @property({ type: Number }) maxlength: number;\n\n /** The input's minimum value. Only applies to date and number input types. */\n @property() min: number | string;\n\n /** The input's maximum value. Only applies to date and number input types. */\n @property() max: number | string;\n\n /**\n * Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\n * implied, allowing any numeric value. Only applies to date and number input types.\n */\n @property() step: number | 'any';\n\n /** Controls whether and how text input is automatically capitalized as it is entered by the user. */\n @property() autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';\n\n /** Indicates whether the browser's autocorrect feature is on or off. */\n @property() autocorrect: 'off' | 'on';\n\n /**\n * Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n * [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.\n */\n @property() autocomplete: string;\n\n /** Indicates that the input should receive focus on page load. */\n @property({ type: Boolean }) autofocus: boolean;\n\n /** Used to customize the label or icon of the Enter key on virtual keyboards. */\n @property() enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';\n\n /** Enables spell checking on the input. */\n @property({\n type: Boolean,\n converter: {\n // Allow \"true|false\" attribute values but keep the property boolean\n fromAttribute: value => (!value || value === 'false' ? false : true),\n toAttribute: value => (value ? 'true' : 'false')\n }\n })\n spellcheck = true;\n\n /**\n * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\n * keyboard on supportive devices.\n */\n @property() inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n\n //\n // NOTE: We use an in-memory input for these getters/setters instead of the one in the template because the properties\n // can be set before the component is rendered.\n //\n\n /**\n * Gets or sets the current value as a `Date` object. Returns `null` if the value can't be converted. This will use the native `<input type=\"{{type}}\">` implementation and may result in an error.\n */\n get valueAsDate() {\n this.__dateInput.type = this.type;\n this.__dateInput.value = this.value;\n return this.input?.valueAsDate || this.__dateInput.valueAsDate;\n }\n\n set valueAsDate(newValue: Date | null) {\n this.__dateInput.type = this.type;\n this.__dateInput.valueAsDate = newValue;\n this.value = this.__dateInput.value;\n }\n\n /** Gets or sets the current value as a number. Returns `NaN` if the value can't be converted. */\n get valueAsNumber() {\n this.__numberInput.value = this.value;\n return this.input?.valueAsNumber || this.__numberInput.valueAsNumber;\n }\n\n set valueAsNumber(newValue: number) {\n this.__numberInput.valueAsNumber = newValue;\n this.value = this.__numberInput.value;\n }\n\n /** Gets the validity state object */\n get validity() {\n return this.input.validity;\n }\n\n /** Gets the validation message */\n get validationMessage() {\n return this.input.validationMessage;\n }\n\n firstUpdated() {\n this.formControlController.updateValidity();\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleStep(){\n this.handleInput();\n this.input.focus();\n }\n\n private handleStepUp() {\n this.stepUp();\n this.handleStep();\n }\n\n private handleStepDown() {\n this.stepDown();\n this.handleStep();\n }\n \n private isDecrementDisabled() {\n if(this.disabled || this.readonly) {\n return true;\n }\n\n if (this.min === undefined || this.min === null || this.disabled) {\n return false;\n }\n\n const min = typeof this.min === 'string' ? parseFloat(this.min) : this.min\n return this.valueAsNumber <= min;\n }\n\n private isIncrementDisabled() {\n if(this.disabled || this.readonly) {\n return true;\n }\n\n if (this.max === undefined || this.max === null) {\n return false;\n }\n\n const max = typeof this.max === 'string' ? parseFloat(this.max) : this.max\n return this.valueAsNumber >= max;\n }\n\n private handleChange() {\n this.value = this.input.value;\n this.emit('syn-change');\n }\n\n private handleClearClick(event: MouseEvent) {\n event.preventDefault();\n\n if (this.value !== '') {\n this.value = '';\n this.emit('syn-clear');\n this.emit('syn-input');\n this.emit('syn-change');\n }\n\n this.input.focus();\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n private handleInput() {\n this.value = this.input.value;\n this.formControlController.updateValidity();\n this.emit('syn-input');\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n // submitting to allow users to cancel the keydown event if they need to\n if (event.key === 'Enter' && !hasModifier) {\n setTimeout(() => {\n //\n // When using an Input Method Editor (IME), pressing enter will cause the form to submit unexpectedly. One way\n // to check for this is to look at event.isComposing, which will be true when the IME is open.\n //\n // See https://github.com/synergy-design-system/synergy/pull/988\n //\n if (!event.defaultPrevented && !event.isComposing) {\n this.formControlController.submit();\n }\n });\n }\n }\n\n private handlePasswordToggle() {\n this.passwordVisible = !this.passwordVisible;\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n }\n\n @watch('step', { waitUntilFirstUpdate: true })\n handleStepChange() {\n // If step changes, the value may become invalid so we need to recheck after the update. We set the new step\n // imperatively so we don't have to wait for the next render to report the updated validity.\n this.input.step = String(this.step);\n this.formControlController.updateValidity();\n }\n\n @watch('value', { waitUntilFirstUpdate: true })\n async handleValueChange() {\n await this.updateComplete;\n this.formControlController.updateValidity();\n }\n\n /** Sets focus on the input. */\n focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the input. */\n blur() {\n this.input.blur();\n }\n\n /** Selects all the text in the input. */\n select() {\n this.input.select();\n }\n\n /** Sets the start and end positions of the text selection (0-based). */\n setSelectionRange(\n selectionStart: number,\n selectionEnd: number,\n selectionDirection: 'forward' | 'backward' | 'none' = 'none'\n ) {\n this.input.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n }\n\n /** Replaces a range of text with a new string. */\n setRangeText(\n replacement: string,\n start?: number,\n end?: number,\n selectMode: 'select' | 'start' | 'end' | 'preserve' = 'preserve'\n ) {\n const selectionStart = start ?? this.input.selectionStart!;\n const selectionEnd = end ?? this.input.selectionEnd!;\n\n this.input.setRangeText(replacement, selectionStart, selectionEnd, selectMode);\n\n if (this.value !== this.input.value) {\n this.value = this.input.value;\n }\n }\n\n /** Displays the browser picker for an input element (only works if the browser supports it for the input type). */\n showPicker() {\n if ('showPicker' in HTMLInputElement.prototype) {\n this.input.showPicker();\n }\n }\n\n /** Increments the value of a numeric input type by the value of the step attribute. */\n stepUp() {\n this.input.stepUp();\n if (this.value !== this.input.value) {\n this.value = this.input.value;\n }\n }\n\n /** Decrements the value of a numeric input type by the value of the step attribute. */\n stepDown() {\n this.input.stepDown();\n if (this.value !== this.input.value) {\n this.value = this.input.value;\n }\n }\n\n /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */\n checkValidity() {\n return this.input.checkValidity();\n }\n\n /** Gets the associated form, if one exists. */\n getForm(): HTMLFormElement | null {\n return this.formControlController.getForm();\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n reportValidity() {\n return this.input.reportValidity();\n }\n\n /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n this.input.setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n\n render() {\n const hasLabelSlot = this.hasSlotController.test('label');\n const hasHelpTextSlot = this.hasSlotController.test('help-text');\n const hasPrefixSlot = this.hasSlotController.test('prefix');\n const hasSuffixSlot = this.hasSlotController.test('suffix');\n const hasLabel = this.label ? true : !!hasLabelSlot;\n const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n const hasClearIcon = this.clearable && !this.disabled && !this.readonly;\n const isClearIconVisible = hasClearIcon && (typeof this.value === 'number' || this.value.length > 0);\n\n return html`\n <div\n part=\"form-control\"\n class=${classMap({\n 'form-control': true,\n 'form-control--small': this.size === 'small',\n 'form-control--medium': this.size === 'medium',\n 'form-control--large': this.size === 'large',\n 'form-control--has-label': hasLabel,\n 'form-control--has-help-text': hasHelpText,\n 'form-control--has-prefix': hasPrefixSlot,\n 'form-control--has-suffix': hasSuffixSlot\n })}\n >\n <label\n part=\"form-control-label\"\n class=\"form-control__label\"\n for=\"input\"\n aria-hidden=${hasLabel ? 'false' : 'true'}\n >\n <slot name=\"label\">${this.label}</slot>\n </label>\n\n <div part=\"form-control-input\" class=\"form-control-input\">\n <div\n part=\"base\"\n class=${classMap({\n input: true,\n\n // Sizes\n 'input--small': this.size === 'small',\n 'input--medium': this.size === 'medium',\n 'input--large': this.size === 'large',\n\n // States\n 'input--standard': !this.readonly,\n 'input--readonly': this.readonly,\n 'input--disabled': this.disabled,\n 'input--focused': this.hasFocus,\n 'input--empty': !this.value,\n 'input--no-spin-buttons': this.noSpinButtons\n })}\n >\n <span part=\"prefix\" class=\"input__prefix\">\n <slot name=\"prefix\"></slot>\n </span>\n\n <input\n part=\"input\"\n id=\"input\"\n class=\"input__control\"\n type=${this.type === 'password' && this.passwordVisible ? 'text' : this.type}\n title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n name=${ifDefined(this.name)}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n placeholder=${ifDefined(this.placeholder)}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n min=${ifDefined(this.min)}\n max=${ifDefined(this.max)}\n step=${ifDefined(this.step as number)}\n .value=${live(this.value)}\n autocapitalize=${ifDefined(this.autocapitalize)}\n autocomplete=${ifDefined(this.autocomplete)}\n autocorrect=${ifDefined(this.autocorrect)}\n ?autofocus=${this.autofocus}\n spellcheck=${this.spellcheck}\n pattern=${ifDefined(this.pattern)}\n enterkeyhint=${ifDefined(this.enterkeyhint)}\n inputmode=${ifDefined(this.inputmode)}\n aria-describedby=\"help-text\"\n @change=${this.handleChange}\n @input=${this.handleInput}\n @invalid=${this.handleInvalid}\n @keydown=${this.handleKeyDown}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n />\n\n ${isClearIconVisible\n ? html`\n <button\n part=\"clear-button\"\n class=\"input__clear\"\n type=\"button\"\n aria-label=${this.localize.term('clearEntry')}\n @click=${this.handleClearClick}\n tabindex=\"-1\"\n >\n <slot name=\"clear-icon\">\n <syn-icon name=\"x-circle-fill\" library=\"system\"></syn-icon>\n </slot>\n </button>\n `\n : ''}\n ${this.passwordToggle && !this.disabled\n ? html`\n <button\n part=\"password-toggle-button\"\n class=\"input__password-toggle\"\n type=\"button\"\n aria-label=${this.localize.term(this.passwordVisible ? 'hidePassword' : 'showPassword')}\n @click=${this.handlePasswordToggle}\n tabindex=\"-1\"\n >\n ${this.passwordVisible\n ? html`\n <slot name=\"show-password-icon\">\n <syn-icon name=\"eye-slash\" library=\"system\"></syn-icon>\n </slot>\n `\n : html`\n <slot name=\"hide-password-icon\">\n <syn-icon name=\"eye\" library=\"system\"></syn-icon>\n </slot>\n `}\n </button>\n `\n : ''}\n\n <span part=\"suffix\" class=\"input__suffix\">\n <slot name=\"suffix\"></slot>\n </span>\n\n ${this.type === 'number' && !this.noSpinButtons\n ? html`\n <div part=\"stepper\" class=\"input__number-stepper\">\n <button\n part=\"decrement-number-stepper\"\n class=\"input__number-stepper-button\"\n type=\"button\"\n ?disabled=${this.isDecrementDisabled()}\n aria-hidden=\"true\"\n ${longPress({ start: () => this.handleStepDown(), end: () => this.handleChange()})}\n tabindex=\"-1\"\n >\n <slot name=\"decrement-number-stepper\">\n <syn-icon name=\"indeterminate\" library=\"system\"></syn-icon>\n </slot>\n </button>\n <syn-divider class=\"input__number-divider\" part=\"divider\" vertical></syn-divider>\n <button\n part=\"increment-number-stepper\"\n class=\"input__number-stepper-button\"\n type=\"button\"\n ?disabled=${this.isIncrementDisabled()}\n aria-hidden=\"true\"\n ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange()})}\n tabindex=\"-1\"\n >\n <slot name=\"increment-number-stepper\">\n <syn-icon name=\"add\" library=\"system\"></syn-icon>\n </slot>\n </button>\n </div>\n `\n : ''}\n </div>\n </div>\n\n <div\n part=\"form-control-help-text\"\n id=\"help-text\"\n class=\"form-control__help-text\"\n aria-hidden=${hasHelpText ? 'false' : 'true'}\n >\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n </div>\n `;\n }\n}\n", "import { type ElementPart, noChange, nothing } from 'lit';\nimport {\n AsyncDirective,\n type DirectiveParameters,\n type Part,\n PartType,\n directive,\n} from 'lit/async-directive.js';\n\ntype Callbacks = {\n start: () => void;\n end: () => void;\n};\n\n/**\n * A directive that determines,if a HTMLButtonElement is long pressed or only clicked.\n * Depending on the state it executes the callback once or repeating.\n *\n * Usage:\n *\n * <button\n * ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange()})}\n * >\n * my button\n * </button>\n */\nclass LongPressDirective extends AsyncDirective {\n host: HTMLButtonElement;\n\n observer: MutationObserver;\n\n callbacks: Callbacks;\n\n interval: NodeJS.Timeout;\n\n timeout: NodeJS.Timeout;\n\n constructor(part: Part) {\n super(part);\n if (part.type !== PartType.ELEMENT || !(part.element instanceof HTMLButtonElement)) {\n throw new Error('The `longPress` directive must be used on an HTMLButtonElement.');\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars, class-methods-use-this\n render(_callback: Callbacks): typeof nothing {\n return nothing;\n }\n\n update(part: ElementPart, [callbacks]: DirectiveParameters<this>): typeof noChange {\n // initial call\n if (this.callbacks === undefined && this.host === undefined) {\n this.host = part.element as HTMLButtonElement;\n this.callbacks = { ...callbacks };\n this.host.addEventListener('pointerdown', this.handlePointerDown);\n }\n\n return noChange;\n }\n\n protected disconnected(): void {\n this.stopSpinningAndCleanUp();\n this.host.removeEventListener('pointerdown', this.handlePointerDown);\n document.removeEventListener('pointerup', this.handlePointerUp);\n }\n\n private handlePointerDown = (event: PointerEvent) => {\n // do nothing if the click was not done from the left mouse button or if the button is disabled\n if (event.button !== 0 || this.host.disabled) {\n return;\n }\n this.spinOnLongPressCallback(event);\n };\n\n /**\n * Start spinning on long press clicks otherwise handle as single click event\n */\n private spinOnLongPressCallback(event: PointerEvent) {\n event.preventDefault();\n event.stopPropagation();\n\n // Start spinning only on long press\n this.timeout = setTimeout(() => {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n this.timeout = undefined;\n this.interval = setInterval(() => {\n this.callbacks.start();\n }, 50);\n }, 500);\n\n document.addEventListener('pointerup', this.handlePointerUp);\n\n // when buttons becoming disabled during long-press\n this.observer?.disconnect();\n this.observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.attributeName === 'disabled') {\n this.stopSpinningAndCleanUp();\n }\n });\n });\n this.observer.observe(this.host, { attributes: true });\n }\n\n private handlePointerUp = (pointerUp?: PointerEvent) => {\n pointerUp?.preventDefault();\n pointerUp?.stopPropagation();\n\n // we did not start to spin\n if (this.timeout) {\n this.callbacks.start();\n }\n\n this.stopSpinningAndCleanUp();\n\n this.callbacks.end();\n document.removeEventListener('pointerup', this.handlePointerUp);\n };\n\n /**\n * Stop the spinning and clean up all timer and observer\n */\n private stopSpinningAndCleanUp() {\n // stop spinning\n clearInterval(this.interval);\n\n clearTimeout(this.timeout);\n this.observer?.disconnect();\n }\n}\n\nexport const longPress = directive(LongPressDirective);\n\nexport type { LongPressDirective };\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/components/tag/tag.component.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property } from 'lit/decorators.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIconButton from '../icon-button/icon-button.component.js';\nimport styles from './tag.styles.js';\nimport customStyles from './tag.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Tags are used as labels to organize things or to indicate a selection.\n * @documentation https://synergy.style/components/tag\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - The tag's content.\n *\n * @event syn-remove - Emitted when the remove button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart content - The tag's content.\n * @csspart remove-button - The tag's remove button, an `<syn-icon-button>`.\n * @csspart remove-button__base - The remove button's exported `base` part.\n */\nexport default class SynTag extends SynergyElement {\n static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n static dependencies = { 'syn-icon-button': SynIconButton };\n\n private readonly localize = new LocalizeController(this);\n\n /** The tag's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Makes the tag removable and shows a remove button. */\n @property({ type: Boolean }) removable = false;\n\n private handleRemoveClick() {\n this.emit('syn-remove');\n }\n\n render() {\n return html`\n <span\n part=\"base\"\n class=${classMap({\n tag: true,\n\n // Sizes\n 'tag--small': this.size === 'small',\n 'tag--medium': this.size === 'medium',\n 'tag--large': this.size === 'large',\n\n // Modifiers\n 'tag--removable': this.removable\n })}\n >\n <slot part=\"content\" class=\"tag__content\"></slot>\n\n ${this.removable\n ? html`\n <syn-icon-button\n part=\"remove-button\"\n exportparts=\"base:remove-button__base\"\n name=\"x-lg\"\n library=\"system\"\n label=${this.localize.term('remove')}\n class=\"tag__remove\"\n @click=${this.handleRemoveClick}\n tabindex=\"-1\"\n ></syn-icon-button>\n `\n : ''}\n </span>\n `;\n }\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAQA,SAAS,gBAAgB;AACzB,SAAS,YAAY;AAErB,SAAS,gBAAgB;AAyBzB,IAAqB,SAArB,cAAoC,eAAe;AAAA,EAAnD;AAAA;AAIE,SAAiB,WAAW,IAAI,mBAAmB,IAAI;AAG1B,gBAAqC;AAGrC,qBAAY;AAAA;AAAA,EAEjC,oBAAoB;AAC1B,SAAK,KAAK,YAAY;AAAA,EACxB;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,KAAK;AAAA;AAAA,MAGL,cAAc,KAAK,SAAS;AAAA,MAC5B,eAAe,KAAK,SAAS;AAAA,MAC7B,cAAc,KAAK,SAAS;AAAA;AAAA,MAG5B,kBAAkB,KAAK;AAAA,IACzB,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,UAIA,KAAK,YACH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMY,KAAK,SAAS,KAAK,QAAQ,CAAC;AAAA;AAAA,yBAE3B,KAAK,iBAAiB;AAAA;AAAA;AAAA,gBAInC,EAAE;AAAA;AAAA;AAAA,EAGZ;AACF;AAnDqB,OACZ,SAAyB,CAAC,0BAAiB,oBAAQ,yBAAY;AADnD,OAEZ,eAAe,EAAE,mBAAmB,cAAc;AAK5B;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAPR,OAOU;AAGA;AAAA,EAA5B,SAAS,EAAE,MAAM,QAAQ,CAAC;AAAA,GAVR,OAUU;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/components/accordion/accordion.component.ts"],
|
|
4
|
-
"sourcesContent": ["import { html } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport type { CSSResultGroup } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport styles from './accordion.styles.js';\nimport type SynDetails from '../details/details.component.js';\n\n/**\n * @summary Accordions provide the ability to group a list of `<syn-details>`.\n *\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-accordion--docs\n * @status stable\n * @since 1.23.0\n *\n * @slot - The accordion's main content. Must be `<syn-details />` elements.\n *\n * @csspart base - The component's base wrapper.\n */\nexport default class SynAccordion extends SynergyElement {\n static styles: CSSResultGroup = [\n componentStyles,\n styles,\n ];\n\n @queryAssignedElements({ selector: 'syn-details' }) detailsInDefaultSlot!: SynDetails[];\n\n /**\n * Indicates whether or not multiple `<syn-detail>` elements can be open at the same time.\n */\n @property({ attribute: 'close-others', type: Boolean }) closeOthers = false;\n\n /** Draws the accordion and the slotted `<syn-details>` as contained elements. */\n @property({ reflect: true, type: Boolean }) contained = false;\n\n /** The size that should be applied to all slotted `<syn-details>` elements */\n @property({ reflect: true }) size: 'medium' | 'large' = 'medium';\n\n private adjustDetailsSize() {\n this.detailsInDefaultSlot.forEach(detail => {\n detail.setAttribute('size', this.size);\n });\n }\n\n private adjustDetailsContained() {\n this.detailsInDefaultSlot.forEach(detail => {\n // eslint-disable-next-line no-param-reassign\n detail.contained = this.contained;\n });\n }\n\n @watch('size', { waitUntilFirstUpdate: true })\n handleSizeChange() {\n this.adjustDetailsSize();\n }\n\n @watch('contained', { waitUntilFirstUpdate: true })\n handleContainedChange() {\n this.adjustDetailsContained();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('syn-show', this.handleAccordionShow);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('syn-show', this.handleAccordionShow);\n }\n\n handleSlotChange() {\n this.adjustDetailsSize();\n this.adjustDetailsContained();\n }\n\n private handleAccordionShow = (event: Event) => {\n if (this.closeOthers) {\n this.detailsInDefaultSlot.forEach(detailsElement => {\n // Break if detailsElement sent the event\n if (detailsElement === event.target) {\n return;\n }\n // Break if detailsElement is outside this group\n if (detailsElement.parentNode !== (event.target as HTMLUnknownElement).parentNode) {\n return;\n }\n detailsElement.removeAttribute('open');\n });\n }\n };\n\n render() {\n /* eslint-disable @typescript-eslint/unbound-method */\n return html`\n <div \n part=\"base\"\n class=${classMap({\n accordion: true,\n 'accordion--contained': this.contained,\n })}>\n <slot @slotchange=${this.handleSlotChange}></slot>\n </div>\n `;\n /* eslint-enable @typescript-eslint/unbound-method */\n }\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA,SAAS,YAAY;AACrB,SAAS,UAAU,6BAA6B;AAEhD,SAAS,gBAAgB;AAkBzB,IAAqB,eAArB,cAA0C,eAAe;AAAA,EAAzD;AAAA;AAW0D,uBAAc;AAG1B,qBAAY;AAG3B,gBAA2B;AAwCxD,SAAQ,sBAAsB,CAAC,UAAiB;AAC9C,UAAI,KAAK,aAAa;AACpB,aAAK,qBAAqB,QAAQ,oBAAkB;AAElD,cAAI,mBAAmB,MAAM,QAAQ;AACnC;AAAA,UACF;AAEA,cAAI,eAAe,eAAgB,MAAM,OAA8B,YAAY;AACjF;AAAA,UACF;AACA,yBAAe,gBAAgB,MAAM;AAAA,QACvC,CAAC;AAAA,MACH;AAAA,IACF;AAAA;AAAA,EApDQ,oBAAoB;AAC1B,SAAK,qBAAqB,QAAQ,YAAU;AAC1C,aAAO,aAAa,QAAQ,KAAK,IAAI;AAAA,IACvC,CAAC;AAAA,EACH;AAAA,EAEQ,yBAAyB;AAC/B,SAAK,qBAAqB,QAAQ,YAAU;AAE1C,aAAO,YAAY,KAAK;AAAA,IAC1B,CAAC;AAAA,EACH;AAAA,EAGA,mBAAmB;AACjB,SAAK,kBAAkB;AAAA,EACzB;AAAA,EAGA,wBAAwB;AACtB,SAAK,uBAAuB;AAAA,EAC9B;AAAA,EAEA,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,iBAAiB,YAAY,KAAK,mBAAmB;AAAA,EAC5D;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAqB;AAC3B,SAAK,oBAAoB,YAAY,KAAK,mBAAmB;AAAA,EAC/D;AAAA,EAEA,mBAAmB;AACjB,SAAK,kBAAkB;AACvB,SAAK,uBAAuB;AAAA,EAC9B;AAAA,EAkBA,SAAS;AAEP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,WAAW;AAAA,MACX,wBAAwB,KAAK;AAAA,IAC/B,CAAC,CAAC;AAAA,4BACkB,KAAK,gBAAgB;AAAA;AAAA;AAAA,EAI/C;AACF;AAvFqB,aACZ,SAAyB;AAAA,EAC9B;AAAA,EACA;AACF;AAEoD;AAAA,EAAnD,sBAAsB,EAAE,UAAU,cAAc,CAAC;AAAA,GAN/B,aAMiC;AAKI;AAAA,EAAvD,SAAS,EAAE,WAAW,gBAAgB,MAAM,QAAQ,CAAC;AAAA,GAXnC,aAWqC;AAGZ;AAAA,EAA3C,SAAS,EAAE,SAAS,MAAM,MAAM,QAAQ,CAAC;AAAA,GAdvB,aAcyB;AAGf;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAjBR,aAiBU;AAgB7B;AAAA,EADC,MAAM,QAAQ,EAAE,sBAAsB,KAAK,CAAC;AAAA,GAhC1B,aAiCnB;AAKA;AAAA,EADC,MAAM,aAAa,EAAE,sBAAsB,KAAK,CAAC;AAAA,GArC/B,aAsCnB;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/components/input/input.custom.styles.ts"],
|
|
4
|
-
"sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n /**\n * Fixes overflowing of the syn-input in flex and grid containers with fix width (https://github.com/synergy-design-system/synergy-design-system/issues/761)\n */\n .input__control {\n width: 100%;\n }\n\n /**\n * Min-width size adjusted for each size so 2 full digits are shown for type number\n */ \n \n :host([size=\"small\"][type=\"number\"]:not([no-spin-buttons])) {\n min-width: calc(var(--syn-input-font-size-small)*8.3);\n }\n\n :host([size=\"medium\"][type=\"number\"]:not([no-spin-buttons])) {\n min-width: calc(var(--syn-input-font-size-medium)*9.4);\n }\n\n :host([size=\"large\"][type=\"number\"]:not([no-spin-buttons])) {\n min-width: calc(var(--syn-input-font-size-large)*10);\n }\n\n /**\n * Clearable + Password Toggle\n */\n .input__clear {\n color: var(--syn-input-icon-icon-clearable-color);\n }\n\n .input--small .input__clear,\n .input--small .input__password-toggle {\n font-size: var(--syn-font-size-medium);\n padding-left: var(--syn-spacing-x-small);\n padding-right: var(--syn-spacing-small);\n width: auto;\n }\n\n .input--medium .input__clear,\n .input--medium .input__password-toggle {\n font-size: var(--syn-font-size-x-large);\n padding-left: var(--syn-spacing-small);\n padding-right: var(--syn-spacing-medium);\n width: auto;\n }\n\n .input--large .input__clear,\n .input--large .input__password-toggle {\n font-size: var(--syn-font-size-2x-large);\n padding-left: var(--syn-spacing-medium);\n padding-right: var(--syn-spacing-large);\n width: auto;\n }\n\n /* Prefix / Suffix color */\n .input__prefix ::slotted(*),\n .input__suffix ::slotted(*) {\n color: var(--syn-input-icon-color);\n }\n\n\n /* PADDINGS */\n .input--small .input__control {\n padding: var(--syn-spacing-3x-small) var(--syn-input-spacing-small);\n }\n\n .input--medium .input__control {\n padding: var(--syn-spacing-x-small) var(--syn-input-spacing-medium);\n }\n\n .input--large .input__control {\n padding: var(--syn-input-spacing-small) var(--syn-input-spacing-large);\n }\n\n .input--small .input__prefix ::slotted(*) {\n margin-inline: var(--syn-input-spacing-small) var(--syn-spacing-x-small);\n }\n\n .input--medium .input__prefix ::slotted(*) {\n margin-inline: var(--syn-input-spacing-medium) var(--syn-input-spacing-small);\n }\n\n .input--large .input__prefix ::slotted(*) {\n margin-inline: var(--syn-input-spacing-large) var(--syn-input-spacing-medium);\n }\n\n .input--small .input__suffix ::slotted(*) {\n margin-inline: var(--syn-spacing-x-small) var(--syn-input-spacing-small);\n }\n\n .input--medium .input__suffix ::slotted(*) {\n margin-inline: var(--syn-input-spacing-small) var(--syn-input-spacing-medium);\n }\n\n .input--large .input__suffix ::slotted(*) {\n margin-inline: var(--syn-input-spacing-medium) var(--syn-input-spacing-large);\n }\n\n .input__clear + .input__suffix ::slotted(*),\n .input__password-toggle + .input__suffix ::slotted(*) {\n margin-inline-start: 0; \n }\n\n .input--small .input__clear + .input__password-toggle {\n padding-left: var(--syn-spacing-2x-small);\n }\n\n .input--medium .input__clear + .input__password-toggle {\n padding-left: calc(var(--syn-spacing-2x-small) + var(--syn-spacing-3x-small));\n }\n\n .input--large .input__clear + .input__password-toggle {\n padding-left: var(--syn-spacing-x-small);\n }\n\n .input--small .input__clear:has(+ .input__password-toggle) {\n padding-right: var(--syn-spacing-2x-small);\n }\n\n .input--medium .input__clear:has(+ .input__password-toggle) {\n padding-right: calc(var(--syn-spacing-2x-small) + var(--syn-spacing-3x-small));\n }\n\n .input--large .input__clear:has(+ .input__password-toggle) {\n padding-right: var(--syn-spacing-x-small);\n }\n\n .form-control--has-suffix .input--large .input__clear:has(+ .input__suffix),\n .form-control--has-suffix .input--large .input__password-toggle:has(+ .input__suffix) {\n padding-right: var(--syn-spacing-medium);\n }\n\n .form-control--has-suffix .input--small .input__clear:has(+ .input__suffix),\n .form-control--has-suffix .input--small .input__password-toggle:has(+ .input__suffix) {\n padding-right: var(--syn-spacing-x-small);\n }\n\n .form-control--has-suffix .input--medium .input__clear:has(+ .input__suffix),\n .form-control--has-suffix .input--medium .input__password-toggle:has(+ .input__suffix) {\n padding-right: var(--syn-spacing-small);\n }\n\n :host([type='number']) .input--large:not(.input--no-spin-buttons) .input__clear,\n :host([type='number']) .input--large:not(.input--no-spin-buttons) .input__password-toggle {\n padding-right: var(--syn-spacing-medium);\n }\n\n /* ICONS SIZE */\n .input--small .input__prefix ::slotted(syn-icon),\n .input--small .input__suffix ::slotted(syn-icon) {\n font-size: var(--syn-font-size-medium);\n }\n\n .input--medium .input__prefix ::slotted(syn-icon),\n .input--medium .input__suffix ::slotted(syn-icon) {\n font-size: var(--syn-font-size-x-large);\n }\n\n .input--large .input__prefix ::slotted(syn-icon),\n .input--large .input__suffix ::slotted(syn-icon) {\n font-size: var(--syn-font-size-2x-large);\n }\n\n :host([data-user-invalid]) .input--standard {\n border-color: var(--syn-input-border-color-focus-error);\n }\n\n :host([data-user-invalid]) .input--standard.input--focused:not(.input--disabled) {\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 .input--standard.input--disabled .input__suffix, \n .input--standard.input--disabled .input__prefix {\n cursor: not-allowed;\n } \n\n\n /**\n * Number stepper\n */\n .input__number-stepper {\n align-items: center;\n display: flex;\n }\n\n .input--small .input__number-stepper {\n margin-left: var(--syn-spacing-2x-small);\n }\n\n .input--medium .input__number-stepper {\n margin-right: var(--syn-spacing-2x-small);\n }\n\n .input--large .input__number-stepper {\n margin-right: var(--syn-spacing-x-small);\n }\n\n\n /**\n * Number stepper buttons\n */\n .input__number-stepper-button {\n align-items: center;\n background: none;\n border: none;\n color: var(--syn-color-primary-600);\n cursor: pointer;\n display: flex;\n padding: var(--syn-spacing-x-small);\n transition: var(--syn-transition-x-fast) color;\n }\n\n .input--small .input__number-stepper-button {\n font-size: var(--syn-font-size-medium);\n }\n\n .input--medium .input__number-stepper-button {\n font-size: var(--syn-font-size-x-large);\n }\n\n .input--large .input__number-stepper-button {\n font-size: var(--syn-font-size-2x-large);\n }\n\n .input__number-stepper-button:hover:not([disabled]) {\n color: var(--syn-color-primary-900)\n }\n\n .input__number-stepper-button:active:not([disabled]) {\n color: var(--syn-color-primary-950)\n }\n\n .input__number-stepper-button[disabled] {\n color: var(--syn-color-neutral-400);\n cursor: not-allowed;\n opacity: 0.5;\n }\n\n\n\n /**\n * Number stepper divider\n */\n .input--small .input__number-divider {\n height: var(--syn-font-size-medium);\n margin: 0;\n }\n\n .input--medium .input__number-divider {\n height: var(--syn-font-size-x-large);\n margin: 0 var(--syn-spacing-2x-small);\n }\n\n .input--large .input__number-divider {\n height: var(--syn-font-size-2x-large);\n margin: 0 var(--syn-spacing-x-small);\n }\n`;\n"],
|
|
5
|
-
"mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,8BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/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 @query('.textarea__size-adjuster') sizeAdjuster: 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 prevents layout shifts. We use `clientHeight` instead of `scrollHeight` to account for if the `<textarea>` has a max-height set on it. In my tests, this has worked fine. Im not aware of any edge cases. [Konnor]\n this.sizeAdjuster.style.height = `${this.input.clientHeight}px`;\n this.input.style.height = 'auto';\n this.input.style.height = `${this.input.scrollHeight}px`;\n } else {\n this.input.style.height = '';\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 <!-- This \"adjuster\" exists to prevent layout shifting. https://github.com/synergy-design-system/synergy/issues/2180 -->\n <div part=\"textarea-adjuster\" class=\"textarea__size-adjuster\" ?hidden=${this.resize !== 'auto'}></div>\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
|
-
}
|