@synergy-design-system/components 2.2.0 → 2.3.0

package/dist/synergy.js

@@ -1,261 +1,273 @@
-import "./chunks/chunk.NKIYFJN2.js";
 import {
   tooltip_default
-} from "./chunks/chunk.B6ECQBB4.js";
+} from "./chunks/chunk.J4NGGBQ2.js";
 import {
   getFormControls,
   serialize
 } from "./chunks/chunk.MXCWG2OM.js";
+import "./chunks/chunk.NKIYFJN2.js";
 import {
   tag_default
-} from "./chunks/chunk.JBLLQP2I.js";
+} from "./chunks/chunk.JEKJLMVU.js";
 import {
   textarea_default
-} from "./chunks/chunk.6QVNCLZS.js";
-import "./chunks/chunk.DUVJPNMN.js";
+} from "./chunks/chunk.BII2H6QQ.js";
+import "./chunks/chunk.SAF4PRHP.js";
 import "./chunks/chunk.YBIBWRKC.js";
 import "./chunks/chunk.CRA5CBMD.js";
-import "./chunks/chunk.WMNGVSJM.js";
-import "./chunks/chunk.4X3HY2V5.js";
+import "./chunks/chunk.4BC6L66J.js";
 import "./chunks/chunk.3YMWLLPP.js";
+import "./chunks/chunk.4X3HY2V5.js";
 import {
   tab_group_default
-} from "./chunks/chunk.ZD4HN2PI.js";
+} from "./chunks/chunk.43EYA2HH.js";
 import {
   tab_panel_default
-} from "./chunks/chunk.GPOKWSJW.js";
-import "./chunks/chunk.MOOEQAES.js";
+} from "./chunks/chunk.6BCAOA7S.js";
+import "./chunks/chunk.E333D77M.js";
 import "./chunks/chunk.XHWYGYMQ.js";
 import "./chunks/chunk.HVXG4JG6.js";
 import {
   switch_default
-} from "./chunks/chunk.26ENGZ3W.js";
+} from "./chunks/chunk.RYF22CBO.js";
 import {
   tab_default
-} from "./chunks/chunk.RN7MN4MA.js";
-import "./chunks/chunk.53BSBOGI.js";
+} from "./chunks/chunk.7A4VBS4X.js";
+import "./chunks/chunk.D3CUJ7FL.js";
 import "./chunks/chunk.OE4RXQU2.js";
 import "./chunks/chunk.U7YAV7S3.js";
-import "./chunks/chunk.37QGQHZ6.js";
-import "./chunks/chunk.NGI67WXT.js";
+import "./chunks/chunk.YTVTTW3B.js";
 import "./chunks/chunk.JQ47GWDL.js";
+import "./chunks/chunk.NGI67WXT.js";
 import {
   side_nav_default
-} from "./chunks/chunk.PLXT7FHX.js";
-import "./chunks/chunk.BZNV5GLJ.js";
-import "./chunks/chunk.ONW45GQI.js";
+} from "./chunks/chunk.6N22J2UN.js";
 import {
   spinner_default
-} from "./chunks/chunk.3JEIYX3E.js";
-import "./chunks/chunk.4MRMTDXI.js";
-import "./chunks/chunk.W5JK7V7K.js";
+} from "./chunks/chunk.XQWP6SMH.js";
+import "./chunks/chunk.YQM3FZBP.js";
 import "./chunks/chunk.4TB35TYG.js";
+import "./chunks/chunk.W5JK7V7K.js";
 import {
   radio_group_default
-} from "./chunks/chunk.ZPQHGXON.js";
-import "./chunks/chunk.EQJ2E765.js";
-import "./chunks/chunk.F4MRQLNL.js";
-import "./chunks/chunk.K62NPKGN.js";
+} from "./chunks/chunk.XWLOIF46.js";
 import {
   select_default
-} from "./chunks/chunk.CQBMEYG3.js";
-import "./chunks/chunk.TJMFAPD5.js";
-import "./chunks/chunk.CXQZU3UM.js";
-import "./chunks/chunk.B6R3IVGO.js";
+} from "./chunks/chunk.4TGVXD35.js";
+import "./chunks/chunk.CA4QXWOI.js";
+import "./chunks/chunk.CJ64HMRK.js";
 import "./chunks/chunk.6EPU7YUS.js";
+import "./chunks/chunk.B6R3IVGO.js";
 import "./chunks/chunk.OWMT6OL2.js";
 import "./chunks/chunk.SNLPFVBC.js";
-import {
-  progress_ring_default
-} from "./chunks/chunk.HVCUYU55.js";
+import "./chunks/chunk.66BSJQ57.js";
+import "./chunks/chunk.ONW45GQI.js";
 import {
   radio_default
-} from "./chunks/chunk.B24ZDJ2S.js";
-import "./chunks/chunk.LJQL5FJU.js";
+} from "./chunks/chunk.Z3KXEXZK.js";
+import "./chunks/chunk.GNBYM75U.js";
 import "./chunks/chunk.V6VND4OF.js";
 import "./chunks/chunk.EHSNF4SS.js";
 import {
   radio_button_default
-} from "./chunks/chunk.PUYIYZM3.js";
-import "./chunks/chunk.JNQUUSNH.js";
+} from "./chunks/chunk.SFRDDSWI.js";
+import "./chunks/chunk.S44C5OQR.js";
 import "./chunks/chunk.4BRJ5OJE.js";
+import "./chunks/chunk.A5T5QIRR.js";
+import "./chunks/chunk.F4MRQLNL.js";
+import "./chunks/chunk.K62NPKGN.js";
 import {
   progress_bar_default
-} from "./chunks/chunk.H6R4ZGJD.js";
-import "./chunks/chunk.INRAXQM6.js";
+} from "./chunks/chunk.EOZEZ2XM.js";
+import "./chunks/chunk.WNRXN24D.js";
 import "./chunks/chunk.AMAK44YX.js";
 import "./chunks/chunk.QUM76UHV.js";
-import "./chunks/chunk.46LHQWYE.js";
+import {
+  progress_ring_default
+} from "./chunks/chunk.UEHYOYDV.js";
+import "./chunks/chunk.AQZKYDTS.js";
 import "./chunks/chunk.2V3HGTTL.js";
 import "./chunks/chunk.RMIDAEF5.js";
 import {
   option_default
-} from "./chunks/chunk.BNDEI6JL.js";
+} from "./chunks/chunk.NMSKNQ3B.js";
 import {
   popup_default
-} from "./chunks/chunk.KKHBCEZG.js";
+} from "./chunks/chunk.4LCZCUMF.js";
 import {
   prio_nav_default
-} from "./chunks/chunk.ZW7TXIG5.js";
-import "./chunks/chunk.VYOPQCOF.js";
-import "./chunks/chunk.XNP4OTUB.js";
+} from "./chunks/chunk.ZFJL5UPT.js";
+import "./chunks/chunk.ALF7C2K3.js";
 import "./chunks/chunk.74N5WLM5.js";
+import "./chunks/chunk.XNP4OTUB.js";
 import {
   nav_item_default
-} from "./chunks/chunk.DQ2VNYUV.js";
-import "./chunks/chunk.PJZAQ4CL.js";
-import "./chunks/chunk.FAAETEJ2.js";
+} from "./chunks/chunk.CRN2Q7MJ.js";
 import {
   optgroup_default
-} from "./chunks/chunk.UPF36IJ7.js";
-import "./chunks/chunk.SUWJSKJY.js";
+} from "./chunks/chunk.KZSS64BS.js";
+import "./chunks/chunk.7FYRHIYL.js";
 import "./chunks/chunk.KG52EHDB.js";
-import "./chunks/chunk.2F7VZ6GN.js";
-import "./chunks/chunk.IVM3BGRH.js";
+import "./chunks/chunk.GDUHGZNB.js";
 import "./chunks/chunk.3B24TYVN.js";
+import "./chunks/chunk.IVM3BGRH.js";
 import {
   menu_item_default
-} from "./chunks/chunk.6LN6ZNAK.js";
+} from "./chunks/chunk.5AFAYK7R.js";
 import {
   menu_label_default
-} from "./chunks/chunk.JODC5632.js";
-import "./chunks/chunk.V4LT6Y75.js";
+} from "./chunks/chunk.KEJRP2YF.js";
+import "./chunks/chunk.DYAEF25V.js";
 import "./chunks/chunk.X6GR6IA2.js";
 import "./chunks/chunk.RAOPZXJL.js";
+import "./chunks/chunk.B5SSBYGJ.js";
+import "./chunks/chunk.FAAETEJ2.js";
 import {
   input_default
-} from "./chunks/chunk.UYOVYRYZ.js";
+} from "./chunks/chunk.TPGRGJR3.js";
 import {
   menu_default
-} from "./chunks/chunk.6TF37IB7.js";
-import "./chunks/chunk.AROEEADW.js";
+} from "./chunks/chunk.X6QYMTT6.js";
+import "./chunks/chunk.QTL37DVE.js";
 import "./chunks/chunk.PILX7LVU.js";
 import "./chunks/chunk.C2CWYCOU.js";
-import "./chunks/chunk.7EVV2SSG.js";
-import "./chunks/chunk.OOABXWCW.js";
+import "./chunks/chunk.KJULR6ZF.js";
 import "./chunks/chunk.MLP2VIC7.js";
 import "./chunks/chunk.U2OMGNNZ.js";
+import "./chunks/chunk.OOABXWCW.js";
 import {
   icon_button_default
-} from "./chunks/chunk.3AEYISZ3.js";
-import "./chunks/chunk.PMBSNTUJ.js";
-import "./chunks/chunk.3A65FBTX.js";
+} from "./chunks/chunk.WODYLR4A.js";
+import "./chunks/chunk.7TRBFW6D.js";
 import "./chunks/chunk.3B22DBSJ.js";
-import {
-  dropdown_default
-} from "./chunks/chunk.MNX3NQBK.js";
+import "./chunks/chunk.3A65FBTX.js";
 import {
   header_default
-} from "./chunks/chunk.7DMCPIEI.js";
-import "./chunks/chunk.7BKUPXMT.js";
+} from "./chunks/chunk.QQUUXS2I.js";
+import "./chunks/chunk.RXHKSN5J.js";
 import "./chunks/chunk.GVNVZMMM.js";
 import {
   icon_default
-} from "./chunks/chunk.NXEA2GYY.js";
-import {
-  divider_default
-} from "./chunks/chunk.GLXSQA65.js";
+} from "./chunks/chunk.MYK2AWCR.js";
 import {
   drawer_default
-} from "./chunks/chunk.S5IAO6TE.js";
-import "./chunks/chunk.R5L4ATY2.js";
+} from "./chunks/chunk.6ULGNLBL.js";
+import "./chunks/chunk.W55D3EVE.js";
 import "./chunks/chunk.I4FIU7FA.js";
 import "./chunks/chunk.N7QJ54ZM.js";
-import "./chunks/chunk.CEAH6JB6.js";
-import "./chunks/chunk.YQNQTLWT.js";
+import {
+  dropdown_default
+} from "./chunks/chunk.JPW3OCEH.js";
+import "./chunks/chunk.MBCDRER6.js";
+import "./chunks/chunk.2ISDOIZK.js";
 import "./chunks/chunk.AZ3N5IOO.js";
 import "./chunks/chunk.2KYFCKCK.js";
 import "./chunks/chunk.D6IIQDWJ.js";
-import {
-  checkbox_default
-} from "./chunks/chunk.R7AEDRAB.js";
 import {
   dialog_default
-} from "./chunks/chunk.SHR2JFIQ.js";
-import "./chunks/chunk.4EMBYJB5.js";
+} from "./chunks/chunk.CL3UAP77.js";
+import "./chunks/chunk.Z46Q4HC4.js";
 import "./chunks/chunk.PMC3VAD6.js";
 import "./chunks/chunk.RX7A4EQ2.js";
 import "./chunks/chunk.POGMEL53.js";
 import "./chunks/chunk.IU3SSJZE.js";
 import "./chunks/chunk.MU43DZ7W.js";
-import "./chunks/chunk.54XMPU42.js";
+import {
+  divider_default
+} from "./chunks/chunk.RXPHW5QH.js";
+import "./chunks/chunk.HRWJZ263.js";
 import "./chunks/chunk.FA6V2WD6.js";
 import "./chunks/chunk.FSZIE7IO.js";
 import {
-  button_group_default
-} from "./chunks/chunk.SA76XN5E.js";
-import {
-  card_default
-} from "./chunks/chunk.Z32IB5ZX.js";
-import "./chunks/chunk.QL2X22YC.js";
-import "./chunks/chunk.36SZKAYW.js";
-import "./chunks/chunk.C4JTZKPZ.js";
-import "./chunks/chunk.TKKE7ZDF.js";
+  checkbox_default
+} from "./chunks/chunk.EZVTRKT7.js";
+import "./chunks/chunk.Y45V3AOE.js";
 import "./chunks/chunk.RBG37CD4.js";
 import "./chunks/chunk.CX4QZVGR.js";
 import "./chunks/chunk.IG3RCOB3.js";
 import "./chunks/chunk.6OX2AX3Z.js";
 import {
-  breadcrumb_item_default
-} from "./chunks/chunk.DOETSUT5.js";
+  details_default
+} from "./chunks/chunk.GR7AJIV7.js";
+import "./chunks/chunk.OE3Y3CA4.js";
+import "./chunks/chunk.PU2BDR2W.js";
+import "./chunks/chunk.VA26EAEP.js";
 import {
   button_default
-} from "./chunks/chunk.JBK3OEZS.js";
-import "./chunks/chunk.SK2J5OBU.js";
-import "./chunks/chunk.HUDCIINH.js";
+} from "./chunks/chunk.626F5A6G.js";
+import {
+  button_group_default
+} from "./chunks/chunk.EW7GTAPE.js";
+import "./chunks/chunk.FTAZTCF6.js";
+import "./chunks/chunk.GRVNUIP2.js";
+import {
+  card_default
+} from "./chunks/chunk.JWXV5LZJ.js";
+import "./chunks/chunk.RHSBVJQ2.js";
+import "./chunks/chunk.36SZKAYW.js";
+import "./chunks/chunk.C4JTZKPZ.js";
+import {
+  breadcrumb_default
+} from "./chunks/chunk.KX2JSJEA.js";
+import {
+  breadcrumb_item_default
+} from "./chunks/chunk.GYM6FCBH.js";
+import "./chunks/chunk.N3246A5F.js";
+import "./chunks/chunk.NGIGPLN2.js";
+import "./chunks/chunk.O6ZH6AOI.js";
+import "./chunks/chunk.MWX2VWP5.js";
+import "./chunks/chunk.TOHYRWJW.js";
 import "./chunks/chunk.AWJ376R6.js";
 import "./chunks/chunk.JLXCLATV.js";
 import "./chunks/chunk.6EXC65JJ.js";
 import "./chunks/chunk.I25TRQGB.js";
 import "./chunks/chunk.5SQ7NVBX.js";
-import "./chunks/chunk.AP44I2RF.js";
-import "./chunks/chunk.GRVNUIP2.js";
 import {
-  badge_default
-} from "./chunks/chunk.EM4U3JXI.js";
+  alert_default
+} from "./chunks/chunk.OPHNLOT2.js";
 import {
-  breadcrumb_default
-} from "./chunks/chunk.FH2IZXHR.js";
-import "./chunks/chunk.WFRQCVCI.js";
+  badge_default
+} from "./chunks/chunk.FLUU3VLX.js";
+import "./chunks/chunk.IGZRKQVY.js";
+import "./chunks/chunk.WQJRBFZA.js";
+import "./chunks/chunk.Y5TMYX2L.js";
+import "./chunks/chunk.KIJSLOT3.js";
 import "./chunks/chunk.32CYREEV.js";
 import "./chunks/chunk.S22BO5SF.js";
-import "./chunks/chunk.237KE22A.js";
-import "./chunks/chunk.O6ZH6AOI.js";
-import "./chunks/chunk.NGIGPLN2.js";
 import {
-  alert_default
-} from "./chunks/chunk.DDBKCYG2.js";
-import "./chunks/chunk.55V5DPSY.js";
-import "./chunks/chunk.WEJ5VWT4.js";
+  accordion_default
+} from "./chunks/chunk.6QD4QY4G.js";
+import "./chunks/chunk.RLIJRLLJ.js";
+import "./chunks/chunk.WNUZ6LH4.js";
+import "./chunks/chunk.VRAOUUOJ.js";
+import "./chunks/chunk.TYYZK3XM.js";
 import "./chunks/chunk.ZHH2AHOZ.js";
 import "./chunks/chunk.DZ7YIR5N.js";
-import "./chunks/chunk.4OLTKAXX.js";
+import "./chunks/chunk.PYLHI2JQ.js";
 import "./chunks/chunk.MSUX23ZJ.js";
-import "./chunks/chunk.UAFGFK3T.js";
+import "./chunks/chunk.WVVQK5TE.js";
+import "./chunks/chunk.NKFRPPTB.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
-} from "./chunks/chunk.AA54UMGR.js";
-import "./chunks/chunk.YTEJW7IF.js";
+} from "./chunks/chunk.AV56MW4Q.js";
 import "./chunks/chunk.SDQC32B3.js";
 import "./chunks/chunk.PJO6TM3T.js";
 import "./chunks/chunk.ZBW4ZSZ7.js";
-import "./chunks/chunk.WVVQK5TE.js";
-import "./chunks/chunk.QJMO7V5R.js";
+import "./chunks/chunk.YTEJW7IF.js";
+import "./chunks/chunk.E3KW3KQM.js";
+import "./chunks/chunk.QZNPL6WK.js";
 import {
   getBasePath,
   setBasePath
 } from "./chunks/chunk.234ERFCE.js";
+import "./chunks/chunk.QJMO7V5R.js";
+import "./chunks/chunk.E6UCXKSB.js";
 import "./chunks/chunk.JRYXECAY.js";
 import "./chunks/chunk.KG73YUXI.js";
-import "./chunks/chunk.UBL6PYIY.js";
-import "./chunks/chunk.Y5TMYX2L.js";
-import "./chunks/chunk.E3KW3KQM.js";
-import "./chunks/chunk.QZNPL6WK.js";
-import "./chunks/chunk.TR376A4H.js";
-import "./chunks/chunk.WQJRBFZA.js";
 import "./chunks/chunk.QNDC5KWA.js";
 export {
+  accordion_default as SynAccordion,
   alert_default as SynAlert,
   badge_default as SynBadge,
   breadcrumb_default as SynBreadcrumb,
@@ -264,6 +276,7 @@ export {
   button_group_default as SynButtonGroup,
   card_default as SynCard,
   checkbox_default as SynCheckbox,
+  details_default as SynDetails,
   dialog_default as SynDialog,
   divider_default as SynDivider,
   drawer_default as SynDrawer,

package/dist/utilities/icon-library.js

@@ -2,9 +2,9 @@ import "../chunks/chunk.NKIYFJN2.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
-} from "../chunks/chunk.AA54UMGR.js";
-import "../chunks/chunk.YTEJW7IF.js";
+} from "../chunks/chunk.AV56MW4Q.js";
 import "../chunks/chunk.SDQC32B3.js";
+import "../chunks/chunk.YTEJW7IF.js";
 import "../chunks/chunk.234ERFCE.js";
 import "../chunks/chunk.QNDC5KWA.js";
 export {

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

@@ -2,6 +2,33 @@
   "$schema": "https://raw.githubusercontent.com/microsoft/vscode-html-languageservice/main/docs/customData.schema.json",
   "version": 1.1,
   "tags": [
+    {
+      "name": "syn-accordion",
+      "description": "Accordions provide the ability to group a list of `<syn-details>`.\n---\n\n\n### **Slots:**\n - _default_ - The accordion's main content. Must be `<syn-details />` elements.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "close-others",
+          "description": "Indicates whether or not multiple `<syn-detail>` elements can be open at the same time.",
+          "values": []
+        },
+        {
+          "name": "contained",
+          "description": "Draws the accordion and the slotted `<syn-details>` as contained elements.",
+          "values": []
+        },
+        {
+          "name": "size",
+          "description": "The size that should be applied to all slotted `<syn-details>` elements",
+          "values": [{ "name": "medium" }, { "name": "large" }]
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://synergy.style/components/accordion"
+        }
+      ]
+    },
     {
       "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.",
@@ -40,23 +67,6 @@
         }
       ]
     },
-    {
-      "name": "syn-breadcrumb",
-      "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n---\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-      "attributes": [
-        {
-          "name": "label",
-          "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
-          "values": []
-        }
-      ],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://synergy.style/components/breadcrumb"
-        }
-      ]
-    },
     {
       "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.",
@@ -80,6 +90,23 @@
         }
       ]
     },
+    {
+      "name": "syn-breadcrumb",
+      "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n---\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://synergy.style/components/breadcrumb"
+        }
+      ]
+    },
     {
       "name": "syn-breadcrumb-item",
       "description": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.\n---\n\n\n### **Slots:**\n - _default_ - The breadcrumb item's label.\n- **prefix** - An optional prefix, usually an icon or icon button.\n- **suffix** - An optional suffix, usually an icon or icon button.\n- **separator** - The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<syn-breadcrumb>` instead.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The breadcrumb item's label.\n- **prefix** - The container that wraps the prefix.\n- **suffix** - The container that wraps the suffix.\n- **separator** - The container that wraps the separator.",
@@ -337,6 +364,43 @@
         }
       ]
     },
+    {
+      "name": "syn-details",
+      "description": "Details show a brief summary and expand to show additional content.\n---\n\n\n### **Events:**\n - **syn-show** - Emitted when the details opens.\n- **syn-after-show** - Emitted after the details opens and all animations are complete.\n- **syn-hide** - Emitted when the details closes.\n- **syn-after-hide** - Emitted after the details closes and all animations are complete.\n\n### **Methods:**\n - **show()** - Shows the details.\n- **hide()** - Hides the details\n\n### **Slots:**\n - _default_ - The details' main content.\n- **summary** - The details' summary. Alternatively, you can use the `summary` attribute.\n- **expand-icon** - Optional expand icon to use instead of the default. Works best with `<syn-icon>`.\n- **collapse-icon** - Optional collapse icon to use instead of the default. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header that wraps both the summary and the expand/collapse icon.\n- **summary** - The container that wraps the summary.\n- **summary-icon** - The container that wraps the expand/collapse icons.\n- **content** - The details content.",
+      "attributes": [
+        {
+          "name": "open",
+          "description": "Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the details' open state.",
+          "values": []
+        },
+        {
+          "name": "summary",
+          "description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Disables the details so it can't be toggled.",
+          "values": []
+        },
+        {
+          "name": "contained",
+          "description": "Draws the details as contained element.",
+          "values": []
+        },
+        {
+          "name": "size",
+          "description": "The details's size.",
+          "values": [{ "name": "medium" }, { "name": "large" }]
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://synergy.style/components/details"
+        }
+      ]
+    },
     {
       "name": "syn-dialog",
       "description": "Dialogs, sometimes called \"modals\", appear above the page and require the user's immediate attention.\n---\n\n\n### **Events:**\n - **syn-show** - Emitted when the dialog opens.\n- **syn-after-show** - Emitted after the dialog opens and all animations are complete.\n- **syn-hide** - Emitted when the dialog closes.\n- **syn-after-hide** - Emitted after the dialog closes and all animations are complete.\n- **syn-initial-focus** - Emitted when the dialog opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **syn-request-close** - Emitted when the user attempts to close the dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog\n\n### **Slots:**\n - _default_ - The dialog's main content.\n- **label** - The dialog's label. Alternatively, you can use the `label` attribute.\n- **header-actions** - Optional actions to add to the header. Works best with `<syn-icon-button>`.\n- **footer** - The dialog's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens. _(default: undefined)_\n- **--header-spacing** - The amount of padding to use for the header. _(default: undefined)_\n- **--body-spacing** - The amount of padding to use for the body. _(default: undefined)_\n- **--footer-spacing** - The amount of padding to use for the footer. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the dialog.\n- **panel** - The dialog's panel (where the dialog and its content are rendered).\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **header-actions** - Optional actions to add to the header. Works best with `<syn-icon-button>`.\n- **title** - The dialog's title.\n- **close-button** - The close button, an `<syn-icon-button>`.\n- **close-button__base** - The close button's exported `base` part.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",

package/package.json

@@ -4,7 +4,7 @@
     "url": "https://www.sick.com"
   },
   "name": "@synergy-design-system/components",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "description": "",
   "repository": {
     "type": "git",
@@ -96,7 +96,7 @@
     "vendorism": "^3.0.0",
     "vue-tsc": "^2.0.14",
     "@synergy-design-system/eslint-config-syn": "0.1.0",
-    "@synergy-design-system/tokens": "2.2.0",
+    "@synergy-design-system/tokens": "2.3.0",
     "@synergy-design-system/stylelint-config-syn": "0.1.0"
   },
   "release": {
@@ -165,7 +165,7 @@
     "lit": "^3.1.3"
   },
   "peerDependencies": {
-    "@synergy-design-system/tokens": "^2.2.0"
+    "@synergy-design-system/tokens": "^2.3.0"
   },
   "scripts": {
     "build": "node scripts/build.js",

package/dist/chunks/chunk.37QGQHZ6.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/tab-group/tab-group.component.ts"],
-  "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { scrollIntoView } from '../../internal/scroll.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIconButton from '../icon-button/icon-button.component.js';\nimport styles from './tab-group.styles.js';\nimport customStyles from './tab-group.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type SynTab from '../tab/tab.js';\nimport type SynTabPanel from '../tab-panel/tab-panel.js';\n\n/**\n * @summary Tab groups organize content into a container that shows one section at a time.\n * @documentation https://synergy.style/components/tab-group\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - Used for grouping tab panels in the tab group. Must be `<syn-tab-panel>` elements.\n * @slot nav - Used for grouping tabs in the tab group. Must be `<syn-tab>` elements.\n *\n * @event {{ name: String }} syn-tab-show - Emitted when a tab is shown. The payload of the event returns the \"panel\" attribute of the shown tab.\n * @event {{ name: String }} syn-tab-hide - Emitted when a tab is hidden. The payload of the event returns the \"panel\" attribute of the hidden tab.\n *\n * @csspart base - The component's base wrapper.\n * @csspart nav - The tab group's navigation container where tabs are slotted in.\n * @csspart tabs - The container that wraps the tabs.\n * @csspart active-tab-indicator - The line that highlights the currently selected tab.\n * @csspart body - The tab group's body where tab panels are slotted in.\n * @csspart scroll-button - The previous/next scroll buttons that show when tabs are scrollable, an `<syn-icon-button>`.\n * @csspart scroll-button--start - The starting scroll button.\n * @csspart scroll-button--end - The ending scroll button.\n * @csspart scroll-button__base - The scroll button's exported `base` part.\n *\n * @cssproperty --indicator-color - The color of the active tab indicator.\n * @cssproperty --indicator-width - The width of the active tab indicator.\n * @cssproperty --track-color - The color of the indicator's track (the line that separates tabs from panels).\n * @cssproperty --track-width - The width of the indicator's track (the line that separates tabs from panels).\n */\nexport default class SynTabGroup extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n  static dependencies = { 'syn-icon-button': SynIconButton };\n\n  private readonly localize = new LocalizeController(this);\n\n  private activeTab?: SynTab;\n  private mutationObserver: MutationObserver;\n  private resizeObserver: ResizeObserver;\n  private tabs: SynTab[] = [];\n  private panels: SynTabPanel[] = [];\n\n  @query('.tab-group') tabGroup: HTMLElement;\n  @query('.tab-group__body') body: HTMLSlotElement;\n  @query('.tab-group__nav') nav: HTMLElement;\n  @query('.tab-group__indicator') indicator: HTMLElement;\n\n  @state() private hasScrollControls = false;\n\n  /** The placement of the tabs. */\n  @property() placement: 'top' | 'start' | 'end' = 'top';\n\n  /**\n   * When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\n   * manual, the tab will receive focus but will not show until the user presses spacebar or enter.\n   */\n  @property() activation: 'auto' | 'manual' = 'auto';\n\n  /** Disables the scroll arrows that appear when tabs overflow. */\n  @property({ attribute: 'no-scroll-controls', type: Boolean }) noScrollControls = false;\n\n\t/** Draws the tab group as a contained element. */\n  @property({ type: Boolean }) contained = false;\n  \n  /** Draws the tab group with edges instead of roundings. Takes only effect if used with the 'contained' property */\n  @property({ type: Boolean }) sharp = false;\n\n  connectedCallback() {\n    const whenAllDefined = Promise.all([\n      customElements.whenDefined('syn-tab'),\n      customElements.whenDefined('syn-tab-panel')\n    ]);\n\n    super.connectedCallback();\n\n    this.resizeObserver = new ResizeObserver(() => {\n      this.repositionIndicator();\n      this.updateScrollControls();\n    });\n\n    this.mutationObserver = new MutationObserver(mutations => {\n      // Update aria labels when the DOM changes\n      if (mutations.some(m => !['aria-labelledby', 'aria-controls'].includes(m.attributeName!))) {\n        setTimeout(() => this.setAriaLabels());\n      }\n\n      // Sync tabs when disabled states change\n      if (mutations.some(m => m.attributeName === 'disabled')) {\n        this.syncTabsAndPanels();\n      }\n    });\n\n    // After the first update...\n    this.updateComplete.then(() => {\n      this.syncTabsAndPanels();\n      this.mutationObserver.observe(this, { attributes: true, childList: true, subtree: true });\n      this.resizeObserver.observe(this.nav);\n\n      // Wait for tabs and tab panels to be registered\n      whenAllDefined.then(() => {\n        // Set initial tab state when the tabs become visible\n        const intersectionObserver = new IntersectionObserver((entries, observer) => {\n          if (entries[0].intersectionRatio > 0) {\n            this.setAriaLabels();\n            this.setActiveTab(this.getActiveTab() ?? this.tabs[0], { emitEvents: false });\n            observer.unobserve(entries[0].target);\n          }\n        });\n        intersectionObserver.observe(this.tabGroup);\n      });\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.mutationObserver.disconnect();\n    this.resizeObserver.unobserve(this.nav);\n  }\n\n  private getAllTabs(options: { includeDisabled: boolean } = { includeDisabled: true }) {\n    const slot = this.shadowRoot!.querySelector<HTMLSlotElement>('slot[name=\"nav\"]')!;\n\n    return [...(slot.assignedElements() as SynTab[])].filter(el => {\n      return options.includeDisabled\n        ? el.tagName.toLowerCase() === 'syn-tab'\n        : el.tagName.toLowerCase() === 'syn-tab' && !el.disabled;\n    });\n  }\n\n  private getAllPanels() {\n    return [...this.body.assignedElements()].filter(el => el.tagName.toLowerCase() === 'syn-tab-panel') as [SynTabPanel];\n  }\n\n  private getActiveTab() {\n    return this.tabs.find(el => el.active);\n  }\n\n  private handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const tab = target.closest('syn-tab');\n    const tabGroup = tab?.closest('syn-tab-group');\n\n    // Ensure the target tab is in this tab group\n    if (tabGroup !== this) {\n      return;\n    }\n\n    if (tab !== null) {\n      this.setActiveTab(tab, { scrollBehavior: 'smooth' });\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    const target = event.target as HTMLElement;\n    const tab = target.closest('syn-tab');\n    const tabGroup = tab?.closest('syn-tab-group');\n\n    // Ensure the target tab is in this tab group\n    if (tabGroup !== this) {\n      return;\n    }\n\n    // Activate a tab\n    if (['Enter', ' '].includes(event.key)) {\n      if (tab !== null) {\n        this.setActiveTab(tab, { scrollBehavior: 'smooth' });\n        event.preventDefault();\n      }\n    }\n\n    // Move focus left or right\n    if (['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) {\n      const activeEl = this.tabs.find(t => t.matches(':focus'));\n      const isRtl = this.localize.dir() === 'rtl';\n\n      if (activeEl?.tagName.toLowerCase() === 'syn-tab') {\n        let index = this.tabs.indexOf(activeEl);\n\n        if (event.key === 'Home') {\n          index = 0;\n        } else if (event.key === 'End') {\n          index = this.tabs.length - 1;\n        } else if (\n          (['top'].includes(this.placement) && event.key === (isRtl ? 'ArrowRight' : 'ArrowLeft')) ||\n          (['start', 'end'].includes(this.placement) && event.key === 'ArrowUp')\n        ) {\n          index--;\n        } else if (\n          (['top'].includes(this.placement) && event.key === (isRtl ? 'ArrowLeft' : 'ArrowRight')) ||\n          (['start', 'end'].includes(this.placement) && event.key === 'ArrowDown')\n        ) {\n          index++;\n        }\n\n        if (index < 0) {\n          index = this.tabs.length - 1;\n        }\n\n        if (index > this.tabs.length - 1) {\n          index = 0;\n        }\n\n        this.tabs[index].focus({ preventScroll: true });\n\n        if (this.activation === 'auto') {\n          this.setActiveTab(this.tabs[index], { scrollBehavior: 'smooth' });\n        }\n\n        if (['top'].includes(this.placement)) {\n          scrollIntoView(this.tabs[index], this.nav, 'horizontal');\n        }\n\n        event.preventDefault();\n      }\n    }\n  }\n\n  private handleScrollToStart() {\n    this.nav.scroll({\n      left:\n        this.localize.dir() === 'rtl'\n          ? this.nav.scrollLeft + this.nav.clientWidth\n          : this.nav.scrollLeft - this.nav.clientWidth,\n      behavior: 'smooth'\n    });\n  }\n\n  private handleScrollToEnd() {\n    this.nav.scroll({\n      left:\n        this.localize.dir() === 'rtl'\n          ? this.nav.scrollLeft - this.nav.clientWidth\n          : this.nav.scrollLeft + this.nav.clientWidth,\n      behavior: 'smooth'\n    });\n  }\n\n  private setActiveTab(tab: SynTab, options?: { emitEvents?: boolean; scrollBehavior?: 'auto' | 'smooth' }) {\n    options = {\n      emitEvents: true,\n      scrollBehavior: 'auto',\n      ...options\n    };\n\n    if (tab !== this.activeTab && !tab.disabled) {\n      const previousTab = this.activeTab;\n      this.activeTab = tab;\n\n      // Sync active tab and panel\n      this.tabs.forEach(el => (el.active = el === this.activeTab));\n      this.panels.forEach(el => (el.active = el.name === this.activeTab?.panel));\n      this.syncIndicator();\n\n      if (['top'].includes(this.placement)) {\n        scrollIntoView(this.activeTab, this.nav, 'horizontal', options.scrollBehavior);\n      }\n\n      // Emit events\n      if (options.emitEvents) {\n        if (previousTab) {\n          this.emit('syn-tab-hide', { detail: { name: previousTab.panel } });\n        }\n\n        this.emit('syn-tab-show', { detail: { name: this.activeTab.panel } });\n      }\n    }\n  }\n\n  private setAriaLabels() {\n    // Link each tab with its corresponding panel\n    this.tabs.forEach(tab => {\n      const panel = this.panels.find(el => el.name === tab.panel);\n      if (panel) {\n        tab.setAttribute('aria-controls', panel.getAttribute('id')!);\n        panel.setAttribute('aria-labelledby', tab.getAttribute('id')!);\n      }\n    });\n  }\n\n  private repositionIndicator() {\n    const currentTab = this.getActiveTab();\n\n    if (!currentTab) {\n      return;\n    }\n\n    const width = currentTab.clientWidth;\n    const height = currentTab.clientHeight;\n    const isRtl = this.localize.dir() === 'rtl';\n\n    // We can't used offsetLeft/offsetTop here due to a shadow parent issue where neither can getBoundingClientRect\n    // because it provides invalid values for animating elements: https://bugs.chromium.org/p/chromium/issues/detail?id=920069\n    const allTabs = this.getAllTabs();\n    const precedingTabs = allTabs.slice(0, allTabs.indexOf(currentTab));\n    const offset = precedingTabs.reduce(\n      (previous, current) => ({\n        left: previous.left + current.clientWidth,\n        top: previous.top + current.clientHeight\n      }),\n      { left: 0, top: 0 }\n    );\n\n    switch (this.placement) {\n      case 'top':\n        this.indicator.style.width = `calc(${width}px - ${ (this.contained || this.sharp) ? '2 * var(--syn-spacing-large)' : '0px' })`;\n        this.indicator.style.height = 'auto';\n        this.indicator.style.translate = `calc(${isRtl ? '-' : ''}1 * (${offset.left}px + ${ (this.contained || this.sharp) ? 'var(--syn-spacing-large)' : '0px' }))`;\n        break;\n\n      case 'start':\n      case 'end':\n        this.indicator.style.width = 'auto';\n        this.indicator.style.height = `calc(${height}px - ${ (this.contained || this.sharp) ? '2 * var(--syn-spacing-small)' : '0px' })`;\n        this.indicator.style.translate = `0 calc(${offset.top}px + ${ (this.contained || this.sharp) ? 'var(--syn-spacing-small)' : '0px' })`;\n        break;\n    }\n  }\n\n  // This stores tabs and panels so we can refer to a cache instead of calling querySelectorAll() multiple times.\n  private syncTabsAndPanels() {\n    this.tabs = this.getAllTabs({ includeDisabled: false });\n    this.panels = this.getAllPanels();\n    this.syncIndicator();\n\n    // After updating, show or hide scroll controls as needed\n    this.updateComplete.then(() => this.updateScrollControls());\n  }\n\n  @watch('noScrollControls', { waitUntilFirstUpdate: true })\n  updateScrollControls() {\n    if (this.noScrollControls) {\n      this.hasScrollControls = false;\n    } else {\n      // In most cases, we can compare scrollWidth to clientWidth to determine if scroll controls should show. However,\n      // Safari appears to calculate this incorrectly when zoomed at 110%, causing the controls to toggle indefinitely.\n      // Adding a single pixel to the comparison seems to resolve it.\n      //\n      // See https://github.com/synergy-design-system/synergy/issues/1839\n      this.hasScrollControls =\n        ['top'].includes(this.placement) && this.nav.scrollWidth > this.nav.clientWidth + 1;\n    }\n  }\n\n  @watch('placement', { waitUntilFirstUpdate: true })\n  syncIndicator() {\n    const tab = this.getActiveTab();\n\n    if (tab) {\n      this.indicator.style.display = 'block';\n      this.repositionIndicator();\n    } else {\n      this.indicator.style.display = 'none';\n    }\n  }\n\n  /** Shows the specified tab panel. */\n  show(panel: string) {\n    const tab = this.tabs.find(el => el.panel === panel);\n\n    if (tab) {\n      this.setActiveTab(tab, { scrollBehavior: 'smooth' });\n    }\n  }\n\n  render() {\n\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          'tab-group': true,\n          'tab-group--top': this.placement === 'top',\n          'tab-group--start': this.placement === 'start',\n          'tab-group--end': this.placement === 'end',\n          'tab-group--rtl': this.localize.dir() === 'rtl',\n          'tab-group--has-scroll-controls': this.hasScrollControls,\n          'tab-group--contained': this.contained,\n          'tab-group--sharp': this.sharp,\n        })}\n        @click=${this.handleClick}\n        @keydown=${this.handleKeyDown}\n      >\n        <div class=\"tab-group__nav-container\" part=\"nav\">\n          ${this.hasScrollControls\n            ? html`\n                <syn-icon-button\n                  part=\"scroll-button scroll-button--start\"\n                  exportparts=\"base:scroll-button__base\"\n                  class=\"tab-group__scroll-button tab-group__scroll-button--start\"\n                  name=\"chevron-right\"\n                  library=\"system\"\n                  label=${this.localize.term('scrollToStart')}\n                  @click=${this.handleScrollToStart}\n                ></syn-icon-button>\n              `\n            : ''}\n\n          <div class=\"tab-group__nav\">\n            <div part=\"tabs\" class=\"tab-group__tabs\" role=\"tablist\">\n              <div part=\"active-tab-indicator\" class=\"tab-group__indicator\"></div>\n              <slot name=\"nav\" @slotchange=${this.syncTabsAndPanels}></slot>\n            </div>\n          </div>\n\n          ${this.hasScrollControls\n            ? html`\n                <syn-icon-button\n                  part=\"scroll-button scroll-button--end\"\n                  exportparts=\"base:scroll-button__base\"\n                  class=\"tab-group__scroll-button tab-group__scroll-button--end\"\n                  name=\"chevron-right\"\n                  library=\"system\"\n                  label=${this.localize.term('scrollToEnd')}\n                  @click=${this.handleScrollToEnd}\n                ></syn-icon-button>\n              `\n            : ''}\n        </div>\n\n        <slot part=\"body\" class=\"tab-group__body\" @slotchange=${this.syncTabsAndPanels}></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'syn-tab-group': SynTabGroup;\n  }\n}\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/chunks/chunk.7DMCPIEI.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/header/header.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport SynHeader from './header.component.js';\n\nexport * from './header.component.js';\nexport default SynHeader;\n\nSynHeader.define('syn-header');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'syn-header': SynHeader;\n  }\n}\n"],
-  "mappings": ";;;;;AAIA,IAAO,iBAAQ;AAEf,UAAU,OAAO,YAAY;",
-  "names": []
-}