@synergy-design-system/components 2.10.1 → 2.11.0

package/dist/chunks/{chunk.IGUCF6GW.js → chunk.FMFVK662.js}

@@ -6,14 +6,14 @@ import {
 } from "./chunk.EHSNF4SS.js";
 import {
   SynIcon
-} from "./chunk.OLHSSK2R.js";
+} from "./chunk.YBCKQJK4.js";
 import {
   watch
 } from "./chunk.74IOULXM.js";
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -112,4 +112,4 @@ __decorateClass([
 export {
   SynRadio
 };
-//# sourceMappingURL=chunk.IGUCF6GW.js.map
+//# sourceMappingURL=chunk.FMFVK662.js.map

package/dist/chunks/{chunk.2TUCVNJC.js → chunk.FQSDLEDV.js}

@@ -10,7 +10,7 @@ import {
 } from "./chunk.FKKJBKYL.js";
 import {
   SynButton
-} from "./chunk.MFRK7XY4.js";
+} from "./chunk.PUXBRQLH.js";
 import {
   FormControlController
 } from "./chunk.BBNQVEPD.js";
@@ -26,7 +26,7 @@ import {
 } from "./chunk.WVVQK5TE.js";
 import {
   SynIcon
-} from "./chunk.OLHSSK2R.js";
+} from "./chunk.YBCKQJK4.js";
 import {
   LocalizeController
 } from "./chunk.GIU3H3J3.js";
@@ -36,7 +36,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -526,4 +526,4 @@ setDefaultAnimation("file.text.appear", {
 export {
   SynFile
 };
-//# sourceMappingURL=chunk.2TUCVNJC.js.map
+//# sourceMappingURL=chunk.FQSDLEDV.js.map

package/dist/chunks/{chunk.BJEAUL3E.js → chunk.GFWWUBNH.js}

@@ -1,6 +1,6 @@
 import {
   SynDetails
-} from "./chunk.EOI2HN2V.js";
+} from "./chunk.EKJTAHHE.js";
 
 // src/components/details/details.ts
 var details_default = SynDetails;
@@ -9,4 +9,4 @@ SynDetails.define("syn-details");
 export {
   details_default
 };
-//# sourceMappingURL=chunk.BJEAUL3E.js.map
+//# sourceMappingURL=chunk.GFWWUBNH.js.map

package/dist/chunks/{chunk.ZPUFQ2RD.js → chunk.GKNICA2N.js}

@@ -1,6 +1,6 @@
 import {
   SynRadioButton
-} from "./chunk.YIVSAOEK.js";
+} from "./chunk.3UFTX7XQ.js";
 
 // src/components/radio-button/radio-button.ts
 var radio_button_default = SynRadioButton;
@@ -9,4 +9,4 @@ SynRadioButton.define("syn-radio-button");
 export {
   radio_button_default
 };
-//# sourceMappingURL=chunk.ZPUFQ2RD.js.map
+//# sourceMappingURL=chunk.GKNICA2N.js.map

package/dist/chunks/{chunk.TKLQA23R.js → chunk.GVQYXIOS.js}

@@ -4,7 +4,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -46,4 +46,4 @@ __decorateClass([
 export {
   SynRangeTick
 };
-//# sourceMappingURL=chunk.TKLQA23R.js.map
+//# sourceMappingURL=chunk.GVQYXIOS.js.map

package/dist/chunks/{chunk.55TZTLUK.js → chunk.H3NH57FA.js}

@@ -3,10 +3,10 @@ import {
 } from "./chunk.ONW45GQI.js";
 import {
   SynDivider
-} from "./chunk.6WCLRSET.js";
+} from "./chunk.NQEEDGN5.js";
 import {
   SynDrawer
-} from "./chunk.Z64KWT2C.js";
+} from "./chunk.CK2QKLSZ.js";
 import {
   unlockBodyScrolling
 } from "./chunk.5732DMBC.js";
@@ -30,7 +30,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -308,4 +308,4 @@ setDefaultAnimation("sideNav.overlay.hide", {
 export {
   SynSideNav
 };
-//# sourceMappingURL=chunk.55TZTLUK.js.map
+//# sourceMappingURL=chunk.H3NH57FA.js.map

package/dist/chunks/{chunk.HJZAAMXB.js → chunk.HDU3KDGC.js}

@@ -1,6 +1,6 @@
 import {
   SynRange
-} from "./chunk.YF66NQJL.js";
+} from "./chunk.VSJELW2C.js";
 
 // src/components/range/range.ts
 var range_default = SynRange;
@@ -9,4 +9,4 @@ SynRange.define("syn-range");
 export {
   range_default
 };
-//# sourceMappingURL=chunk.HJZAAMXB.js.map
+//# sourceMappingURL=chunk.HDU3KDGC.js.map

package/dist/chunks/{chunk.FCIGS2RC.js → chunk.HKKSVYTP.js}

@@ -1,6 +1,6 @@
 import {
   SynInput
-} from "./chunk.NMSCOKGV.js";
+} from "./chunk.S5GTUR3T.js";
 
 // src/components/input/input.ts
 var input_default = SynInput;
@@ -9,4 +9,4 @@ SynInput.define("syn-input");
 export {
   input_default
 };
-//# sourceMappingURL=chunk.FCIGS2RC.js.map
+//# sourceMappingURL=chunk.HKKSVYTP.js.map

package/dist/chunks/{chunk.WXE4XRLL.js → chunk.I5V5TBTQ.js}

@@ -1,6 +1,6 @@
 import {
   SynSpinner
-} from "./chunk.RWR732UE.js";
+} from "./chunk.BTCNWAF7.js";
 
 // src/components/spinner/spinner.ts
 var spinner_default = SynSpinner;
@@ -9,4 +9,4 @@ SynSpinner.define("syn-spinner");
 export {
   spinner_default
 };
-//# sourceMappingURL=chunk.WXE4XRLL.js.map
+//# sourceMappingURL=chunk.I5V5TBTQ.js.map

package/dist/chunks/{chunk.QAYS7O2Y.js → chunk.I6LVCMTE.js}

@@ -1,6 +1,6 @@
 import {
   SynTooltip
-} from "./chunk.Y3XTCSYB.js";
+} from "./chunk.VBPJP47S.js";
 
 // src/components/tooltip/tooltip.ts
 var tooltip_default = SynTooltip;
@@ -9,4 +9,4 @@ SynTooltip.define("syn-tooltip");
 export {
   tooltip_default
 };
-//# sourceMappingURL=chunk.QAYS7O2Y.js.map
+//# sourceMappingURL=chunk.I6LVCMTE.js.map

package/dist/chunks/{chunk.DO3GA23K.js → chunk.IREIR6KA.js}

@@ -1,6 +1,6 @@
 import {
   SynRangeTick
-} from "./chunk.TKLQA23R.js";
+} from "./chunk.GVQYXIOS.js";
 
 // src/components/range-tick/range-tick.ts
 var range_tick_default = SynRangeTick;
@@ -9,4 +9,4 @@ SynRangeTick.define("syn-range-tick");
 export {
   range_tick_default
 };
-//# sourceMappingURL=chunk.DO3GA23K.js.map
+//# sourceMappingURL=chunk.IREIR6KA.js.map

package/dist/chunks/{chunk.R2KYTZBW.js → chunk.JCA6F4L6.js}

@@ -1,6 +1,6 @@
 import {
   SynDialog
-} from "./chunk.HFFNFJBK.js";
+} from "./chunk.UI7YG4DD.js";
 
 // src/components/dialog/dialog.ts
 var dialog_default = SynDialog;
@@ -9,4 +9,4 @@ SynDialog.define("syn-dialog");
 export {
   dialog_default
 };
-//# sourceMappingURL=chunk.R2KYTZBW.js.map
+//# sourceMappingURL=chunk.JCA6F4L6.js.map

package/dist/chunks/{chunk.FTCHL3OG.js → chunk.JRB7DRBR.js}

@@ -1,6 +1,6 @@
 import {
   SynDropdown
-} from "./chunk.7EP5ZTF7.js";
+} from "./chunk.KWSECSZM.js";
 
 // src/components/dropdown/dropdown.ts
 var dropdown_default = SynDropdown;
@@ -9,4 +9,4 @@ SynDropdown.define("syn-dropdown");
 export {
   dropdown_default
 };
-//# sourceMappingURL=chunk.FTCHL3OG.js.map
+//# sourceMappingURL=chunk.JRB7DRBR.js.map

package/dist/chunks/{chunk.YOMJKVCO.js → chunk.JVBRCOVJ.js}

@@ -1,6 +1,6 @@
 import {
   SynProgressBar
-} from "./chunk.ILKUAKHV.js";
+} from "./chunk.3EY2CJGW.js";
 
 // src/components/progress-bar/progress-bar.ts
 var progress_bar_default = SynProgressBar;
@@ -9,4 +9,4 @@ SynProgressBar.define("syn-progress-bar");
 export {
   progress_bar_default
 };
-//# sourceMappingURL=chunk.YOMJKVCO.js.map
+//# sourceMappingURL=chunk.JVBRCOVJ.js.map

package/dist/chunks/{chunk.FCUWPPKQ.js → chunk.K2RV36N7.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.GVNVZMMM.js";
 import {
   icon_default
-} from "./chunk.BCFYNMAU.js";
+} from "./chunk.PECLVBE7.js";
 import {
   HasSlotController
 } from "./chunk.WVVQK5TE.js";
@@ -16,7 +16,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -180,4 +180,4 @@ __decorateClass([
 export {
   SynHeader
 };
-//# sourceMappingURL=chunk.FCUWPPKQ.js.map
+//# sourceMappingURL=chunk.K2RV36N7.js.map

package/dist/chunks/{chunk.PZQ6FY5U.js → chunk.K2T2YPOW.js}

@@ -1,6 +1,6 @@
 import {
   SynRadioGroup
-} from "./chunk.FXRKY42H.js";
+} from "./chunk.YJFYAORA.js";
 
 // src/components/radio-group/radio-group.ts
 var radio_group_default = SynRadioGroup;
@@ -9,4 +9,4 @@ SynRadioGroup.define("syn-radio-group");
 export {
   radio_group_default
 };
-//# sourceMappingURL=chunk.PZQ6FY5U.js.map
+//# sourceMappingURL=chunk.K2T2YPOW.js.map

package/dist/chunks/{chunk.XCZKYI7X.js → chunk.K4FEZUZR.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.BBUFEDXF.js";
 import {
   SynIconButton
-} from "./chunk.TUTGCZ2F.js";
+} from "./chunk.AA7UYQAJ.js";
 import {
   LocalizeController
 } from "./chunk.GIU3H3J3.js";
@@ -16,7 +16,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -116,4 +116,4 @@ __decorateClass([
 export {
   SynTab
 };
-//# sourceMappingURL=chunk.XCZKYI7X.js.map
+//# sourceMappingURL=chunk.K4FEZUZR.js.map

package/dist/chunks/{chunk.DOVJ2NYX.js → chunk.K5VCK7UZ.js}

@@ -1,6 +1,6 @@
 import {
   SynCombobox
-} from "./chunk.TPNNA5EJ.js";
+} from "./chunk.DCGPDI3G.js";
 
 // src/components/combobox/combobox.ts
 var combobox_default = SynCombobox;
@@ -9,4 +9,4 @@ SynCombobox.define("syn-combobox");
 export {
   combobox_default
 };
-//# sourceMappingURL=chunk.DOVJ2NYX.js.map
+//# sourceMappingURL=chunk.K5VCK7UZ.js.map

package/dist/chunks/{chunk.GOJ3XJRJ.js → chunk.KLCOD2FE.js}

@@ -10,7 +10,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -62,4 +62,4 @@ __decorateClass([
 export {
   SynTabPanel
 };
-//# sourceMappingURL=chunk.GOJ3XJRJ.js.map
+//# sourceMappingURL=chunk.KLCOD2FE.js.map

package/dist/chunks/{chunk.TWSN55TR.js → chunk.KLF642WF.js}

@@ -1,6 +1,6 @@
 import {
   SynBadge
-} from "./chunk.POIOBP3S.js";
+} from "./chunk.PBI2JGUC.js";
 
 // src/components/badge/badge.ts
 var badge_default = SynBadge;
@@ -9,4 +9,4 @@ SynBadge.define("syn-badge");
 export {
   badge_default
 };
-//# sourceMappingURL=chunk.TWSN55TR.js.map
+//# sourceMappingURL=chunk.KLF642WF.js.map

package/dist/chunks/{chunk.7EP5ZTF7.js → chunk.KWSECSZM.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.POGMEL53.js";
 import {
   SynPopup
-} from "./chunk.4AN73MGZ.js";
+} from "./chunk.3XYKUOSA.js";
 import {
   waitForEvent
 } from "./chunk.C2ENQBPM.js";
@@ -30,7 +30,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -372,4 +372,4 @@ setDefaultAnimation("dropdown.hide", {
 export {
   SynDropdown
 };
-//# sourceMappingURL=chunk.7EP5ZTF7.js.map
+//# sourceMappingURL=chunk.KWSECSZM.js.map

package/dist/chunks/{chunk.EPHFEISY.js → chunk.KXCQ5XRZ.js}

@@ -1,6 +1,6 @@
 import {
   SynAlert
-} from "./chunk.4PGAJKBN.js";
+} from "./chunk.M2O57JPI.js";
 
 // src/components/alert/alert.ts
 var alert_default = SynAlert;
@@ -9,4 +9,4 @@ SynAlert.define("syn-alert");
 export {
   alert_default
 };
-//# sourceMappingURL=chunk.EPHFEISY.js.map
+//# sourceMappingURL=chunk.KXCQ5XRZ.js.map

package/dist/chunks/{chunk.DZKWV5DQ.js → chunk.LMV4YGVB.js}

@@ -1,15 +1,18 @@
+import {
+  tab_group_custom_styles_default
+} from "./chunk.XOXVVU5C.js";
 import {
   tab_group_styles_default
-} from "./chunk.JQ47GWDL.js";
+} from "./chunk.PKYC7QF3.js";
 import {
-  tab_group_custom_styles_default
-} from "./chunk.NGI67WXT.js";
+  SynResizeObserver
+} from "./chunk.DFIN5XP4.js";
 import {
   scrollIntoView
 } from "./chunk.5732DMBC.js";
 import {
   SynIconButton
-} from "./chunk.TUTGCZ2F.js";
+} from "./chunk.AA7UYQAJ.js";
 import {
   LocalizeController
 } from "./chunk.GIU3H3J3.js";
@@ -19,16 +22,71 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.XTPT3AVO.js";
+} from "./chunk.WEXZUPCC.js";
 import {
   __decorateClass,
   __spreadValues
 } from "./chunk.2GFK6XTO.js";
 
+// src/internal/scrollend-polyfill.ts
+var debounce = (fn, delay) => {
+  let timerId = 0;
+  return function(...args) {
+    window.clearTimeout(timerId);
+    timerId = window.setTimeout(() => {
+      fn.call(this, ...args);
+    }, delay);
+  };
+};
+var decorate = (proto, method, decorateFn) => {
+  const superFn = proto[method];
+  proto[method] = function(...args) {
+    superFn.call(this, ...args);
+    decorateFn.call(this, superFn, ...args);
+  };
+};
+var isSupported = "onscrollend" in window;
+if (!isSupported) {
+  const pointers = /* @__PURE__ */ new Set();
+  const scrollHandlers = /* @__PURE__ */ new WeakMap();
+  const handlePointerDown = (event) => {
+    for (const touch of event.changedTouches) {
+      pointers.add(touch.identifier);
+    }
+  };
+  const handlePointerUp = (event) => {
+    for (const touch of event.changedTouches) {
+      pointers.delete(touch.identifier);
+    }
+  };
+  document.addEventListener("touchstart", handlePointerDown, true);
+  document.addEventListener("touchend", handlePointerUp, true);
+  document.addEventListener("touchcancel", handlePointerUp, true);
+  decorate(EventTarget.prototype, "addEventListener", function(addEventListener, type) {
+    if (type !== "scrollend") return;
+    const handleScrollEnd = debounce(() => {
+      if (!pointers.size) {
+        this.dispatchEvent(new Event("scrollend"));
+      } else {
+        handleScrollEnd();
+      }
+    }, 100);
+    addEventListener.call(this, "scroll", handleScrollEnd, { passive: true });
+    scrollHandlers.set(this, handleScrollEnd);
+  });
+  decorate(EventTarget.prototype, "removeEventListener", function(removeEventListener, type) {
+    if (type !== "scrollend") return;
+    const scrollHandler = scrollHandlers.get(this);
+    if (scrollHandler) {
+      removeEventListener.call(this, "scroll", scrollHandler, { passive: true });
+    }
+  });
+}
+
 // src/components/tab-group/tab-group.component.ts
 import { classMap } from "lit/directives/class-map.js";
+import { eventOptions, property, query, state } from "lit/decorators.js";
 import { html } from "lit";
-import { property, query, state } from "lit/decorators.js";
 var SynTabGroup = class extends SynergyElement {
   constructor() {
     super(...arguments);
@@ -37,11 +95,19 @@ var SynTabGroup = class extends SynergyElement {
     this.focusableTabs = [];
     this.panels = [];
     this.hasScrollControls = false;
+    this.shouldHideScrollStartButton = false;
+    this.shouldHideScrollEndButton = false;
     this.placement = "top";
     this.activation = "auto";
     this.noScrollControls = false;
     this.contained = false;
     this.sharp = false;
+    this.fixedScrollControls = false;
+    /**
+     * The reality of the browser means that we can't expect the scroll position to be exactly what we want it to be, so
+     * we add one pixel of wiggle room to our calculations.
+     */
+    this.scrollOffset = 1;
   }
   connectedCallback() {
     const whenAllDefined = Promise.all([
@@ -79,11 +145,10 @@ var SynTabGroup = class extends SynergyElement {
     });
   }
   disconnectedCallback() {
+    var _a, _b;
     super.disconnectedCallback();
-    this.mutationObserver.disconnect();
-    if (this.nav) {
-      this.resizeObserver.unobserve(this.nav);
-    }
+    (_a = this.mutationObserver) == null ? void 0 : _a.disconnect();
+    (_b = this.resizeObserver) == null ? void 0 : _b.unobserve(this.nav);
   }
   getAllTabs() {
     const slot = this.shadowRoot.querySelector('slot[name="nav"]');
@@ -263,12 +328,25 @@ var SynTabGroup = class extends SynergyElement {
     }
     return nextTab;
   }
+  updateScrollButtons() {
+    if (this.hasScrollControls && !this.fixedScrollControls) {
+      this.shouldHideScrollStartButton = this.scrollFromStart() <= this.scrollOffset;
+      this.shouldHideScrollEndButton = this.isScrolledToEnd();
+    }
+  }
+  isScrolledToEnd() {
+    return this.scrollFromStart() + this.nav.clientWidth >= this.nav.scrollWidth - this.scrollOffset;
+  }
+  scrollFromStart() {
+    return this.localize.dir() === "rtl" ? -this.nav.scrollLeft : this.nav.scrollLeft;
+  }
   updateScrollControls() {
     if (this.noScrollControls) {
       this.hasScrollControls = false;
     } else {
       this.hasScrollControls = ["top"].includes(this.placement) && this.nav.scrollWidth > this.nav.clientWidth + 1;
     }
+    this.updateScrollButtons();
   }
   syncIndicator() {
     const tab = this.getActiveTab();
@@ -308,18 +386,26 @@ var SynTabGroup = class extends SynergyElement {
                 <syn-icon-button
                   part="scroll-button scroll-button--start"
                   exportparts="base:scroll-button__base"
-                  class="tab-group__scroll-button tab-group__scroll-button--start"
+                  class=${classMap({
+      "tab-group__scroll-button": true,
+      "tab-group__scroll-button--start": true,
+      "tab-group__scroll-button--start--hidden": this.shouldHideScrollStartButton
+    })}
                   name="chevron-right"
                   library="system"
+                  tabindex="-1"
+                  aria-hidden="true"
                   label=${this.localize.term("scrollToStart")}
                   @click=${this.handleScrollToStart}
                 ></syn-icon-button>
               ` : ""}
 
-          <div class="tab-group__nav">
+          <div class="tab-group__nav" @scrollend=${this.updateScrollButtons}>
             <div part="tabs" class="tab-group__tabs" role="tablist">
               <div part="active-tab-indicator" class="tab-group__indicator"></div>
-              <slot name="nav" @slotchange=${this.syncTabsAndPanels}></slot>
+              <syn-resize-observer @syn-resize=${this.syncIndicator}>
+                <slot name="nav" @slotchange=${this.syncTabsAndPanels}></slot>
+              </syn-resize-observer>
             </div>
           </div>
 
@@ -327,9 +413,15 @@ var SynTabGroup = class extends SynergyElement {
                 <syn-icon-button
                   part="scroll-button scroll-button--end"
                   exportparts="base:scroll-button__base"
-                  class="tab-group__scroll-button tab-group__scroll-button--end"
+                  class=${classMap({
+      "tab-group__scroll-button": true,
+      "tab-group__scroll-button--end": true,
+      "tab-group__scroll-button--end--hidden": this.shouldHideScrollEndButton
+    })}
                   name="chevron-right"
                   library="system"
+                  tabindex="-1"
+                  aria-hidden="true"
                   label=${this.localize.term("scrollToEnd")}
                   @click=${this.handleScrollToEnd}
                 ></syn-icon-button>
@@ -342,7 +434,7 @@ var SynTabGroup = class extends SynergyElement {
   }
 };
 SynTabGroup.styles = [component_styles_default, tab_group_styles_default, tab_group_custom_styles_default];
-SynTabGroup.dependencies = { "syn-icon-button": SynIconButton };
+SynTabGroup.dependencies = { "syn-icon-button": SynIconButton, "syn-resize-observer": SynResizeObserver };
 __decorateClass([
   query(".tab-group")
 ], SynTabGroup.prototype, "tabGroup", 2);
@@ -358,6 +450,12 @@ __decorateClass([
 __decorateClass([
   state()
 ], SynTabGroup.prototype, "hasScrollControls", 2);
+__decorateClass([
+  state()
+], SynTabGroup.prototype, "shouldHideScrollStartButton", 2);
+__decorateClass([
+  state()
+], SynTabGroup.prototype, "shouldHideScrollEndButton", 2);
 __decorateClass([
   property()
 ], SynTabGroup.prototype, "placement", 2);
@@ -373,6 +471,12 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean })
 ], SynTabGroup.prototype, "sharp", 2);
+__decorateClass([
+  property({ attribute: "fixed-scroll-controls", type: Boolean })
+], SynTabGroup.prototype, "fixedScrollControls", 2);
+__decorateClass([
+  eventOptions({ passive: true })
+], SynTabGroup.prototype, "updateScrollButtons", 1);
 __decorateClass([
   watch("noScrollControls", { waitUntilFirstUpdate: true })
 ], SynTabGroup.prototype, "updateScrollControls", 1);
@@ -383,4 +487,4 @@ __decorateClass([
 export {
   SynTabGroup
 };
-//# sourceMappingURL=chunk.DZKWV5DQ.js.map
+//# sourceMappingURL=chunk.LMV4YGVB.js.map