@synergy-design-system/components 2.74.4 → 2.76.0

package/dist/synergy.js

@@ -1,7 +1,7 @@
 import "./chunks/chunk.RSCUHBW3.js";
 import {
   validate_default
-} from "./chunks/chunk.EKUOSUGG.js";
+} from "./chunks/chunk.IHC6CDTV.js";
 import {
   getFormControls,
   serialize
@@ -9,63 +9,63 @@ import {
 import "./chunks/chunk.NKIYFJN2.js";
 import {
   textarea_default
-} from "./chunks/chunk.6C2KOZCZ.js";
+} from "./chunks/chunk.LDIT5LZ2.js";
 import {
   tooltip_default
-} from "./chunks/chunk.J3ENNQPZ.js";
-import "./chunks/chunk.ASNF6T3D.js";
-import "./chunks/chunk.JCSOB5EK.js";
+} from "./chunks/chunk.4NZEP2X5.js";
+import "./chunks/chunk.5PRWFNPT.js";
+import "./chunks/chunk.CDCGWFUX.js";
 import "./chunks/chunk.MVM3NN6Y.js";
 import {
   tab_panel_default
-} from "./chunks/chunk.QQLKBD4F.js";
+} from "./chunks/chunk.6HVQTWAY.js";
 import {
   tag_default
-} from "./chunks/chunk.2BH4X6JT.js";
-import "./chunks/chunk.I3EUXN2H.js";
+} from "./chunks/chunk.YIA4D7D2.js";
+import "./chunks/chunk.3GRO7VTN.js";
 import "./chunks/chunk.SHIPVO7H.js";
 import "./chunks/chunk.FQWBH6B3.js";
 import {
   tab_default
-} from "./chunks/chunk.ARCJD37G.js";
+} from "./chunks/chunk.QJ2P52FY.js";
 import {
   tab_group_default
-} from "./chunks/chunk.KLR4ZUWI.js";
-import "./chunks/chunk.CHZ5UXWD.js";
+} from "./chunks/chunk.YQD2N3DB.js";
+import "./chunks/chunk.RMNM2M62.js";
 import "./chunks/chunk.LBUMVFCE.js";
 import "./chunks/chunk.PKYC7QF3.js";
-import "./chunks/chunk.XH5DFZZW.js";
+import "./chunks/chunk.MF5YI4PZ.js";
 import "./chunks/chunk.XHWYGYMQ.js";
 import "./chunks/chunk.HVXG4JG6.js";
 import {
   spinner_default
-} from "./chunks/chunk.NIGSCCQH.js";
+} from "./chunks/chunk.XSRMO4W7.js";
 import {
   switch_default
-} from "./chunks/chunk.MSL4SOOF.js";
-import "./chunks/chunk.D7CB4XWR.js";
-import "./chunks/chunk.22DCIF5D.js";
+} from "./chunks/chunk.6UDEB6BF.js";
+import "./chunks/chunk.OP3CPAKA.js";
+import "./chunks/chunk.T7PPSROA.js";
 import "./chunks/chunk.4TB35TYG.js";
-import "./chunks/chunk.OX2WQUTC.js";
+import "./chunks/chunk.BDIHSLAG.js";
 import "./chunks/chunk.NREI75V5.js";
 import "./chunks/chunk.43YNZAWL.js";
 import {
   select_default
-} from "./chunks/chunk.C2B3B6K4.js";
+} from "./chunks/chunk.QOC46A43.js";
 import {
   side_nav_default
-} from "./chunks/chunk.KA3C5R4Y.js";
-import "./chunks/chunk.BJFH6JN2.js";
+} from "./chunks/chunk.Q4ASRGF6.js";
+import "./chunks/chunk.ZCMJ45Q3.js";
 import "./chunks/chunk.EFSUQWJZ.js";
 import {
   range_tick_default
-} from "./chunks/chunk.Y6OREXLF.js";
-import "./chunks/chunk.WMX4RXGQ.js";
+} from "./chunks/chunk.VXZSTS7K.js";
+import "./chunks/chunk.AUK3PNSC.js";
 import "./chunks/chunk.DH3ESODU.js";
-import "./chunks/chunk.A2D2IAOW.js";
+import "./chunks/chunk.UUIJIHJR.js";
 import "./chunks/chunk.OI3HOOCT.js";
-import "./chunks/chunk.EKKTOERE.js";
-import "./chunks/chunk.37J7BOHN.js";
+import "./chunks/chunk.2H7XIK5G.js";
+import "./chunks/chunk.XT5SZ2B7.js";
 import "./chunks/chunk.2NIFD3YE.js";
 import "./chunks/chunk.6EPU7YUS.js";
 import "./chunks/chunk.VECCQZP5.js";
@@ -73,90 +73,90 @@ import "./chunks/chunk.F7LCJU4M.js";
 import "./chunks/chunk.XTWO6ZZW.js";
 import {
   radio_group_default
-} from "./chunks/chunk.S3C7RQT6.js";
-import "./chunks/chunk.JHS4VIRW.js";
+} from "./chunks/chunk.ZVXYEBXA.js";
+import "./chunks/chunk.LCSZJNPI.js";
 import "./chunks/chunk.6USNG4EL.js";
 import "./chunks/chunk.K62NPKGN.js";
 import {
   range_default
-} from "./chunks/chunk.42VG3TGN.js";
-import "./chunks/chunk.UULDNEW4.js";
-import "./chunks/chunk.PV7RLGD4.js";
+} from "./chunks/chunk.PLS7ZC5Q.js";
+import "./chunks/chunk.QVJPBB7S.js";
+import "./chunks/chunk.S4F5JP2C.js";
 import "./chunks/chunk.E7LBPRDC.js";
 import "./chunks/chunk.O644HRW3.js";
 import "./chunks/chunk.BXXVSZMC.js";
 import "./chunks/chunk.236RSW67.js";
 import {
   progress_ring_default
-} from "./chunks/chunk.C3K7MD4D.js";
+} from "./chunks/chunk.Q7H5QNL6.js";
 import {
   radio_default
-} from "./chunks/chunk.SJWHYHPM.js";
-import "./chunks/chunk.CNZPMYMY.js";
-import "./chunks/chunk.LDACFPRF.js";
+} from "./chunks/chunk.AKXXBO7C.js";
+import "./chunks/chunk.RBJ7JNVK.js";
+import "./chunks/chunk.SAV6MIQK.js";
 import "./chunks/chunk.EHSNF4SS.js";
 import {
   radio_button_default
-} from "./chunks/chunk.SN45QLA4.js";
-import "./chunks/chunk.3WMZRG2O.js";
+} from "./chunks/chunk.NQJWAH2D.js";
+import "./chunks/chunk.5VDNBART.js";
 import "./chunks/chunk.4BRJ5OJE.js";
 import {
   progress_bar_default
-} from "./chunks/chunk.64R7XRPQ.js";
-import "./chunks/chunk.XEA6W5UN.js";
+} from "./chunks/chunk.QUUT2DGU.js";
+import "./chunks/chunk.Q7AS23ZW.js";
 import "./chunks/chunk.A7LOAARY.js";
 import "./chunks/chunk.QUM76UHV.js";
-import "./chunks/chunk.ERUYV6G2.js";
+import "./chunks/chunk.GIPNL77K.js";
 import "./chunks/chunk.5EC6B57G.js";
 import "./chunks/chunk.RMIDAEF5.js";
 import {
   popup_default
-} from "./chunks/chunk.72XTCOPS.js";
+} from "./chunks/chunk.MZ3HWIHV.js";
 import {
   prio_nav_default
-} from "./chunks/chunk.WQAA4T7E.js";
-import "./chunks/chunk.WNT4V4ZX.js";
+} from "./chunks/chunk.YO4M6XI4.js";
+import "./chunks/chunk.XXHF5BBZ.js";
 import "./chunks/chunk.OJ3N7TWP.js";
 import "./chunks/chunk.74N5WLM5.js";
 import {
   optgroup_default
-} from "./chunks/chunk.IBWULRV3.js";
-import "./chunks/chunk.E7PFA5O7.js";
+} from "./chunks/chunk.T5MSNPJL.js";
+import "./chunks/chunk.QHNPZ4UE.js";
 import "./chunks/chunk.M7U5QI74.js";
 import {
   option_default
-} from "./chunks/chunk.Q6YG3BQL.js";
+} from "./chunks/chunk.JXYTG6CG.js";
 import {
   menu_label_default
-} from "./chunks/chunk.A5X5EHM7.js";
-import "./chunks/chunk.OET7LHA6.js";
+} from "./chunks/chunk.BZBBIIV6.js";
+import "./chunks/chunk.4ID7DORZ.js";
 import "./chunks/chunk.GZHQAHOL.js";
 import "./chunks/chunk.RAOPZXJL.js";
 import {
   nav_item_default
-} from "./chunks/chunk.Q4BF3BVQ.js";
-import "./chunks/chunk.I2GVGBNK.js";
-import "./chunks/chunk.M74YQZ5G.js";
+} from "./chunks/chunk.FBNGI7ES.js";
+import "./chunks/chunk.KQQ63GNA.js";
+import "./chunks/chunk.FCYQT7CQ.js";
 import {
   menu_default
-} from "./chunks/chunk.ZELCEN4L.js";
-import "./chunks/chunk.ZDP2SBPC.js";
+} from "./chunks/chunk.WQ5KMP3E.js";
+import "./chunks/chunk.CUMVK5RK.js";
 import "./chunks/chunk.3IQ2QEPZ.js";
 import "./chunks/chunk.C2CWYCOU.js";
 import {
   menu_item_default
-} from "./chunks/chunk.EY74MSLY.js";
-import "./chunks/chunk.XGBSRFQ2.js";
+} from "./chunks/chunk.TCWO2TAA.js";
+import "./chunks/chunk.IDD7M7LM.js";
 import "./chunks/chunk.V4HPWQE7.js";
 import "./chunks/chunk.OAAB4YO4.js";
 import "./chunks/chunk.FSWTBNSI.js";
 import {
   icon_button_default
-} from "./chunks/chunk.FXJRSPZL.js";
+} from "./chunks/chunk.AM5JLE7A.js";
 import {
   input_default
-} from "./chunks/chunk.45AE6D33.js";
-import "./chunks/chunk.D6PWJXIK.js";
+} from "./chunks/chunk.7EDW7D6F.js";
+import "./chunks/chunk.LEBSYYUH.js";
 import "./chunks/chunk.NFXT5LNY.js";
 import "./chunks/chunk.K2O55TNU.js";
 import "./chunks/chunk.XAQKFEHH.js";
@@ -169,64 +169,64 @@ import {
 } from "./chunks/chunk.LHFBIW7M.js";
 import {
   file_default
-} from "./chunks/chunk.W45HCBL4.js";
+} from "./chunks/chunk.H3TJDSSI.js";
 import {
   header_default
-} from "./chunks/chunk.6V2C7WZM.js";
-import "./chunks/chunk.4RLM52TX.js";
+} from "./chunks/chunk.YPHL3SRT.js";
+import "./chunks/chunk.2LVLFXHD.js";
 import "./chunks/chunk.EK4TK5MY.js";
 import {
   icon_default
-} from "./chunks/chunk.U5HM6HOK.js";
+} from "./chunks/chunk.7NOZ2GOB.js";
 import {
   drawer_default
-} from "./chunks/chunk.CDMURJPI.js";
+} from "./chunks/chunk.FT247QXJ.js";
 import {
   dropdown_default
-} from "./chunks/chunk.S5RYPLSE.js";
-import "./chunks/chunk.PFYF5DIA.js";
+} from "./chunks/chunk.I6STRHQ7.js";
+import "./chunks/chunk.F5AZ5JZC.js";
 import "./chunks/chunk.2KYFCKCK.js";
 import "./chunks/chunk.D6IIQDWJ.js";
-import "./chunks/chunk.L3MA7MD6.js";
+import "./chunks/chunk.MGCU74AY.js";
 import "./chunks/chunk.5C3IFF3A.js";
 import {
   dialog_default
-} from "./chunks/chunk.OMLDIQQJ.js";
+} from "./chunks/chunk.32HUOPP5.js";
 import {
   divider_default
-} from "./chunks/chunk.VFOSKTS3.js";
-import "./chunks/chunk.JXD6UCMG.js";
+} from "./chunks/chunk.DSLECTKQ.js";
+import "./chunks/chunk.GYIPN75I.js";
 import "./chunks/chunk.57RV2JXO.js";
 import "./chunks/chunk.FSZIE7IO.js";
-import "./chunks/chunk.J5SLBTPO.js";
+import "./chunks/chunk.HU234262.js";
 import "./chunks/chunk.N7QJ54ZM.js";
 import "./chunks/chunk.I4FIU7FA.js";
 import {
   details_default
-} from "./chunks/chunk.ZWEBVNWL.js";
-import "./chunks/chunk.42BGLTQ3.js";
+} from "./chunks/chunk.5HSJHAUU.js";
+import "./chunks/chunk.ITOEFOYR.js";
 import "./chunks/chunk.2DGMS4FV.js";
 import "./chunks/chunk.VA26EAEP.js";
-import "./chunks/chunk.KCC2VVVO.js";
+import "./chunks/chunk.I6QFHKXA.js";
 import "./chunks/chunk.MU43DZ7W.js";
 import "./chunks/chunk.AYAX7BG7.js";
 import "./chunks/chunk.G76BKD7B.js";
 import "./chunks/chunk.UCLYCASW.js";
 import {
   checkbox_default
-} from "./chunks/chunk.R7UXESM2.js";
-import "./chunks/chunk.Y42TVHH5.js";
-import "./chunks/chunk.VI3SIT3O.js";
+} from "./chunks/chunk.W76F5R3G.js";
+import "./chunks/chunk.SZZAFQAU.js";
+import "./chunks/chunk.XWNOP753.js";
 import "./chunks/chunk.6OX2AX3Z.js";
 import {
   combobox_default
-} from "./chunks/chunk.ZVIFW7LC.js";
-import "./chunks/chunk.CRV5UX7M.js";
-import "./chunks/chunk.MJZIGGWM.js";
+} from "./chunks/chunk.RDIU4F34.js";
+import "./chunks/chunk.RGKUURWD.js";
+import "./chunks/chunk.3D5ROFC3.js";
 import "./chunks/chunk.ARR23WUY.js";
 import "./chunks/chunk.S74CFZ4Z.js";
 import "./chunks/chunk.IVM3BGRH.js";
-import "./chunks/chunk.ETEGLGBQ.js";
+import "./chunks/chunk.UIP7LAXP.js";
 import "./chunks/chunk.36EHOOOO.js";
 import "./chunks/chunk.AZ3N5IOO.js";
 import {
@@ -242,61 +242,61 @@ import "./chunks/chunk.AMDQJFFP.js";
 import "./chunks/chunk.FD2CG2HT.js";
 import {
   button_default
-} from "./chunks/chunk.64TADLQM.js";
+} from "./chunks/chunk.AIJXSDAZ.js";
 import {
   button_group_default
-} from "./chunks/chunk.KGKWLJBO.js";
-import "./chunks/chunk.CZKMOCWP.js";
+} from "./chunks/chunk.SI5UXVGZ.js";
+import "./chunks/chunk.6HZIEKHJ.js";
 import "./chunks/chunk.GRVNUIP2.js";
 import {
   card_default
-} from "./chunks/chunk.TA57H5KF.js";
-import "./chunks/chunk.K2ZR7I7W.js";
+} from "./chunks/chunk.2GJHF6WE.js";
+import "./chunks/chunk.5QB6J3IC.js";
 import "./chunks/chunk.O655X4YP.js";
 import "./chunks/chunk.C4JTZKPZ.js";
 import {
   breadcrumb_default
-} from "./chunks/chunk.QHKKPNTL.js";
+} from "./chunks/chunk.SSXJJSJI.js";
 import {
   breadcrumb_item_default
-} from "./chunks/chunk.UOVZXEVU.js";
-import "./chunks/chunk.QA2YR4UP.js";
+} from "./chunks/chunk.BOLY5G6E.js";
+import "./chunks/chunk.XSM7HZJ7.js";
 import "./chunks/chunk.77CVXMWD.js";
 import "./chunks/chunk.O6ZH6AOI.js";
-import "./chunks/chunk.254OWAO7.js";
-import "./chunks/chunk.SBCPIDQP.js";
+import "./chunks/chunk.OPPSJYOF.js";
+import "./chunks/chunk.SQBUJVZE.js";
 import "./chunks/chunk.4WQZFNSE.js";
 import "./chunks/chunk.JLXCLATV.js";
 import "./chunks/chunk.HP2LEQRU.js";
-import "./chunks/chunk.VWY2RG4F.js";
+import "./chunks/chunk.EWKVHJPJ.js";
 import "./chunks/chunk.5SQ7NVBX.js";
 import {
   alert_default
-} from "./chunks/chunk.4OIAXFFB.js";
+} from "./chunks/chunk.THGD2AM2.js";
 import {
   badge_default
-} from "./chunks/chunk.4O4VBTMM.js";
-import "./chunks/chunk.Y33FBZC2.js";
+} from "./chunks/chunk.MXMAQLQT.js";
+import "./chunks/chunk.NARWRA7Y.js";
 import "./chunks/chunk.CCEFC33U.js";
 import "./chunks/chunk.Y5TMYX2L.js";
-import "./chunks/chunk.KAITRHY6.js";
+import "./chunks/chunk.CPOLBWLR.js";
 import "./chunks/chunk.32CYREEV.js";
 import "./chunks/chunk.S22BO5SF.js";
 import {
   accordion_default
-} from "./chunks/chunk.IKPI2VBY.js";
-import "./chunks/chunk.UW54JYTX.js";
+} from "./chunks/chunk.CBC33M7Y.js";
+import "./chunks/chunk.7UKZ2AJI.js";
 import "./chunks/chunk.WNUZ6LH4.js";
-import "./chunks/chunk.54RQXIA6.js";
+import "./chunks/chunk.V6NMAQQR.js";
 import "./chunks/chunk.WXVOTRW5.js";
-import "./chunks/chunk.RVCV6RUY.js";
+import "./chunks/chunk.375RGFZE.js";
 import "./chunks/chunk.DZ7YIR5N.js";
 import "./chunks/chunk.E3Z62YYT.js";
 import "./chunks/chunk.C2ENQBPM.js";
 import "./chunks/chunk.G6ITZTTW.js";
 import "./chunks/chunk.7JGKUB4A.js";
 import "./chunks/chunk.WVVQK5TE.js";
-import "./chunks/chunk.WVR5S62X.js";
+import "./chunks/chunk.URUHLG3B.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
@@ -328,7 +328,7 @@ import "./chunks/chunk.YBZFYBWC.js";
 import "./chunks/chunk.RB2JR2ND.js";
 import "./chunks/chunk.BVZQ6QSY.js";
 import "./chunks/chunk.NLYVOJGK.js";
-import "./chunks/chunk.FOSWTCLV.js";
+import "./chunks/chunk.NFRM6KUP.js";
 import "./chunks/chunk.ZCUURSJU.js";
 import "./chunks/chunk.BXY667C7.js";
 import "./chunks/chunk.Z4XV3SMG.js";

package/package.json

@@ -4,7 +4,7 @@
     "url": "https://www.sick.com"
   },
   "name": "@synergy-design-system/components",
-  "version": "2.74.4",
+  "version": "2.76.0",
   "description": "",
   "repository": {
     "type": "git",
@@ -99,9 +99,9 @@
     "unist-util-visit": "^5.0.0",
     "user-agent-data-types": "^0.4.2",
     "vendorism": "^5.0.0",
-    "@synergy-design-system/eslint-config-syn": "0.1.0",
-    "@synergy-design-system/tokens": "2.46.0",
-    "@synergy-design-system/stylelint-config-syn": "0.1.0"
+    "@synergy-design-system/stylelint-config-syn": "0.1.0",
+    "@synergy-design-system/tokens": "2.48.0",
+    "@synergy-design-system/eslint-config-syn": "0.1.0"
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.4",
@@ -111,7 +111,7 @@
     "lit": "^3.3.1"
   },
   "peerDependencies": {
-    "@synergy-design-system/tokens": "^2.46.0"
+    "@synergy-design-system/tokens": "^2.48.0"
   },
   "customElements": "dist/custom-elements.json",
   "scripts": {

package/dist/chunks/chunk.22DCIF5D.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/switch/switch.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host([size='small']) {\n   --height: var(--syn-switch-height-small, calc(var(--syn-toggle-size-medium) + 2px));\n   --thumb-size: var(--syn-toggle-size-small);\n   --width: var(--syn-switch-width-small, calc((var(--height) * 2) - 6px));\n\n    font-size: var(--syn-input-font-size-small);\n  }\n\n  :host([size='medium']) {\n    --height: var(--syn-switch-height-medium, calc(var(--syn-toggle-size-medium) + 4px));\n    --thumb-size: var(--syn-toggle-size-medium);\n    --width: var(--syn-switch-width-medium, calc((var(--height) * 2) - 6px));\n\n    font-size: var(--syn-input-font-size-medium);\n  }\n\n  :host([size='large']) {\n    --height: var(--syn-switch-height-large, calc(var(--syn-toggle-size-large) + 4px));\n    --thumb-size: var(--syn-toggle-size-large);\n    --width: var(--syn-switch-width-large, calc((var(--height) * 2) - 6px));\n\n    font-size: var(--syn-input-font-size-large);\n  }\n\n  /** #429: Use token for opacity */\n  .switch--disabled { \n    opacity: var(--syn-input-disabled-opacity);\n  }\n\n  .switch.switch--small {\n    padding: var(--syn-spacing-2x-small) 0;\n  }\n\n  .switch.switch--medium {\n    padding: var(--syn-spacing-2x-small) 0;\n  }\n\n  .switch.switch--large {\n    padding: var(--syn-spacing-3x-small) 0;\n  }\n\n  /* Hint: can be removed, if the padding stylings for sizes from above are removed */\n  .form-control--has-help-text .switch {\n    padding-bottom: 0;\n  }\n\n  .switch__control {\n    background-color: var(--syn-input-icon-icon-clearable-color);\n    border: solid var(--syn-border-width-medium) var(--syn-input-icon-icon-clearable-color);\n  }\n\n  .switch__control .switch__thumb {\n    border: none;\n  }\n\n  /* Checked */\n  .switch--checked .switch__control {\n    background-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n    border-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n  }\n\n  /* Hover */\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n    background-color: var(--syn-input-icon-icon-clearable-color-hover);\n    border-color: var(--syn-input-icon-icon-clearable-color-hover);\n  }\n\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n  }\n\n  /* Checked + hover */\n  .switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n    background-color: var(--syn-interactive-emphasis-color-hover, var(--syn-color-primary-900));\n    border-color: var(--syn-interactive-emphasis-color-hover, var(--syn-color-primary-900));\n  }\n\n  .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n  }\n\n  /* Focus */\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n    background-color: var(--syn-input-icon-icon-clearable-color);\n    border-color: var(--syn-input-icon-icon-clearable-color);\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    outline: none;\n  }\n\n  /* Checked + focus */\n  .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n    background-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n    border-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    outline: none;\n  }\n\n  .switch__label {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n  \n  :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control {\n    background-color: var(--syn-input-border-color-focus-error, var(--syn-color-error-700));\n    border-color: var(--syn-input-border-color-focus-error, var(--syn-color-error-700));\n  }\n\n  :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n    background-color: var(--syn-input-border-color-hover, var(--syn-color-error-900));\n    border-color: var(--syn-input-border-color-hover, var(--syn-color-error-900));\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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.LDACFPRF.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/radio/radio.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host(:focus-visible) .radio__control {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-width);\n  }\n\n  .radio {\n    align-items: flex-start;\n  }\n\n  /** #429: Use token for opacity */\n  .radio--disabled { \n    opacity: var(--syn-input-disabled-opacity);\n  }\n\n  /* Checked */\n  /* stylelint-disable-next-line no-descending-specificity */\n  .radio--checked .radio__control {\n    background-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n    border-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n  }\n\n  /* Checked + hover */\n  .radio.radio--checked:not(.radio--disabled) .radio__control:hover  {\n    background-color: var(--syn-interactive-emphasis-color-hover, var(--syn-color-primary-950));\n    border-color: var(--syn-interactive-emphasis-color-hover, var(--syn-color-primary-950));\n  }\n\n  /* Checked + active */\n  .radio.radio--checked:not(.radio--disabled) .radio__control:active  {\n    background-color: var(--syn-interactive-emphasis-color-active, var(--syn-color-primary-950));\n    border-color: var(--syn-interactive-emphasis-color-active, var(--syn-color-primary-950));\n  }\n\n  /* Not-Checked + Hover */\n  .radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover {\n    border-color: var(--syn-input-border-color-hover);\n  }\n\n  /* Not-Checked + active */\n  .radio:not(.radio--checked):not(.radio--disabled) .radio__control:active {\n    border-color: var(--syn-color-neutral-1000);\n  }\n\n  /* Fix#456: Multi line radio fixes */\n  .radio__label {\n    align-self: center;\n    margin-inline-start: var(--syn-spacing-x-small);\n    margin-top: -1px;\n  }\n\n  .radio--small .radio__label {\n    font: var(--syn-body-small-regular);\n  }\n\n  .radio--medium .radio__label {\n    font: var(--syn-body-medium-regular);\n  }\n\n  .radio--large .radio__label {\n    font: var(--syn-body-large-regular);\n  }\n\n  /* /Fix#456 */\n\n  /**\n   * #920: The new icons are instances in figma.\n   * The width of the system icon is 12px x 12px, so there is no inner padding.\n   * To accommodate for this, we need to set the width and height of the icon to 50% to get the same result as before.\n   */\n  .radio__checked-icon {\n    scale: 0.5;\n  }\n\n  .radio--small .radio__label, .radio--large .radio__label  {\n    margin-inline-start: 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;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/nav-item/nav-item.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  /**\n   * Default alignment is inline block when we are in horizontal mode\n   */\n  :host {\n    /**\n     * The indentation property defines the current \"level\" the component is on\n     * It may be set per hand, but is normally set during the render phase\n     * of a <syn-nav-item /> for slotted children\n     */\n    --indentation: 0;\n\n    /**\n     * Defines the amount of pixels each indentation level will shift the content to the left\n     */\n    --indentation-stepping: var(--syn-spacing-x-large);\n\n    /**\n     * Display property of the children. Defaults to \"contents\"\n     */\n    --display-children: contents;\n\n    display: block;\n  }\n\n  /**\n   * Switch alignment to inline-block when we are in horizontal mode\n   */\n  :host([horizontal]) {\n    display: inline-block;\n  }\n\n  /**\n   * Core nav item wrapper\n   */\n  .nav-item {\n    align-items: center;\n    background: transparent;\n    border: none;\n    box-shadow: inset 0 -1px 0 0 transparent;\n    box-sizing: border-box;\n    color: var(--syn-typography-color-text);\n    cursor: pointer;\n    display: inline-flex;\n    font: var(--syn-font-sans);\n    font-size: var(--syn-font-size-small);\n    min-height: var(--syn-spacing-2x-large);\n    padding: var(--syn-spacing-small) var(--syn-spacing-large);\n    position: relative;\n    text-align: left;\n    text-decoration: none;\n    transition: background-color var(--syn-transition-fast) ease-in-out, box-shadow var(--syn-transition-fast) ease-in-out;\n    width: 100%;\n    z-index: 0;\n  }\n\n  .nav-item:focus-visible {\n    outline: none;\n  }\n\n  .nav-item:focus-visible::after {\n    content: '';\n    display: block;\n    height: 100%;\n    left: calc(var(--syn-spacing-x-small) * -1);\n    outline: var(--syn-focus-ring);\n    outline-offset: -2px;\n    position: absolute;\n    top: 0;\n    width: calc(100% + 2 * var(--syn-spacing-x-small));\n  }\n\n  .nav-item--vertical:focus-visible::after {\n    left: 0;\n    width: 100%;\n  }\n\n  /**\n   * Horizontal nav items use narrower paddings\n   */\n  .nav-item--horizontal {\n    padding: var(--syn-spacing-small) 0;\n  }\n\n  /**\n   * Nav Items acting as accordion use a slightly narrower padding on the right side\n   */\n  .nav-item.nav-item-is-accordion {\n    padding-right: var(--syn-spacing-medium);\n  }\n\n  .nav-item--disabled {\n    cursor: not-allowed;\n  }\n\n  .nav-item--current {\n    font-weight: var(--syn-font-weight-bold);\n  }\n\n  /**\n   * Basic set up for the nav item prefix.\n   */\n  .nav-item:not(.nav-item--disabled)::before {\n    background: var(--syn-interactive-background-color-hover, var(--syn-color-neutral-50));\n    content: '';\n    display: block;\n    height: 100%;\n    left: 0;\n    opacity: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n    z-index: -1;\n  }\n\n  /**\n   * Hover effect for the nav item.\n   * We use opacity to make sure the border-bottom is visible if used in the prio-nav in header\n   */\n  .nav-item:not(.nav-item--disabled):hover::before {\n    opacity: 1;\n  }\n\n  /**\n   * When using horizontal, the background should extend the element\n   * on the left and right so the animation for the indicator can be seen\n   */\n  .nav-item--horizontal:not(.nav-item--disabled)::before {\n    left: calc(var(--syn-spacing-x-small) * -1);\n    width: calc(100% + 2 * var(--syn-spacing-x-small));\n  }\n\n  /**\n   * The content wrapper is needed to get the disabled state right\n   * and also sets the left padding, according to the given indentation level.\n   *\n   * Normally, we would just use opacity directly on the button.\n   * However, when using the divider prop, this leads to problems\n   * as the divider itself will also get opaque.\n   */\n  .nav-item__content {\n    align-items: center;\n    display: flex;\n    padding-inline-start: calc(var(--indentation) * var(--indentation-stepping));\n    width: 100%;\n  }\n\n  .nav-item--disabled .nav-item__content {\n    opacity: var(--syn-opacity-50);\n  }\n\n  /**\n   * Slotted icons should use a default font size of large\n   */\n  .nav-item--has-prefix ::slotted(syn-icon),\n  .nav-item--has-suffix ::slotted(syn-icon) {\n    font-size: var(--syn-font-size-x-large);\n    min-width: var(--syn-font-size-x-large);\n  }\n\n  /**\n   * The chevron indicates the use as a <details /> element OR a link\n   */\n  .nav-item__chevron {\n    color: var(--syn-interactive-quiet-color);\n    font-size: var(--syn-font-size-x-large);\n    margin-inline-start: var(--syn-spacing-x-small);\n    rotate: 0deg;\n    transition: var(--syn-transition-medium) rotate ease;\n  }\n\n  .nav-item__chevron-open {\n    rotate: -180deg;\n  }\n\n  /**\n   * Items that have the chevron attribute set and are NOT accordions should always show a chevron pointing to the right\n   */\n  .nav-item:not(.nav-item-is-accordion) .nav-item__chevron {\n    rotate: -90deg;\n  }\n\n  /**\n   * Make the primary content container fill all available space\n   */\n  .nav-item__content-container {\n    flex: 1;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  /**\n   * Horizontal navigation items should not break words\n   */\n  .nav-item--horizontal .nav-item__content-container {\n    font-weight: var(--syn-font-weight-bold);\n    white-space: nowrap;\n  }\n\n  /**\n   * Show prefix only\n   */\n  /* stylelint-disable no-descending-specificity */\n  .nav-item--show-prefix-only .nav-item__content-container,\n  .nav-item--show-prefix-only .nav-item__suffix,\n  .nav-item--show-prefix-only .nav-item__chevron {\n    height: var(--syn-spacing-large);\n  }\n  /* stylelint-enable no-descending-specificity */\n\n  /**\n   * Adjust the paddings for the label, depending if there is a pre- and/or suffix available.\n   * But only if the there is a main content or additionally a prefix / suffix\n   */\n  .nav-item--has-prefix.nav-item--has-content .nav-item__content-container,\n  .nav-item--has-prefix.nav-item--has-suffix .nav-item__content-container {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n\n  .nav-item--has-suffix.nav-item--has-content .nav-item__content-container,\n  .nav-item--has-suffix.nav-item--has-prefix .nav-item__content-container {\n    margin-inline-end: var(--syn-spacing-x-small);\n  }\n\n  /**\n   * Multi line content\n   */\n  /* stylelint-disable no-descending-specificity */\n  .nav-item--multi-line .nav-item__suffix,\n  .nav-item--multi-line .nav-item__prefix,\n  .nav-item--multi-line .nav-item__chevron {\n    align-self: flex-start;\n  }\n  /* stylelint-enable no-descending-specificity */\n\n  /* stylelint-disable no-descending-specificity */\n  .nav-item--multi-line .nav-item__suffix::slotted(syn-icon),\n  :not(.nav-item--show-prefix-only).nav-item--multi-line .nav-item__prefix::slotted(syn-icon),\n  .nav-item--multi-line .nav-item__chevron {\n    align-self: flex-start;\n  }\n  /* stylelint-enable no-descending-specificity */\n\n  /**\n   * The current indicator tells the user that the nav-item is the active one\n   */\n  .current-indicator {\n    background: transparent;\n    border: none;\n    margin: 0;\n    position: absolute;\n    transition: var(--syn-transition-medium) top ease,\n      var(--syn-transition-medium) right ease,\n      var(--syn-transition-medium) bottom ease,\n      var(--syn-transition-medium) left ease;\n    z-index: 1;\n  }\n\n  .current-indicator--visible {\n    background: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));\n  }\n\n  .nav-item--horizontal .current-indicator {\n    bottom: 0;\n    height: var(--syn-spacing-2x-small);\n    left: 0;\n    right: 0;\n  }\n\n  .nav-item--horizontal:hover .current-indicator--visible,\n  .nav-item--horizontal:focus-visible .current-indicator--visible {\n    left: calc(var(--syn-spacing-x-small) * -1);\n    right: calc(var(--syn-spacing-x-small) * -1);\n  }\n\n  .nav-item--vertical .current-indicator {\n    bottom: var(--syn-spacing-x-small);\n    left: 0;\n    top: var(--syn-spacing-x-small);\n    width: var(--syn-spacing-2x-small);\n  }\n\n  .nav-item--vertical:hover .current-indicator--visible,\n  .nav-item--vertical:focus-visible .current-indicator--visible {\n    bottom: 0;\n    top: 0;\n  }\n\n  /**\n   * Dividers are optionally displayed in horizontal nav items\n   */\n  .divider {\n    left: var(--syn-spacing-medium);\n    margin: 0;\n    position: absolute;\n    right: var(--syn-spacing-medium);\n    top: 0;\n  }\n\n  /**\n   * Make sure the divider blends into the background on hover\n   * for items that are NOT disabled.\n   */\n  .nav-item--vertical:not(.nav-item--disabled):hover .divider {\n    --color: var(--syn-interactive-background-color-hover);\n  }\n\n  /**\n   * Sub menu styling\n   */\n  summary.nav-item {\n    box-sizing: border-box;\n    display: flex;\n  }\n\n  details summary::-webkit-details-marker {\n    visibility: hidden;\n  }\n\n  .children {\n    display: var(--display-children)\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,0BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.VI3SIT3O.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 {\n    /* #1083: This adds spacing around multi-line labels */\n    padding: var(--syn-spacing-2x-small) 0;\n  }\n\n  .checkbox--small {\n    padding: var(--syn-spacing-3x-small) 0;\n  }\n\n  .checkbox__control {\n    border-radius: var(--syn-checkbox-border-radius, var(--syn-input-border-radius-small));\n\n    /* #1083: This adds spacing around multi-line labels */\n    margin: 0.1em 0;\n  }\n\n  :host([data-user-invalid]) .checkbox__control {\n    background: var(--syn-input-border-color-focus-error);\n    border-color: var(--syn-input-border-color-focus-error);\n  }\n\n  /**\n   * #943: When invalid, use a transparent background if not checked or indeterminate\n   */\n  :host([data-user-invalid]:not([checked]):not([indeterminate])) .checkbox__control {\n    background: transparent;\n  }\n\n  /** #429: Use token for opacity */\n  .checkbox--disabled {\n    opacity: var(--syn-input-disabled-opacity);\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    align-self: center;\n    line-height: var(--syn-line-height-normal);\n    margin-inline-start: var(--syn-spacing-x-small);\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/button/button.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .button {\n    font-weight: var(--syn-font-weight-bold);\n  }\n\n  .button:focus-visible {\n    outline: var(--syn-focus-ring-color) solid var(--syn-focus-ring-width);\n    outline-offset: var(--syn-focus-ring-width);\n  }\n\n  /*\n   * Adjustments for button label paddings\n   * @see https://github.com/synergy-design-system/synergy-design-system/issues/243\n   */\n  .button--has-prefix.button--small .button__label {\n    padding-inline-start: var(--syn-spacing-2x-small);\n  }\n\n  .button--has-suffix.button--small .button__label,\n  .button--caret.button--small .button__label {\n    padding-inline-end: var(--syn-spacing-2x-small);\n  }\n\n  .button--has-prefix.button--medium .button__label {\n    padding-inline-start: var(--syn-spacing-x-small);\n  }\n\n  .button--has-suffix.button--medium .button__label,\n  .button--caret.button--medium .button__label {\n    padding-inline-end: var(--syn-spacing-x-small);\n  }\n\n  /**\n   * Icon-only buttons\n   */\n  .button--small .button__label.button__icon-only {\n    padding: 0 calc(var(--syn-spacing-x-small) + var(--syn-spacing-4x-small));\n  }\n\n  .button--small .button__label::slotted(syn-icon) {\n    font-size: var(--syn-font-size-medium);\n    vertical-align: -3px;\n  }\n\n  .button--medium .button__label.button__icon-only {\n    padding: 0 calc(var(--syn-spacing-small) - var(--syn-spacing-4x-small));\n  }\n\n  .button--medium .button__label::slotted(syn-icon) {\n    font-size: var(--syn-font-size-x-large);\n    vertical-align: -6px;\n  }\n\n  .button--large .button__label.button__icon-only {\n    padding: 0 calc(var(--syn-spacing-medium) - var(--syn-spacing-4x-small));\n  }\n\n  .button--large .button__label::slotted(syn-icon) {\n    font-size: var(--syn-font-size-2x-large);\n    vertical-align: -8px;\n  }\n\n\n  /**\n   * Size modifiers\n   */\n  .button.button--medium.button--has-label .button__label {\n    font-size: var(--syn-font-size-medium);\n  } \n\n  .button.button--large.button--has-label .button__label {\n    font-size: var(--syn-font-size-large);\n  }\n\n  /*\n   * Standard buttons\n   */\n  .button--filled.button--primary.button--disabled {\n    background-color: var(--syn-color-neutral-600);\n    border-color: var(--syn-color-neutral-600);\n    color: var(--syn-color-neutral-0);\n  }\n\n  .button--filled.button--primary:hover:not(.button--disabled) {\n    background-color: var(--syn-color-primary-900);\n    border-color: var(--syn-color-primary-900);\n    color: var(--syn-color-neutral-0);\n  }\n\n  .button--filled.button--primary:active:not(.button--disabled) {\n    background-color: var(--syn-color-primary-950);\n    border-color: var(--syn-color-primary-950);\n    color: var(--syn-color-neutral-0);\n  }\n\n  /*\n   * Outline buttons\n   */\n  .button--outline.button--primary.button--disabled {\n    background: none;\n    border-color: var(--syn-color-neutral-600);\n    color: var(--syn-color-neutral-600);\n  }\n\n  .button--outline.button--primary:hover:not(.button--disabled),\n  .button--outline.button--primary.button--checked:not(.button--disabled) {\n    background: none;\n    border-color: var(--syn-color-primary-900);\n    color: var(--syn-color-primary-900);\n  }\n\n  .button--outline.button--primary:active:not(.button--disabled) {\n    background: inherit;\n    border-color:  var(--syn-color-primary-950);\n    color:  var(--syn-color-primary-950);\n  }\n\n  /*\n   * Text buttons\n   */\n  .button--text:hover:not(.button--disabled) {\n    color: var(--syn-color-primary-900);\n  }\n\n  .button--text.button--primary:active:not(.button--disabled) {\n    background: inherit;\n    border-color: transparent;\n    color:  var(--syn-color-primary-950);\n  }\n\n  .button--text.button--primary.button--disabled {\n    color: var(--syn-color-neutral-600);\n  }\n\n  /**\n   * Button spacing\n   */\n  .button.button--small.button--has-label.button--has-prefix {\n    padding-inline-start: var(--syn-spacing-small);\n  }\n\n  .button.button--small.button--has-label.button--has-suffix {\n    padding-inline-end: var(--syn-spacing-small);\n  }\n\n  .button.button--small.button--has-prefix .button__prefix, \n  .button.button--small.button--has-suffix .button__suffix {\n    font-size: var(--syn-spacing-medium);\n  }\n\n  .button.button--medium.button--has-label.button--has-prefix {\n    padding-inline-start: var(--syn-spacing-medium);\n  } \n\n  .button.button--medium.button--has-label.button--has-suffix {\n    padding-inline-end: var(--syn-spacing-medium);\n  }\n\n  .button.button--medium.button--has-prefix .button__prefix, \n  .button.button--medium.button--has-suffix .button__suffix {\n    font-size: var(--syn-spacing-large);\n  }\n\n  .button.button--large.button--has-label.button--has-prefix {\n    padding-inline-start: var(--syn-spacing-large);\n  }\n\n  .button.button--large.button--has-label.button--has-prefix .button__label {\n    padding-inline-start: var(--syn-spacing-small);\n  }\n\n  .button.button--large.button--has-label.button--has-suffix {\n    padding-inline-end: var(--syn-spacing-large);\n  }\n\n  .button.button--large.button--has-label.button--has-suffix .button__label {\n    padding-inline-end: var(--syn-spacing-small);\n  }\n\n  .button.button--large.button--has-prefix .button__prefix, \n  .button.button--large.button--has-suffix .button__suffix {\n    font-size: var(--syn-font-size-2x-large);\n  }\n\n  /** #429: Use token for opacity */\n  .button--disabled { \n    opacity: var(--syn-input-disabled-opacity);\n  }\n\n  /*\n   * Caret modifier\n   */\n  .button--caret.button--small .button__caret{\n    font-size: var(--syn-font-size-medium);\n  }\n\n  .button--caret.button--medium .button__caret{\n    font-size: var(--syn-font-size-x-large);\n  }\n\n  .button--caret.button--large .button__caret{\n    font-size: var(--syn-font-size-2x-large);\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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": []
-}