@synergy-design-system/components 2.35.0 → 2.37.0

package/dist/synergy.js

@@ -4,222 +4,222 @@ import {
 } from "./chunks/chunk.MTN5NM4A.js";
 import "./chunks/chunk.NKIYFJN2.js";
 import "./chunks/chunk.RSCUHBW3.js";
-import {
-  tooltip_default
-} from "./chunks/chunk.VC2Y4XOG.js";
 import {
   validate_default
-} from "./chunks/chunk.VUB7AUTU.js";
-import "./chunks/chunk.TSCTU4Z5.js";
-import "./chunks/chunk.ZTT7ZLYG.js";
-import "./chunks/chunk.MVM3NN6Y.js";
+} from "./chunks/chunk.OCJCQJRG.js";
 import {
-  tag_default
-} from "./chunks/chunk.W3EIIGEZ.js";
+  spinner_default
+} from "./chunks/chunk.BIX5HHIN.js";
 import {
   textarea_default
-} from "./chunks/chunk.SFZPEJFL.js";
-import "./chunks/chunk.73GDSLGR.js";
-import "./chunks/chunk.YBIBWRKC.js";
-import "./chunks/chunk.FQWBH6B3.js";
+} from "./chunks/chunk.5ZERQ36P.js";
 import {
-  tab_group_default
-} from "./chunks/chunk.LVFCUBEB.js";
+  tooltip_default
+} from "./chunks/chunk.J746BMOC.js";
+import "./chunks/chunk.POLBZVKJ.js";
+import "./chunks/chunk.KHT3SXDS.js";
+import "./chunks/chunk.MVM3NN6Y.js";
 import {
   tab_panel_default
-} from "./chunks/chunk.3ZLRUSNG.js";
-import "./chunks/chunk.OL7JOEWW.js";
-import "./chunks/chunk.XHWYGYMQ.js";
-import "./chunks/chunk.HVXG4JG6.js";
+} from "./chunks/chunk.DZOQWZN6.js";
 import {
-  switch_default
-} from "./chunks/chunk.FOKGA6XD.js";
+  tag_default
+} from "./chunks/chunk.46SHNPHN.js";
+import "./chunks/chunk.NDD6MJDX.js";
+import "./chunks/chunk.HQIVMAQI.js";
+import "./chunks/chunk.FQWBH6B3.js";
 import {
   tab_default
-} from "./chunks/chunk.652F5XWB.js";
-import "./chunks/chunk.3KSTKO5I.js";
-import "./chunks/chunk.ZW75HBAK.js";
-import "./chunks/chunk.43YNZAWL.js";
-import "./chunks/chunk.KGBBUUHS.js";
+} from "./chunks/chunk.CKJN6UYI.js";
+import {
+  tab_group_default
+} from "./chunks/chunk.XWPMFHWI.js";
+import "./chunks/chunk.2QK6QP53.js";
 import "./chunks/chunk.XOXVVU5C.js";
 import "./chunks/chunk.PKYC7QF3.js";
+import "./chunks/chunk.IS2S5SXW.js";
+import "./chunks/chunk.XHWYGYMQ.js";
+import "./chunks/chunk.HVXG4JG6.js";
 import {
   side_nav_default
-} from "./chunks/chunk.VS76PRPX.js";
+} from "./chunks/chunk.TB64UK3H.js";
 import {
-  spinner_default
-} from "./chunks/chunk.MJABBGBF.js";
-import "./chunks/chunk.UFNOEXUF.js";
-import "./chunks/chunk.W5JK7V7K.js";
+  switch_default
+} from "./chunks/chunk.FEHMBCVV.js";
+import "./chunks/chunk.ML4VTAHP.js";
+import "./chunks/chunk.3QYBPNXR.js";
 import "./chunks/chunk.4TB35TYG.js";
+import "./chunks/chunk.YC2IAAVO.js";
+import "./chunks/chunk.JMMSJRM5.js";
+import "./chunks/chunk.43YNZAWL.js";
 import {
   select_default
-} from "./chunks/chunk.S3HG4A73.js";
-import "./chunks/chunk.IDQQC4SZ.js";
-import "./chunks/chunk.G6KAIGTJ.js";
+} from "./chunks/chunk.MVEDYBC2.js";
+import "./chunks/chunk.THAYYJIK.js";
+import "./chunks/chunk.KI2YQUOS.js";
 import "./chunks/chunk.VN2PSQ4U.js";
 import "./chunks/chunk.6EPU7YUS.js";
-import "./chunks/chunk.4DW7CR6A.js";
+import "./chunks/chunk.DOOJ2WJ7.js";
 import "./chunks/chunk.XTWO6ZZW.js";
 import "./chunks/chunk.VECCQZP5.js";
-import "./chunks/chunk.XG2E4YUG.js";
+import "./chunks/chunk.2FGVPDNK.js";
 import "./chunks/chunk.FWLUR33I.js";
 import {
   range_default
-} from "./chunks/chunk.BREJYNAC.js";
-import "./chunks/chunk.5PQO6UFV.js";
-import "./chunks/chunk.GVTOUMYU.js";
+} from "./chunks/chunk.TXLUJHXR.js";
+import "./chunks/chunk.MFNYXS3L.js";
+import "./chunks/chunk.H5MKBOJS.js";
 import "./chunks/chunk.YT5SHGUK.js";
 import "./chunks/chunk.O644HRW3.js";
 import "./chunks/chunk.UFNQFJO6.js";
 import "./chunks/chunk.236RSW67.js";
 import {
   range_tick_default
-} from "./chunks/chunk.ZMWDR32Q.js";
-import "./chunks/chunk.ZI7INRQL.js";
+} from "./chunks/chunk.J3WXULAA.js";
+import "./chunks/chunk.DEQGTKN2.js";
 import "./chunks/chunk.I6YARDHH.js";
-import "./chunks/chunk.5V52TK7M.js";
+import "./chunks/chunk.36AENKLP.js";
 import "./chunks/chunk.OI3HOOCT.js";
 import {
   radio_default
-} from "./chunks/chunk.GMUPLORF.js";
+} from "./chunks/chunk.IXMEJYCK.js";
 import {
   radio_button_default
-} from "./chunks/chunk.ZOCRYJXE.js";
-import "./chunks/chunk.7BGVLHIA.js";
+} from "./chunks/chunk.3UCGSL2Z.js";
+import "./chunks/chunk.CWYJMTQX.js";
 import "./chunks/chunk.4BRJ5OJE.js";
 import {
   radio_group_default
-} from "./chunks/chunk.VFQNYEU5.js";
-import "./chunks/chunk.HQSNEDLJ.js";
+} from "./chunks/chunk.AMXX35WQ.js";
+import "./chunks/chunk.LJACECJI.js";
 import "./chunks/chunk.32LFHSM5.js";
 import "./chunks/chunk.K62NPKGN.js";
 import {
   progress_bar_default
-} from "./chunks/chunk.EEFZAOU4.js";
+} from "./chunks/chunk.GFYHBLWB.js";
 import {
   progress_ring_default
-} from "./chunks/chunk.WRLYXKKC.js";
-import "./chunks/chunk.5BTH3IYF.js";
+} from "./chunks/chunk.SUJP6FA3.js";
+import "./chunks/chunk.UNEXTU6K.js";
 import "./chunks/chunk.2V3HGTTL.js";
 import "./chunks/chunk.RMIDAEF5.js";
-import "./chunks/chunk.VEXCRQM4.js";
-import "./chunks/chunk.UUB3PWNM.js";
+import "./chunks/chunk.W3HO2MWD.js";
+import "./chunks/chunk.34TP5THB.js";
 import "./chunks/chunk.EHSNF4SS.js";
 import {
   popup_default
-} from "./chunks/chunk.5DRUEWHQ.js";
+} from "./chunks/chunk.JQWRQAKY.js";
 import {
   prio_nav_default
-} from "./chunks/chunk.VPXGBPBV.js";
-import "./chunks/chunk.GRTFHVLZ.js";
+} from "./chunks/chunk.Q3HBCPLU.js";
+import "./chunks/chunk.2OCZ2TBK.js";
 import "./chunks/chunk.74N5WLM5.js";
 import "./chunks/chunk.OJ3N7TWP.js";
-import "./chunks/chunk.JWUGHFUS.js";
+import "./chunks/chunk.2STXKNFJ.js";
 import "./chunks/chunk.AMAK44YX.js";
 import "./chunks/chunk.QUM76UHV.js";
 import {
   option_default
-} from "./chunks/chunk.OSFUGDF5.js";
+} from "./chunks/chunk.KS25ZGUM.js";
 import {
   menu_label_default
-} from "./chunks/chunk.7K7OU2RK.js";
+} from "./chunks/chunk.UW32CNTV.js";
 import {
   nav_item_default
-} from "./chunks/chunk.RATF44EV.js";
-import "./chunks/chunk.WMRTMWLO.js";
-import "./chunks/chunk.SHCZO4KK.js";
+} from "./chunks/chunk.QWVV77KY.js";
+import "./chunks/chunk.O3BSGTMP.js";
+import "./chunks/chunk.5V47GZA4.js";
 import {
   optgroup_default
-} from "./chunks/chunk.H7H6X2QD.js";
-import "./chunks/chunk.5OJFKC6H.js";
+} from "./chunks/chunk.CTNUTHO5.js";
+import "./chunks/chunk.KICVSHKN.js";
 import "./chunks/chunk.MJ7R4QQT.js";
 import {
   menu_default
-} from "./chunks/chunk.NNUZVMCX.js";
+} from "./chunks/chunk.OOE2YMN3.js";
 import {
   menu_item_default
-} from "./chunks/chunk.LIT4J7RV.js";
-import "./chunks/chunk.ASOZC7EV.js";
-import "./chunks/chunk.R24T7WQN.js";
+} from "./chunks/chunk.AE5M2C5T.js";
+import "./chunks/chunk.ZBLNDW3L.js";
+import "./chunks/chunk.JQ5WZR46.js";
 import "./chunks/chunk.FSWTBNSI.js";
 import "./chunks/chunk.V4HPWQE7.js";
-import "./chunks/chunk.SV42BWCV.js";
+import "./chunks/chunk.3FUFHMNW.js";
 import "./chunks/chunk.RAOPZXJL.js";
 import "./chunks/chunk.X6GR6IA2.js";
 import {
   input_default
-} from "./chunks/chunk.ELW4NLFW.js";
-import "./chunks/chunk.IH35LOE2.js";
-import "./chunks/chunk.HX3IWSE5.js";
+} from "./chunks/chunk.47M4TTNO.js";
+import "./chunks/chunk.CAV3YFM2.js";
+import "./chunks/chunk.M6PF4GYJ.js";
 import "./chunks/chunk.XAQKFEHH.js";
-import "./chunks/chunk.XLMTAQNW.js";
+import "./chunks/chunk.JSPSHI27.js";
 import "./chunks/chunk.AVZITCPQ.js";
 import "./chunks/chunk.C2CWYCOU.js";
 import {
   icon_button_default
-} from "./chunks/chunk.IMM7OIW2.js";
+} from "./chunks/chunk.LISD3B36.js";
 import "./chunks/chunk.NFXT5LNY.js";
 import {
   file_default
-} from "./chunks/chunk.22WZ3N4X.js";
+} from "./chunks/chunk.2CKZ3T3A.js";
 import {
   header_default
-} from "./chunks/chunk.D33UQBH6.js";
-import "./chunks/chunk.JMLDFGMB.js";
+} from "./chunks/chunk.DSWE3XQ7.js";
+import "./chunks/chunk.D7UI7OZG.js";
 import "./chunks/chunk.5T3OGIGW.js";
 import {
   icon_default
-} from "./chunks/chunk.UI5Y2DGS.js";
+} from "./chunks/chunk.NWIDBLP5.js";
 import {
   drawer_default
-} from "./chunks/chunk.M5A5KVL7.js";
+} from "./chunks/chunk.PDNAUHBS.js";
 import {
   dropdown_default
-} from "./chunks/chunk.ITKE5EIU.js";
-import "./chunks/chunk.5KRECKTA.js";
+} from "./chunks/chunk.W3EQ7P2G.js";
+import "./chunks/chunk.DMPOPGWM.js";
 import "./chunks/chunk.2KYFCKCK.js";
 import "./chunks/chunk.D6IIQDWJ.js";
-import "./chunks/chunk.MRA4XPU4.js";
-import "./chunks/chunk.IKZOQ7AE.js";
+import "./chunks/chunk.ZEAHOW7W.js";
+import "./chunks/chunk.CW2Q7KG6.js";
 import {
   dialog_default
-} from "./chunks/chunk.ERM4GPJA.js";
+} from "./chunks/chunk.IWUYYLG4.js";
 import {
   divider_default
-} from "./chunks/chunk.FVZ56RQA.js";
-import "./chunks/chunk.E5Q5IE2L.js";
+} from "./chunks/chunk.XQQ3YLO6.js";
+import "./chunks/chunk.Z7HK2AZP.js";
 import "./chunks/chunk.FA6V2WD6.js";
 import "./chunks/chunk.FSZIE7IO.js";
-import "./chunks/chunk.DW552CQN.js";
+import "./chunks/chunk.2NDMO3KR.js";
 import "./chunks/chunk.N7QJ54ZM.js";
 import "./chunks/chunk.I4FIU7FA.js";
 import {
   details_default
-} from "./chunks/chunk.RWKR5IQK.js";
-import "./chunks/chunk.PPBC2A4D.js";
-import "./chunks/chunk.PU2BDR2W.js";
+} from "./chunks/chunk.VCAMLCSZ.js";
+import "./chunks/chunk.OJZ4TA2H.js";
+import "./chunks/chunk.KX43XLOR.js";
 import "./chunks/chunk.VA26EAEP.js";
-import "./chunks/chunk.LSWX22UR.js";
+import "./chunks/chunk.VAJ4V332.js";
 import "./chunks/chunk.MU43DZ7W.js";
 import "./chunks/chunk.AYAX7BG7.js";
 import "./chunks/chunk.G76BKD7B.js";
 import "./chunks/chunk.IU3SSJZE.js";
 import {
   checkbox_default
-} from "./chunks/chunk.ZJ7WVLF3.js";
-import "./chunks/chunk.IHPLG57I.js";
-import "./chunks/chunk.6IRAPT75.js";
+} from "./chunks/chunk.QSWKPBFP.js";
+import "./chunks/chunk.F3T5JFJS.js";
+import "./chunks/chunk.Y3LNC7J6.js";
 import "./chunks/chunk.6OX2AX3Z.js";
 import {
   combobox_default
-} from "./chunks/chunk.YPJFEDZP.js";
-import "./chunks/chunk.PHLPBWXY.js";
-import "./chunks/chunk.EMQOPT2J.js";
-import "./chunks/chunk.IJQ7XW3N.js";
+} from "./chunks/chunk.K2CIQQ3Y.js";
+import "./chunks/chunk.B6KOTGTB.js";
+import "./chunks/chunk.CTNBYRG5.js";
+import "./chunks/chunk.G3KRSXVI.js";
 import "./chunks/chunk.IVM3BGRH.js";
 import "./chunks/chunk.ARR23WUY.js";
-import "./chunks/chunk.I3OZNLMM.js";
+import "./chunks/chunk.TAND6PH5.js";
 import "./chunks/chunk.AZ3N5IOO.js";
 import {
   defaultOptionRenderer,
@@ -228,67 +228,67 @@ import {
 import "./chunks/chunk.S6AC4UW6.js";
 import "./chunks/chunk.5732DMBC.js";
 import "./chunks/chunk.3NXKLKWH.js";
-import "./chunks/chunk.AERTEAG5.js";
+import "./chunks/chunk.G4URZQCL.js";
 import "./chunks/chunk.EWVMF6KH.js";
 import "./chunks/chunk.QC7X32ZP.js";
-import "./chunks/chunk.PY4VOF4Y.js";
+import "./chunks/chunk.GTAE5OSA.js";
 import {
   button_default
-} from "./chunks/chunk.DR7U5IWC.js";
+} from "./chunks/chunk.XKEL7VB6.js";
 import {
   button_group_default
-} from "./chunks/chunk.37RHIHIK.js";
-import "./chunks/chunk.K6ZDOHMR.js";
+} from "./chunks/chunk.23FIXOCL.js";
+import "./chunks/chunk.WHMSQOLY.js";
 import "./chunks/chunk.GRVNUIP2.js";
 import {
   card_default
-} from "./chunks/chunk.6Q7ZZ2S5.js";
-import "./chunks/chunk.UAZIYU7B.js";
+} from "./chunks/chunk.AFQE4SUD.js";
+import "./chunks/chunk.DU2BULT5.js";
 import "./chunks/chunk.QMLSKYXR.js";
 import "./chunks/chunk.C4JTZKPZ.js";
 import {
   breadcrumb_default
-} from "./chunks/chunk.WAYKRG2H.js";
+} from "./chunks/chunk.F5SALGKS.js";
 import {
   breadcrumb_item_default
-} from "./chunks/chunk.2NZCWJWI.js";
-import "./chunks/chunk.HHYSMTYQ.js";
+} from "./chunks/chunk.4XX7ABTH.js";
+import "./chunks/chunk.N6RQUVT2.js";
 import "./chunks/chunk.NGIGPLN2.js";
 import "./chunks/chunk.O6ZH6AOI.js";
-import "./chunks/chunk.ZEYX7C5V.js";
-import "./chunks/chunk.TXGDI2P7.js";
+import "./chunks/chunk.L3Y7WEBQ.js";
+import "./chunks/chunk.VDNTOYHO.js";
 import "./chunks/chunk.AWJ376R6.js";
 import "./chunks/chunk.JLXCLATV.js";
 import "./chunks/chunk.HP2LEQRU.js";
-import "./chunks/chunk.UBS3CSG4.js";
+import "./chunks/chunk.VWY2RG4F.js";
 import "./chunks/chunk.5SQ7NVBX.js";
 import {
   alert_default
-} from "./chunks/chunk.HRRGC2YY.js";
+} from "./chunks/chunk.THB5JTCU.js";
 import {
   badge_default
-} from "./chunks/chunk.GSZB4MXT.js";
-import "./chunks/chunk.GDYTJLQR.js";
+} from "./chunks/chunk.BPN4N2Y5.js";
+import "./chunks/chunk.GHUFY3QR.js";
 import "./chunks/chunk.J6CGTLVH.js";
 import "./chunks/chunk.Y5TMYX2L.js";
-import "./chunks/chunk.NC5YH2BX.js";
+import "./chunks/chunk.4HZC7SKZ.js";
 import "./chunks/chunk.32CYREEV.js";
 import "./chunks/chunk.S22BO5SF.js";
 import {
   accordion_default
-} from "./chunks/chunk.JWSKTZWZ.js";
-import "./chunks/chunk.5CVR7LNC.js";
+} from "./chunks/chunk.ZZ2NCSVI.js";
+import "./chunks/chunk.GZF623O3.js";
 import "./chunks/chunk.WNUZ6LH4.js";
-import "./chunks/chunk.LTNGZLJS.js";
+import "./chunks/chunk.3QGKR6WP.js";
 import "./chunks/chunk.WXVOTRW5.js";
-import "./chunks/chunk.DZFLMUUI.js";
-import "./chunks/chunk.6QYKWCSO.js";
+import "./chunks/chunk.44H5FTVJ.js";
+import "./chunks/chunk.YST4XUIG.js";
 import "./chunks/chunk.DZ7YIR5N.js";
 import "./chunks/chunk.C2ENQBPM.js";
 import "./chunks/chunk.G6ITZTTW.js";
 import "./chunks/chunk.7JGKUB4A.js";
 import "./chunks/chunk.WVVQK5TE.js";
-import "./chunks/chunk.4VA5RT47.js";
+import "./chunks/chunk.DO3VTFPG.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
@@ -316,7 +316,7 @@ import "./chunks/chunk.6QJYD7WX.js";
 import "./chunks/chunk.RB2JR2ND.js";
 import "./chunks/chunk.BVZQ6QSY.js";
 import "./chunks/chunk.NLYVOJGK.js";
-import "./chunks/chunk.QJUAY4YD.js";
+import "./chunks/chunk.AFZ5JDGZ.js";
 import "./chunks/chunk.QBHZAR4C.js";
 import "./chunks/chunk.BXY667C7.js";
 import "./chunks/chunk.Z4XV3SMG.js";

package/dist/vscode.html-custom-data.json

@@ -30,22 +30,12 @@
       ]
     },
     {
-      "name": "syn-alert",
-      "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.",
+      "name": "syn-badge",
+      "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.",
       "attributes": [
-        {
-          "name": "open",
-          "description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
-          "values": []
-        },
-        {
-          "name": "closable",
-          "description": "Enables a close button that allows the user to dismiss the alert.",
-          "values": []
-        },
         {
           "name": "variant",
-          "description": "The alert's theme variant.",
+          "description": "The badge's theme variant.",
           "values": [
             { "name": "primary" },
             { "name": "success" },
@@ -53,27 +43,32 @@
             { "name": "warning" },
             { "name": "danger" }
           ]
-        },
-        {
-          "name": "duration",
-          "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
-          "values": []
         }
       ],
       "references": [
         {
           "name": "Documentation",
-          "url": "https://synergy-design-system.github.io/?path=/docs/components-syn-alert--docs"
+          "url": "https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs"
         }
       ]
     },
     {
-      "name": "syn-badge",
-      "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.",
+      "name": "syn-alert",
+      "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.",
       "attributes": [
+        {
+          "name": "open",
+          "description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
+          "values": []
+        },
+        {
+          "name": "closable",
+          "description": "Enables a close button that allows the user to dismiss the alert.",
+          "values": []
+        },
         {
           "name": "variant",
-          "description": "The badge's theme variant.",
+          "description": "The alert's theme variant.",
           "values": [
             { "name": "primary" },
             { "name": "success" },
@@ -81,12 +76,17 @@
             { "name": "warning" },
             { "name": "danger" }
           ]
+        },
+        {
+          "name": "duration",
+          "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
+          "values": []
         }
       ],
       "references": [
         {
           "name": "Documentation",
-          "url": "https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs"
+          "url": "https://synergy-design-system.github.io/?path=/docs/components-syn-alert--docs"
         }
       ]
     },

package/package.json

@@ -4,7 +4,7 @@
     "url": "https://www.sick.com"
   },
   "name": "@synergy-design-system/components",
-  "version": "2.35.0",
+  "version": "2.37.0",
   "description": "",
   "repository": {
     "type": "git",
@@ -100,9 +100,9 @@
     "unist-util-visit": "^5.0.0",
     "user-agent-data-types": "^0.4.2",
     "vendorism": "^5.0.0",
-    "@synergy-design-system/stylelint-config-syn": "0.1.0",
+    "@synergy-design-system/eslint-config-syn": "0.1.0",
     "@synergy-design-system/tokens": "2.20.0",
-    "@synergy-design-system/eslint-config-syn": "0.1.0"
+    "@synergy-design-system/stylelint-config-syn": "0.1.0"
   },
   "release": {
     "branches": [

package/dist/chunks/chunk.4DW7CR6A.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/select/select.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\nimport sharedOptionSize from '../option/option-size.styles.js';\n\nexport default css`\n  /**\n   * Invalid user data\n   */\n  :host([data-user-invalid]) .select__combobox {\n    border-color: var(--syn-input-border-color-focus-error);\n  }\n\n  :host([data-user-invalid]) .select--standard:not(.select--disabled).select--open .select__combobox,\n  :host([data-user-invalid]) .select--standard:not(.select--disabled).select--focused .select__combobox {\n    border-color: var(--syn-input-border-color-focus-error);\n    box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-error);\n  }\n\n  /* Clear button */\n  .select__clear {\n    color: var(--syn-input-icon-icon-clearable-color);\n    font-size: var(--syn-spacing-large);\n  }\n\n  .select--small .select__clear {\n    font-size: var(--syn-spacing-medium);\n  }\n\n  .select--large .select__clear {\n    font-size: var(--syn-spacing-x-large);\n  }\n\n  .select--medium .select__clear {\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  /* Expand icon */\n  .select__expand-icon {\n    color: var(--syn-color-neutral-950);\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  .select--small .select__expand-icon {\n    font-size: var(--syn-spacing-medium);\n  }\n\n  .select--medium .select__expand-icon {\n    font-size: var(--syn-spacing-large);\n  }\n\n  .select--large .select__expand-icon {\n    font-size: var(--syn-spacing-x-large);\n  }\n\n  /* Change select border on hover */\n  /* stylelint-disable-next-line no-descending-specificity */\n  .select:not(.select--disabled):hover .select__combobox {\n    border-color: var(--syn-input-color-hover);\n  }\n\n  /* Prefix and Suffix */\n\n  /* Small */\n  .select--small .select__prefix::slotted(*) {\n    margin-inline-end: var(--syn-spacing-x-small);\n  }\n\n  .select--small .select__suffix::slotted(*) {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n\n  .select--small .select__suffix::slotted(syn-icon),\n  .select--small .select__prefix::slotted(syn-icon) {\n    font-size: var(--syn-font-size-medium);\n  }\n\n  /* Medium */\n  .select--medium .select__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-small);\n  }\n\n  .select--medium .select__suffix::slotted(*) {\n    margin-inline-start: var(--syn-input-spacing-small);\n  }\n\n  .select--medium .select__suffix::slotted(syn-icon),\n  .select--medium .select__prefix::slotted(syn-icon) {\n    font-size: var(--syn-font-size-x-large);\n  }\n\n  /* Large */\n  .select--large .select__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-medium);\n  }\n\n  .select--large .select__suffix::slotted(*) {\n    margin-inline-start: var(--syn-input-spacing-medium);\n  }\n\n  .select--large .select__suffix::slotted(syn-icon),\n  .select--large .select__prefix::slotted(syn-icon) {\n    font-size: var(--syn-font-size-2x-large);\n  }\n\n\n  .select__prefix,\n  .select__suffix {\n    color: var(--syn-input-help-text-color);\n  }\n\n  /* Multi Select */\n  .select__tags {\n    margin-inline-start: var(--syn-spacing-medium);\n  }\n\n  .select--small .select__tags {\n    gap: var(--syn-spacing-2x-small);\n  }\n\n  .select--medium .select__tags {\n    gap: var(--syn-spacing-x-small);\n  }\n\n  .select--large .select__tags {\n    gap: var(--syn-spacing-small);\n  }\n\n  /* Listbox */\n  .select__listbox {\n    /* @todo: Should be --syn-border-radius-medium, which should be set to 0 */\n    border-radius: var(--syn-border-radius-none);\n    box-shadow: var(--syn-shadow-medium);\n  }\n\n  /**\n   * Make sure to hide the syn-divider for the first syn-optgroup\n   * Note! ::slotted does currently not work with ::part, so we\n   * opted for using a css variable here.\n   */\n  .select__listbox ::slotted(syn-optgroup:first-of-type) {\n    --display-divider: none;\n  }\n\n  /**\n   * #850: Allow to measure the size of the combobox.\n   * This is needed so we can automatically size and truncate the tags in the <syn-select multiple> component.\n   * Scoped to multiple to not break the single select per accident.\n   */\n  :host([multiple]) .select__tags {\n    min-width: 100px;\n    overflow: hidden;\n  }\n\n  :host([multiple]) .select__tags > div {\n    display: contents;\n  }\n\n  :host([multiple]) .select__tags > div > syn-tag {\n    --syn-tag-position-adjustment: var(--syn-spacing-3x-small);\n\n    max-width: var(--syn-select-tag-max-width);\n  }\n\n  :host([multiple]) .select__tags > div > syn-tag::part(content) {\n    display: initial;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  ${sharedOptionSize}\n`;\n"],
-  "mappings": ";;;;;AAAA,SAAS,WAAW;AAGpB,IAAO,+BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAsKX,0BAAgB;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.6IRAPT75.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/checkbox/checkbox.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .checkbox__control {\n    border-radius: var(--syn-input-border-radius-small);\n  }\n\n  :host([data-user-invalid]) .checkbox__control {\n    border-color: var(--syn-input-border-color-focus-error);\n  }\n\n  /**\n   * Hover\n   * Applies the hover state to the whole component\n   */\n  .checkbox:not(.checkbox--checked):not(.checkbox--disabled):hover .checkbox__control {\n    background-color: var(--syn-input-background-color-hover);\n    border-color: var(--syn-input-border-color-hover);\n  }\n\n  /**\n   * Checked/indeterminate + hover\n   * Applies the hover state to the whole component\n   */\n  .checkbox.checkbox--checked:not(.checkbox--disabled):hover .checkbox__control,\n  .checkbox.checkbox--indeterminate:not(.checkbox--disabled):hover .checkbox__control {\n    background-color: var(--syn-color-primary-900);\n    border-color: var(--syn-color-primary-900);\n  }\n\n  .checkbox__label {\n    line-height: var(--syn-line-height-normal);\n    margin-inline-start: var(--syn-spacing-x-small);\n    position: relative;\n  }\n\n  .checkbox--small .checkbox__label {\n    top: -3px;\n  }\n\n  .checkbox--medium .checkbox__label {\n    top: -3px;\n  }\n\n  .checkbox--large .checkbox__label {\n    top: -2px;\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,iCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.6QYKWCSO.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/icon-button/icon-button.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .icon-button {\n    border-radius: 0;\n    color: currentColor;\n    font-size: inherit;\n  }\n\n  .icon-button--disabled {\n    color: var(--syn-color-neutral-400);\n  }\n\n  /* Remove round borders */\n  .icon-button:focus-visible {\n    border-radius: var(--syn-border-radius-none);\n  }\n\n  /* Colors */\n  :host([color=\"currentColor\"]) {\n    color: currentColor;\n  }\n\n  :host([color=\"primary\"]),\n  :host([color=\"primary\"]) .icon-button:focus-visible:not(.icon-button--disabled) {\n    color: var(--syn-color-primary-600);\n  }\n\n  :host([color=\"primary\"]) .icon-button:hover:not(.icon-button--disabled) {\n    color: var(--syn-color-primary-900);\n  }\n\n  :host([color=\"primary\"]) .icon-button:active:not(.icon-button--disabled) {\n    color: var(--syn-color-primary-950);\n  }\n\n  :host([color=\"neutral\"]),\n  :host([color=\"neutral\"]) .icon-button:focus-visible:not(.icon-button--disabled):not(:hover) {\n    color: var(--syn-color-neutral-950);\n  }\n\n  /* Sizes */\n  .icon-button--small {\n    font-size: var(--syn-font-size-medium);\n  }\n\n  .icon-button--medium {\n    font-size: var(--syn-font-size-x-large);\n  }\n\n  .icon-button--large {\n    font-size: var(--syn-font-size-2x-large);\n  }\n\n  /* Force user to set \"label\" prop */\n  .icon-button[aria-label=\"\"] {\n    border: var(--syn-border-width-large) var(--syn-color-error-600) solid;\n  }\n\n  .icon-button[aria-label=\"\"]::after {\n    content: \"Set label prop for a11y to get rid of this text and border!\";\n    font-size: var(--syn-font-size-2x-small);\n    margin-left: var(--syn-spacing-2x-small);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,oCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.HX3IWSE5.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/input/input.custom.styles.ts"],
-  "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  /* Fixes wrong paddings on some suffix special cases: https://github.com/synergy-design-system/synergy-design-system/issues/817  */\n  .form-control--has-prefix .input__control {\n    padding-left: 0;\n  }\n\n  /* Fixes wrong paddings on some suffix special cases: https://github.com/synergy-design-system/synergy-design-system/issues/817  */\n  .form-control--has-suffix .input__control,\n  .input:has(.input__clear) .input__control,\n  .input:has(.input__password-toggle) .input__control {\n    padding-right: 0;\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"],
-  "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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.IJQ7XW3N.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/option/option.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  /**\n   * The syn-option is now able to adjust its height from a parent item\n   * This is done by exposing multiple css variables to the outside:\n   *\n   * --option-min-height (defaults to 48px) The minimal height of an element\n   * --option-padding (defaults to var(--syn-spacing-small) var(--syn-spacing-medium)) The padding to use\n   * --option-font-size (defaults to var(--syn-font-size-medium)) The font size to use\n   * --option-icon-size (defaults to var(--syn-spacing-large)) The size of the checkmark\n   * \n   * See below for usage of these variables\n   */\n  .option {\n    font-size: var(--option-font-size, var(--syn-font-size-medium));\n    \n    /* Height is dependent on line-height of .option__label, which does not fit completely to layout */\n    min-height: var(--option-min-height, var(--syn-input-height-medium));\n    padding: var(--option-padding, var(--syn-spacing-small) var(--syn-spacing-medium));\n  }\n\n  .option:not(.option--current) {\n    color: var(--syn-color-neutral-950);\n  }\n\n  .option__label {\n    line-height: var(--syn-line-height-normal);\n  }\n\n  .option__check {\n    color: var(--syn-color-primary-600);\n    font-size: var(--option-icon-size, var(--syn-spacing-large));\n  }\n\n  .option .option__check {\n    padding-inline-end: var(--syn-spacing-small);\n  }\n\n  /* Invert the check mark when keyboard navigation is used */\n  .option--current .option__check {\n    color: var(--syn-color-neutral-0);\n  }\n\n  /* Use larger spacing between icons and content */\n  .option__prefix::slotted(*) {\n    margin-inline-end: var(--syn-spacing-small);\n  }\n\n  .option__suffix::slotted(*) {\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  /* Set correct icon size when someone uses syn-icon in the slots */\n  .option__prefix::slotted(syn-icon),\n  .option__suffix::slotted(syn-icon) {\n    color: var(--syn-color-neutral-800);\n    font-size: var(--option-icon-size, var(--syn-spacing-large));\n  }\n\n  .option--current .option__prefix::slotted(syn-icon),\n  .option--current .option__suffix::slotted(syn-icon) {\n    color: var(--syn-color-neutral-0);\n  }\n\n  /* This is needed for the highlight styling of the options in syn-combobox */\n  .option__label::slotted(.syn-highlight-style) {\n    background-color: transparent;\n    color: var(--syn-color-neutral-950);\n    font: var(--syn-body-medium-bold);\n  }\n\n  :host([aria-selected='true']) .option__label::slotted(.syn-highlight-style) {\n    color: var(--syn-color-neutral-0);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,+BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.PU2BDR2W.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/details/details.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .details {\n    background-color: unset;\n    border-color: var(--syn-panel-border-color);\n    border-radius: var(--syn-border-radius-none);\n    border-width: 0 0 var(--syn-border-width-small);\n  }\n\n  .details--disabled {\n    opacity: var(--syn-opacity-50);\n  }\n\n  .details__summary-icon {\n    align-self: flex-start;\n    color: var(--syn-color-neutral-950);\n    font-size: var(--syn-spacing-large);\n\n    /**\n     * As we are using an alignment of \"start\"  instead of \"center\" make sure\n     * the arrow starts on the same visual line as the first line of headline text\n     */\n    position: relative;\n    top: 2px;\n  }\n\n  .details .details__summary {\n    color: var(--syn-typography-color-text);\n  }\n\n  .details__header {\n    gap: var(--syn-spacing-medium);\n  }\n\n  /**\n   * As we are using top/down arrows for the details element,\n   * we have to adjust the rotation of the icon when the details is open.\n   */\n  .details--open .details__summary-icon {\n    rotate: -180deg;\n  }\n\n  /**\n   * Adjustments for medium variant\n   */\n  .details--size-medium .details__header {\n    padding: var(--syn-spacing-medium-large) 0;\n  }\n\n  .details--size-medium .details__content {\n    font-size: var(--syn-font-size-small);\n    line-height: var(--syn-line-height-normal);\n    padding: var(--syn-spacing-medium) 0 var(--syn-spacing-large);\n  }\n\n  .details--size-medium .details__summary {\n    font: var(--syn-body-medium-regular);\n  }\n\n  .details--size-medium .details__summary::slotted(syn-icon) {\n    /* Avoid shrinking of the icon, if the text content of the summary is very long and multi line */\n    flex-shrink: 0;\n    font-size: var(--syn-spacing-large);\n    margin-right: var(--syn-spacing-small);\n  }\n\n  /**\n   * Adjustment for large variant\n   */\n  .details--size-large .details__header {\n    padding: var(--syn-spacing-large) 0;\n  }\n\n  .details--size-large .details__content {\n    font-size: var(--syn-font-size-medium);\n    line-height: var(--syn-line-height-normal);\n    padding: var(--syn-spacing-medium-large) 0 var(--syn-spacing-large);\n  }\n\n  .details--size-large .details__summary {\n    font: var(--syn-body-large-regular);\n  }\n\n  .details--size-large .details__summary-icon {\n    font-size: var(--syn-spacing-x-large);\n  }\n\n  .details--size-large .details__summary::slotted(syn-icon) {\n    /* Avoid shrinking of the icon, if the text content of the summary is very long and multi line */\n    flex-shrink: 0;\n    font-size: var(--syn-spacing-x-large);\n    margin-right: var(--syn-spacing-small);\n  }\n\n  /**\n   * Mark the details as open by adjusting its label\n   */\n  .details--open .details__summary {\n    font-weight: var(--syn-font-weight-bold);\n  }\n\n  /**\n   * Add a visually visible hover effect to the summary element\n   */\n  .details:not(.details--disabled) .details__header:hover .details__summary,\n  .details:not(.details--disabled) .details__header:hover .details__summary-icon {\n    color: var(--syn-color-primary-700);\n  }\n\n  /**\n   *  Contained style\n   */\n  .details--contained {\n    background-color: var(--syn-panel-background-color);\n    border-radius: var(--syn-border-radius-medium);\n    border-width: var(--syn-panel-border-width);\n  }\n\n  .details--contained .details__header:focus-visible {\n    border-radius: var(--syn-border-radius-medium);\n  }\n\n  .details--size-medium.details--contained .details__header {\n    padding: var(--syn-spacing-medium-large) var(--syn-spacing-large);\n  }\n\n  .details--size-medium.details--contained .details__content {\n    padding: var(--syn-spacing-medium) var(--syn-spacing-large) var(--syn-spacing-large);\n  }\n\n  .details--size-large.details--contained .details__header {\n    padding: var(--syn-spacing-large);\n  }\n\n  .details--size-large.details--contained .details__content {\n    padding: var(--syn-spacing-medium-large) var(--syn-spacing-large) var(--syn-spacing-large);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,gCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}