@synergy-design-system/components 2.15.2 → 2.17.0

package/dist/synergy.js

@@ -1,221 +1,221 @@
+import {
+  validate_default
+} from "./chunks/chunk.POWZO4E7.js";
 import {
   getFormControls,
   serialize
 } from "./chunks/chunk.UTJJJQMA.js";
 import "./chunks/chunk.NKIYFJN2.js";
 import {
-  tooltip_default
-} from "./chunks/chunk.B7KAAOM4.js";
+  textarea_default
+} from "./chunks/chunk.TTDAKHPU.js";
 import {
-  validate_default
-} from "./chunks/chunk.CDP25RAN.js";
-import "./chunks/chunk.GPKLUHUN.js";
-import "./chunks/chunk.II46OKZT.js";
+  tooltip_default
+} from "./chunks/chunk.3DXJYVPI.js";
+import "./chunks/chunk.ZMTR7ZMP.js";
+import "./chunks/chunk.57H3XT6Q.js";
 import "./chunks/chunk.MVM3NN6Y.js";
 import {
-  tag_default
-} from "./chunks/chunk.7VJNCPYS.js";
+  tab_panel_default
+} from "./chunks/chunk.DDOSGMTC.js";
 import {
-  textarea_default
-} from "./chunks/chunk.ZFCXHJ3K.js";
-import "./chunks/chunk.KOSQ4UIO.js";
+  tag_default
+} from "./chunks/chunk.2G6V7DP2.js";
+import "./chunks/chunk.7TE6SX6I.js";
 import "./chunks/chunk.YBIBWRKC.js";
 import "./chunks/chunk.FQWBH6B3.js";
+import {
+  tab_default
+} from "./chunks/chunk.7IXHNRJT.js";
 import {
   tab_group_default
-} from "./chunks/chunk.WPE5ECZ4.js";
-import "./chunks/chunk.XKIKX7FH.js";
+} from "./chunks/chunk.PPCULXGZ.js";
+import "./chunks/chunk.FXC53VT5.js";
 import "./chunks/chunk.XOXVVU5C.js";
 import "./chunks/chunk.PKYC7QF3.js";
-import {
-  tab_panel_default
-} from "./chunks/chunk.ANU6ZUZH.js";
-import "./chunks/chunk.CJRPQHH7.js";
+import "./chunks/chunk.NMV6QEGX.js";
 import "./chunks/chunk.XHWYGYMQ.js";
 import "./chunks/chunk.HVXG4JG6.js";
+import {
+  spinner_default
+} from "./chunks/chunk.2K54W7I7.js";
 import {
   switch_default
-} from "./chunks/chunk.WIUTO3DE.js";
-import "./chunks/chunk.5KWBLXN4.js";
+} from "./chunks/chunk.E43ZNV5W.js";
+import "./chunks/chunk.EPOKGZ5G.js";
 import "./chunks/chunk.W5JK7V7K.js";
 import "./chunks/chunk.4TB35TYG.js";
-import {
-  tab_default
-} from "./chunks/chunk.OYGUXWRA.js";
-import "./chunks/chunk.AEXQJTZQ.js";
+import "./chunks/chunk.EAJBZDS3.js";
 import "./chunks/chunk.ZW75HBAK.js";
 import "./chunks/chunk.43YNZAWL.js";
 import {
   select_default
-} from "./chunks/chunk.S3F3Y4CJ.js";
+} from "./chunks/chunk.7YGGMSYD.js";
 import {
   side_nav_default
-} from "./chunks/chunk.HVGS5JIF.js";
-import "./chunks/chunk.P5JA46R6.js";
+} from "./chunks/chunk.ARGHCKN4.js";
+import "./chunks/chunk.UYWN2AGN.js";
 import "./chunks/chunk.ONW45GQI.js";
-import {
-  spinner_default
-} from "./chunks/chunk.SPQIF4KU.js";
 import {
   range_tick_default
-} from "./chunks/chunk.55BYZN5C.js";
-import "./chunks/chunk.GHYHFQ5E.js";
+} from "./chunks/chunk.2WODVLHQ.js";
+import "./chunks/chunk.USUMYRHO.js";
 import "./chunks/chunk.I6YARDHH.js";
-import "./chunks/chunk.VV745BQK.js";
+import "./chunks/chunk.6A7XYSK2.js";
 import "./chunks/chunk.OI3HOOCT.js";
-import "./chunks/chunk.XE6D7LNG.js";
-import "./chunks/chunk.KFTVF4BF.js";
+import "./chunks/chunk.XI4NDY2M.js";
+import "./chunks/chunk.LGXHBN6B.js";
 import "./chunks/chunk.B6R3IVGO.js";
 import "./chunks/chunk.6EPU7YUS.js";
-import "./chunks/chunk.KL5VXGK4.js";
 import "./chunks/chunk.XTWO6ZZW.js";
+import "./chunks/chunk.B6HFSIU2.js";
+import {
+  radio_button_default
+} from "./chunks/chunk.IY3XSVYK.js";
 import {
   radio_group_default
-} from "./chunks/chunk.UY6KFWUO.js";
-import "./chunks/chunk.OJDFWW3D.js";
+} from "./chunks/chunk.JXZO2OHF.js";
+import "./chunks/chunk.O4BSTAK6.js";
 import "./chunks/chunk.32LFHSM5.js";
 import "./chunks/chunk.K62NPKGN.js";
 import {
   range_default
-} from "./chunks/chunk.VDO36UFW.js";
-import "./chunks/chunk.YLRJOCQU.js";
-import "./chunks/chunk.A7XOI4NS.js";
+} from "./chunks/chunk.QY2V46SM.js";
+import "./chunks/chunk.A5AOOKJX.js";
+import "./chunks/chunk.VR2H45IE.js";
 import "./chunks/chunk.4X3HY2V5.js";
 import "./chunks/chunk.O644HRW3.js";
-import "./chunks/chunk.277APOW3.js";
 import "./chunks/chunk.236RSW67.js";
+import "./chunks/chunk.VFEILTOM.js";
 import {
   progress_ring_default
-} from "./chunks/chunk.LW6RIBF5.js";
+} from "./chunks/chunk.YWCX6M3R.js";
 import {
   radio_default
-} from "./chunks/chunk.ZBFU4BJH.js";
-import "./chunks/chunk.E5DX6QBS.js";
+} from "./chunks/chunk.QKAJJQOY.js";
+import "./chunks/chunk.FOPJZZUE.js";
 import "./chunks/chunk.UUB3PWNM.js";
 import "./chunks/chunk.EHSNF4SS.js";
-import {
-  radio_button_default
-} from "./chunks/chunk.Q42XIW7C.js";
-import "./chunks/chunk.WZCXH5QP.js";
+import "./chunks/chunk.VNQ4RFXH.js";
 import "./chunks/chunk.4BRJ5OJE.js";
+import {
+  prio_nav_default
+} from "./chunks/chunk.SW3UMTQY.js";
 import {
   progress_bar_default
-} from "./chunks/chunk.M4VDH4MW.js";
-import "./chunks/chunk.DKECT5ML.js";
+} from "./chunks/chunk.ORFFJG4N.js";
+import "./chunks/chunk.UDHQMRDY.js";
 import "./chunks/chunk.AMAK44YX.js";
 import "./chunks/chunk.QUM76UHV.js";
-import "./chunks/chunk.AFUY32DL.js";
-import "./chunks/chunk.2V3HGTTL.js";
+import "./chunks/chunk.5AT74B54.js";
 import "./chunks/chunk.RMIDAEF5.js";
+import "./chunks/chunk.2V3HGTTL.js";
 import {
   option_default
-} from "./chunks/chunk.5KSVVQUN.js";
+} from "./chunks/chunk.66KFZY6H.js";
 import {
   popup_default
-} from "./chunks/chunk.N6V422PD.js";
-import {
-  prio_nav_default
-} from "./chunks/chunk.ROEK5YOP.js";
-import "./chunks/chunk.2YQLQNSR.js";
+} from "./chunks/chunk.BOSMJJHP.js";
+import "./chunks/chunk.KJN4EA2Q.js";
 import "./chunks/chunk.OJ3N7TWP.js";
 import "./chunks/chunk.74N5WLM5.js";
 import {
   nav_item_default
-} from "./chunks/chunk.EUD37ISR.js";
-import "./chunks/chunk.YEHUJQWB.js";
+} from "./chunks/chunk.TIOGLFQZ.js";
+import "./chunks/chunk.TGXVNNHD.js";
 import "./chunks/chunk.SHCZO4KK.js";
 import {
   optgroup_default
-} from "./chunks/chunk.ULFFITOU.js";
-import "./chunks/chunk.NU2F6SN4.js";
-import "./chunks/chunk.FIDKOOLR.js";
+} from "./chunks/chunk.3EJRKPEB.js";
+import "./chunks/chunk.46AC476L.js";
+import "./chunks/chunk.MJ7R4QQT.js";
 import {
   menu_item_default
-} from "./chunks/chunk.ABIOJTND.js";
+} from "./chunks/chunk.QNEW6ZPM.js";
 import {
   menu_label_default
-} from "./chunks/chunk.HHTBO3UQ.js";
-import "./chunks/chunk.YZKAEPZW.js";
+} from "./chunks/chunk.XCKLUDW6.js";
+import "./chunks/chunk.RNG3EGLM.js";
 import "./chunks/chunk.X6GR6IA2.js";
 import "./chunks/chunk.RAOPZXJL.js";
 import {
   input_default
-} from "./chunks/chunk.3IRHTCZZ.js";
+} from "./chunks/chunk.6AVLY6GI.js";
 import {
   menu_default
-} from "./chunks/chunk.JPWOK7BA.js";
-import "./chunks/chunk.DDKKC3IX.js";
+} from "./chunks/chunk.DR275IL6.js";
+import "./chunks/chunk.E3GQ7OTE.js";
 import "./chunks/chunk.AVZITCPQ.js";
 import "./chunks/chunk.C2CWYCOU.js";
-import "./chunks/chunk.YXQ4SC4C.js";
+import "./chunks/chunk.CJVRRP6V.js";
 import "./chunks/chunk.R24T7WQN.js";
 import "./chunks/chunk.FSWTBNSI.js";
 import "./chunks/chunk.V4HPWQE7.js";
 import {
   icon_button_default
-} from "./chunks/chunk.6U6MN67C.js";
-import "./chunks/chunk.WE2H6T4Z.js";
+} from "./chunks/chunk.VTLM7DHU.js";
+import "./chunks/chunk.YHQHX5V3.js";
 import "./chunks/chunk.VKRMYKYH.js";
 import "./chunks/chunk.3B22DBSJ.js";
 import {
   file_default
-} from "./chunks/chunk.IBOO2CMV.js";
+} from "./chunks/chunk.PLXP5QKF.js";
 import {
   header_default
-} from "./chunks/chunk.2TPAX6AJ.js";
-import "./chunks/chunk.2MX6WQ3R.js";
+} from "./chunks/chunk.CZQ6H462.js";
+import "./chunks/chunk.BRZQZ24R.js";
 import "./chunks/chunk.66LQF6IO.js";
 import {
   icon_default
-} from "./chunks/chunk.V3J5GU5L.js";
+} from "./chunks/chunk.4PCMVDV7.js";
 import {
   drawer_default
-} from "./chunks/chunk.YYD3JDMX.js";
+} from "./chunks/chunk.QSW327OR.js";
 import {
   dropdown_default
-} from "./chunks/chunk.AYW655RJ.js";
-import "./chunks/chunk.XZTY2XZG.js";
+} from "./chunks/chunk.DVVXP6UF.js";
+import "./chunks/chunk.5G3JLEL5.js";
 import "./chunks/chunk.2KYFCKCK.js";
 import "./chunks/chunk.D6IIQDWJ.js";
-import "./chunks/chunk.MYEPEW55.js";
+import "./chunks/chunk.X3HVBM2M.js";
 import "./chunks/chunk.IKZOQ7AE.js";
 import {
   dialog_default
-} from "./chunks/chunk.SRF42UON.js";
+} from "./chunks/chunk.HI4EN6XA.js";
 import {
   divider_default
-} from "./chunks/chunk.O2AOZIC3.js";
-import "./chunks/chunk.Z56HB5T7.js";
+} from "./chunks/chunk.6ABYV4HR.js";
+import "./chunks/chunk.376IXRB4.js";
 import "./chunks/chunk.FA6V2WD6.js";
 import "./chunks/chunk.FSZIE7IO.js";
-import "./chunks/chunk.I3MEFWOZ.js";
+import "./chunks/chunk.LVGBQKZG.js";
 import "./chunks/chunk.N7QJ54ZM.js";
 import "./chunks/chunk.I4FIU7FA.js";
 import {
   details_default
-} from "./chunks/chunk.RCP7TWVL.js";
-import "./chunks/chunk.O356GTXZ.js";
+} from "./chunks/chunk.NNHIMG4B.js";
+import "./chunks/chunk.5F6EOD5D.js";
 import "./chunks/chunk.PU2BDR2W.js";
 import "./chunks/chunk.VA26EAEP.js";
-import "./chunks/chunk.FLQL4ECY.js";
+import "./chunks/chunk.J3RVA2P6.js";
 import "./chunks/chunk.MU43DZ7W.js";
 import "./chunks/chunk.XDM6VD32.js";
 import "./chunks/chunk.POGMEL53.js";
 import "./chunks/chunk.IU3SSJZE.js";
 import {
   checkbox_default
-} from "./chunks/chunk.LSV72WZ6.js";
-import "./chunks/chunk.ILUDSXVX.js";
+} from "./chunks/chunk.OIGK4P4F.js";
+import "./chunks/chunk.B2PE2TXL.js";
 import "./chunks/chunk.IG3RCOB3.js";
 import "./chunks/chunk.6OX2AX3Z.js";
 import {
   combobox_default
-} from "./chunks/chunk.Y53LPJWU.js";
-import "./chunks/chunk.RZLON23M.js";
-import "./chunks/chunk.KXLXPVGN.js";
+} from "./chunks/chunk.MOGLIA4W.js";
+import "./chunks/chunk.NY7IBX32.js";
+import "./chunks/chunk.LCJ226D4.js";
+import "./chunks/chunk.IJQ7XW3N.js";
 import "./chunks/chunk.IVM3BGRH.js";
-import "./chunks/chunk.RGIV7H3H.js";
-import "./chunks/chunk.67BGUF26.js";
+import "./chunks/chunk.PFLZ6U6X.js";
 import "./chunks/chunk.AZ3N5IOO.js";
 import {
   defaultOptionRenderer,
@@ -225,56 +225,65 @@ import "./chunks/chunk.S6AC4UW6.js";
 import "./chunks/chunk.5732DMBC.js";
 import "./chunks/chunk.3NXKLKWH.js";
 import "./chunks/chunk.FKKJBKYL.js";
-import "./chunks/chunk.AL24ODK6.js";
+import "./chunks/chunk.EWVMF6KH.js";
+import "./chunks/chunk.QC7X32ZP.js";
 import "./chunks/chunk.V4SIKF4X.js";
 import {
   button_default
-} from "./chunks/chunk.SHB7S77V.js";
+} from "./chunks/chunk.RBRMTUVA.js";
 import {
   button_group_default
-} from "./chunks/chunk.YPHJECHT.js";
-import "./chunks/chunk.B4BK2K4W.js";
+} from "./chunks/chunk.ALP4Z2OW.js";
+import "./chunks/chunk.V6PPOZZC.js";
 import "./chunks/chunk.GRVNUIP2.js";
 import {
   card_default
-} from "./chunks/chunk.XT6YWHED.js";
-import "./chunks/chunk.AYTD5K6S.js";
+} from "./chunks/chunk.WAWSY7D6.js";
+import "./chunks/chunk.XOZJT43Y.js";
 import "./chunks/chunk.36SZKAYW.js";
 import "./chunks/chunk.C4JTZKPZ.js";
 import {
   breadcrumb_default
-} from "./chunks/chunk.EVCVWRQH.js";
+} from "./chunks/chunk.PO5VGAIT.js";
 import {
   breadcrumb_item_default
-} from "./chunks/chunk.RHBNJ7VK.js";
-import "./chunks/chunk.B54BXEJN.js";
+} from "./chunks/chunk.OVGCVB7R.js";
+import "./chunks/chunk.2AH6ZXHP.js";
 import "./chunks/chunk.NGIGPLN2.js";
 import "./chunks/chunk.O6ZH6AOI.js";
-import "./chunks/chunk.AFX25KYN.js";
-import "./chunks/chunk.SOXK5TWS.js";
+import "./chunks/chunk.NIB7EMK2.js";
+import "./chunks/chunk.RMEGHAUX.js";
 import "./chunks/chunk.AWJ376R6.js";
 import "./chunks/chunk.JLXCLATV.js";
 import "./chunks/chunk.AMIQC3O7.js";
 import "./chunks/chunk.5EGFFSLN.js";
 import "./chunks/chunk.5SQ7NVBX.js";
+import {
+  alert_default
+} from "./chunks/chunk.74O6MY45.js";
 import {
   badge_default
-} from "./chunks/chunk.2JOGIMU5.js";
+} from "./chunks/chunk.JRXQYAF6.js";
+import "./chunks/chunk.3LE5R25I.js";
+import "./chunks/chunk.J6CGTLVH.js";
+import "./chunks/chunk.Y5TMYX2L.js";
+import "./chunks/chunk.D2BI6WDB.js";
+import "./chunks/chunk.32CYREEV.js";
+import "./chunks/chunk.S22BO5SF.js";
 import {
-  alert_default
-} from "./chunks/chunk.H5J2CXVU.js";
-import "./chunks/chunk.3FIGQFA4.js";
-import "./chunks/chunk.FTXJRZO7.js";
+  accordion_default
+} from "./chunks/chunk.6DIE4UQP.js";
+import "./chunks/chunk.FYHVWVR3.js";
+import "./chunks/chunk.WNUZ6LH4.js";
+import "./chunks/chunk.6Z4AYCNJ.js";
+import "./chunks/chunk.UQ3KSMJM.js";
 import "./chunks/chunk.6QYKWCSO.js";
 import "./chunks/chunk.DZ7YIR5N.js";
 import "./chunks/chunk.C2ENQBPM.js";
 import "./chunks/chunk.A3OYJILJ.js";
 import "./chunks/chunk.HQ6QUSK7.js";
 import "./chunks/chunk.WVVQK5TE.js";
-import "./chunks/chunk.JRYXECAY.js";
-import "./chunks/chunk.IFXKIEOU.js";
-import "./chunks/chunk.LZB3ODYS.js";
-import "./chunks/chunk.SXSOAZE2.js";
+import "./chunks/chunk.ETTFHZ32.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
@@ -283,25 +292,17 @@ import "./chunks/chunk.YTEJW7IF.js";
 import "./chunks/chunk.LUXDS4EY.js";
 import "./chunks/chunk.PJO6TM3T.js";
 import "./chunks/chunk.ZBW4ZSZ7.js";
-import "./chunks/chunk.32CYREEV.js";
-import "./chunks/chunk.S22BO5SF.js";
+import "./chunks/chunk.GIU3H3J3.js";
+import "./chunks/chunk.S5N2TE2L.js";
 import {
   getBasePath,
   setBasePath
 } from "./chunks/chunk.234ERFCE.js";
-import {
-  accordion_default
-} from "./chunks/chunk.VWUMFSTD.js";
-import "./chunks/chunk.R6EEYS6Z.js";
 import "./chunks/chunk.74IOULXM.js";
-import "./chunks/chunk.WNUZ6LH4.js";
-import "./chunks/chunk.NZNKGVQL.js";
-import "./chunks/chunk.GIU3H3J3.js";
-import "./chunks/chunk.S5N2TE2L.js";
 import "./chunks/chunk.NLYVOJGK.js";
-import "./chunks/chunk.BOFHYW24.js";
-import "./chunks/chunk.J6CGTLVH.js";
-import "./chunks/chunk.Y5TMYX2L.js";
+import "./chunks/chunk.4H7Y7UVK.js";
+import "./chunks/chunk.JRYXECAY.js";
+import "./chunks/chunk.IFXKIEOU.js";
 import "./chunks/chunk.2GFK6XTO.js";
 export {
   accordion_default as SynAccordion,

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

@@ -1544,7 +1544,7 @@
     },
     {
       "name": "syn-range",
-      "description": "Ranges allow the user to select values within a given range using one or two thumbs.\n---\n\n\n### **Events:**\n - **syn-blur** - Emitted when the control loses focus.\n- **syn-change** - Emitted when an alteration to the control's value is committed by the user.\n- **syn-focus** - Emitted when the control gains focus.\n- **syn-input** - Emitted when the control receives input.\n- **syn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **syn-move** - Emitted when the user moves a thumb, either via touch or keyboard. Use `Event.preventDefault()` to prevent movement.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message.\nReturns `true` when valid and `false` when invalid.\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. Pass an empty string to restore validity.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n\n### **Slots:**\n - **label** - The range's label. Alternatively, you can use the `label` attribute.\n- **prefix** - Used to prepend a presentational icon or similar element to the range.\n- **suffix** - Used to append a presentational icon or similar element to the range.\n- **help-text** - Text that describes how to use the range. Alternatively, you can use the `help-text` attribute.\n- **ticks** - Used to display tick marks at specific intervals along the range.\n\n### **CSS Properties:**\n - **--thumb-size** - The size of a thumb. _(default: undefined)_\n- **--thumb-hit-area-size** - The clickable area around the thumb. Per default this is set to 140% of the thumb size. Must be a scale css value (defaults to 1.4). _(default: undefined)_\n- **--track-hit-area-size** - The clickable area around the track (top and left). _(default: undefined)_\n- **--track-color-active** - Color of the track representing the current value. _(default: undefined)_\n- **--track-color-inactive** - Color of the track that represents the remaining value. _(default: undefined)_\n- **--track-height** - The height of the track. _(default: undefined)_\n- **--track-active-offset** - The point of origin of the active track, starting at the left side of the range. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **input-wrapper** - The container that wraps the input track and ticks.\n- **track-wrapper** - The wrapper for the track.\n- **track** - The inactive track.\n- **active-track** - The active track.\n- **prefix** - The container that wraps the prefix.\n- **suffix** - The container that wraps the suffix.\n- **ticks** - The container that wraps the tick marks.\n- **thumb** - The thumb(s) that the user can drag to change the range.",
+      "description": "Ranges allow the user to select values within a given range using one or two thumbs.\n---\n\n\n### **Events:**\n - **syn-blur** - Emitted when the control loses focus.\n- **syn-change** - Emitted when an alteration to the control's value is committed by the user.\n- **syn-focus** - Emitted when the control gains focus.\n- **syn-input** - Emitted when the control receives input.\n- **syn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **syn-move** - Emitted when the user moves a thumb, either via touch or keyboard. Use `Event.preventDefault()` to prevent movement.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message.\nReturns `true` when valid and `false` when invalid.\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. Pass an empty string to restore validity.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n\n### **Slots:**\n - **label** - The range's label. Alternatively, you can use the `label` attribute.\n- **prefix** - Used to prepend a presentational icon or similar element to the range.\n- **suffix** - Used to append a presentational icon or similar element to the range.\n- **help-text** - Text that describes how to use the range. Alternatively, you can use the `help-text` attribute.\n- **ticks** - Used to display tick marks at specific intervals along the range.\n\n### **CSS Properties:**\n - **--thumb-size** - The size of a thumb. _(default: undefined)_\n- **--thumb-hit-area-size** - The clickable area around the thumb. Per default this is set to 140% of the thumb size. Must be a scale css value (defaults to 1.4). _(default: undefined)_\n- **--track-hit-area-size** - The clickable area around the track (top and left). _(default: undefined)_\n- **--track-color-active** - Color of the track representing the current value. _(default: undefined)_\n- **--track-color-inactive** - Color of the track that represents the remaining value. _(default: undefined)_\n- **--track-height** - The height of the track. _(default: undefined)_\n- **--track-active-offset** - The point of origin of the active track, starting at the left side of the range. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **input-wrapper** - The container that wraps the input track and ticks.\n- **track-wrapper** - The wrapper for the track.\n- **track** - The inactive track.\n- **active-track** - The active track.\n- **prefix** - The container that wraps the prefix.\n- **suffix** - The container that wraps the suffix.\n- **ticks** - The container that wraps the tick marks.\n- **thumb** - The thumb(s) that the user can drag to change the range.\n- **tooltip__base** - The base of the tooltip\n- **tooltip__arrow** - The arrow of the tooltip\n- **tooltip__popup** - The popup of the tooltip\n- **tooltip__body** - The body of the tooltip",
       "attributes": [
         {
           "name": "name",
@@ -1604,6 +1604,11 @@
           "description": "The current values of the input (in ascending order) as a string of space separated values",
           "values": []
         },
+        {
+          "name": "restrict-movement",
+          "description": "Set to true to restrict the movement of a thumb to its next and previous thumb.\nThis only affects multi range components",
+          "values": []
+        },
         {
           "name": "form",
           "description": "By default, form controls are associated with the nearest containing `<form>` element.\nThis attribute allows you to place the form control outside of a form\nand associate it with the form that has this `id`.\nThe form must be in the same document or shadow root for this to work.",

package/package.json

@@ -4,7 +4,7 @@
     "url": "https://www.sick.com"
   },
   "name": "@synergy-design-system/components",
-  "version": "2.15.2",
+  "version": "2.17.0",
   "description": "",
   "repository": {
     "type": "git",
@@ -98,7 +98,7 @@
     "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.15.1",
+    "@synergy-design-system/tokens": "2.17.0",
     "@synergy-design-system/stylelint-config-syn": "0.1.0"
   },
   "release": {
@@ -167,7 +167,7 @@
     "lit": "^3.2.1"
   },
   "peerDependencies": {
-    "@synergy-design-system/tokens": "^2.15.1"
+    "@synergy-design-system/tokens": "^2.17.0"
   },
   "scripts": {
     "build": "node scripts/build.js",

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/combobox/combobox.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .combobox:not(.combobox--disabled) .combobox__display-input {\n    cursor: text;\n  }\n\n  .listbox__options ::slotted(syn-option[hidden]), \n  .listbox__options ::slotted(syn-optgroup[hidden]) {\n    display: none;\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,iCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/optgroup/optgroup.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    --display-divider: block;\n  }\n\n  .optgroup__divider {\n    --spacing: var(--syn-spacing-x-small);\n\n    display: var(--display-divider);\n  }\n\n  .optgroup__label-container {\n    align-items: center;\n    box-sizing: border-box;\n    color: var(--syn-color-neutral-950);\n    display: flex;\n    gap: var(--syn-spacing-small);\n  }\n\n  /**\n   * Only show the label container when there is a label at all\n   */\n  .optgroup--has-prefix .optgroup__label-container,\n  .optgroup--has-label .optgroup__label-container,\n  .optgroup--has-suffix .optgroup__label-container {\n    padding-block: var(--syn-spacing-small);\n    padding-inline: var(--syn-spacing-medium);\n  }\n\n  /**\n   * Format main label.\n   * Make sure this works for props and slotted content\n   */\n  .optgroup__label-content,\n  .optgroup__label::slotted(*) {\n    flex: 1;\n    font-family: var(--syn-font-sans);\n    font-size: var(--syn-font-size-medium);\n    font-weight: var(--syn-font-weight-semibold);\n    line-height: var(--syn-line-height-normal);\n  }\n\n  /* Disabled Label */\n  .optgroup--is-disabled .optgroup__label-container {\n    opacity: var(--syn-input-disabled-opacity);\n  }\n\n  .optgroup__prefix,\n  .optgroup__suffix {\n    color: var(--syn-color-neutral-800);\n    font-size: var(--syn-spacing-large);\n  }\n\n  .optgroup__options ::slotted(syn-option[hidden]) {\n    display: none;\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;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/select/select.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\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"],
-  "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;",
-  "names": []
-}

package/dist/chunks/chunk.RGIV7H3H.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  .option {\n    /* Height is dependent on line-height of .option__label, which does not fit completely to layout */\n    min-height: 48px;\n    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(--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(--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;",
-  "names": []
-}