@emuanalytics/flow-rdf-ui 0.0.3 → 0.0.4

package/dist/flow-rdf-ui.js

@@ -771,15 +771,15 @@ function waitForEvent(el, eventName) {
     el.addEventListener(eventName, done);
   });
 }
-var __defProp$P = Object.defineProperty;
-var __getOwnPropDesc$P = Object.getOwnPropertyDescriptor;
-var __decorateClass$P = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$P(target, key) : target;
+var __defProp$Q = Object.defineProperty;
+var __getOwnPropDesc$Q = Object.getOwnPropertyDescriptor;
+var __decorateClass$Q = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$Q(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$P(target, key, result);
+    __defProp$Q(target, key, result);
   return result;
 };
 class FlowRdfElement extends s$3 {
@@ -803,10 +803,10 @@ class FlowRdfElement extends s$3 {
     }
   }
 }
-__decorateClass$P([
+__decorateClass$Q([
   n$5()
 ], FlowRdfElement.prototype, "dir", 2);
-__decorateClass$P([
+__decorateClass$Q([
   n$5()
 ], FlowRdfElement.prototype, "lang", 2);
 class HasSlotController {
@@ -1072,7 +1072,7 @@ const componentStyles = i$7`
     display: none !important;
   }
 `;
-const styles$M = i$7`
+const styles$N = i$7`
   ${componentStyles}
 
   :host {
@@ -1263,15 +1263,15 @@ function registerIconLibrary(name, options) {
 function unregisterIconLibrary(name) {
   registry = registry.filter((lib) => lib.name !== name);
 }
-var __defProp$O = Object.defineProperty;
-var __getOwnPropDesc$O = Object.getOwnPropertyDescriptor;
-var __decorateClass$O = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$O(target, key) : target;
+var __defProp$P = Object.defineProperty;
+var __getOwnPropDesc$P = Object.getOwnPropertyDescriptor;
+var __decorateClass$P = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$P(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$O(target, key, result);
+    __defProp$P(target, key, result);
   return result;
 };
 const CACHEABLE_ERROR = Symbol();
@@ -1380,29 +1380,29 @@ let FlowIcon = class extends FlowRdfElement {
     return this.svg;
   }
 };
-FlowIcon.styles = styles$M;
-__decorateClass$O([
+FlowIcon.styles = styles$N;
+__decorateClass$P([
   t$2()
 ], FlowIcon.prototype, "svg", 2);
-__decorateClass$O([
+__decorateClass$P([
   n$5({ reflect: true })
 ], FlowIcon.prototype, "name", 2);
-__decorateClass$O([
+__decorateClass$P([
   n$5()
 ], FlowIcon.prototype, "src", 2);
-__decorateClass$O([
+__decorateClass$P([
   n$5()
 ], FlowIcon.prototype, "label", 2);
-__decorateClass$O([
+__decorateClass$P([
   n$5({ reflect: true })
 ], FlowIcon.prototype, "library", 2);
-__decorateClass$O([
+__decorateClass$P([
   watch("label")
 ], FlowIcon.prototype, "handleLabelChange", 1);
-__decorateClass$O([
+__decorateClass$P([
   watch(["name", "src", "library"])
 ], FlowIcon.prototype, "setIcon", 1);
-FlowIcon = __decorateClass$O([
+FlowIcon = __decorateClass$P([
   e$6("flow-ui-icon")
 ], FlowIcon);
 const min = Math.min;
@@ -2328,7 +2328,7 @@ function r(t2) {
   }
   return null;
 }
-const styles$L = i$7`
+const styles$M = i$7`
   ${componentStyles}
 
   :host {
@@ -2369,15 +2369,15 @@ const styles$L = i$7`
     z-index: -1;
   }
 `;
-var __defProp$N = Object.defineProperty;
-var __getOwnPropDesc$N = Object.getOwnPropertyDescriptor;
-var __decorateClass$N = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$N(target, key) : target;
+var __defProp$O = Object.defineProperty;
+var __getOwnPropDesc$O = Object.getOwnPropertyDescriptor;
+var __decorateClass$O = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$O(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$N(target, key, result);
+    __defProp$O(target, key, result);
   return result;
 };
 let FlowPopup = class extends FlowRdfElement {
@@ -2611,44 +2611,44 @@ let FlowPopup = class extends FlowRdfElement {
     `;
   }
 };
-FlowPopup.styles = styles$L;
-__decorateClass$N([
+FlowPopup.styles = styles$M;
+__decorateClass$O([
   i$4(".popup")
 ], FlowPopup.prototype, "popup", 2);
-__decorateClass$N([
+__decorateClass$O([
   i$4(".popup__arrow")
 ], FlowPopup.prototype, "arrowEl", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5()
 ], FlowPopup.prototype, "anchor", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Boolean, reflect: true })
 ], FlowPopup.prototype, "active", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ reflect: true })
 ], FlowPopup.prototype, "placement", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ reflect: true })
 ], FlowPopup.prototype, "strategy", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Number })
 ], FlowPopup.prototype, "distance", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Number })
 ], FlowPopup.prototype, "skidding", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Boolean })
 ], FlowPopup.prototype, "arrow", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "arrow-placement" })
 ], FlowPopup.prototype, "arrowPlacement", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "arrow-padding", type: Number })
 ], FlowPopup.prototype, "arrowPadding", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Boolean })
 ], FlowPopup.prototype, "flip", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({
     attribute: "flip-fallback-placements",
     converter: {
@@ -2661,40 +2661,40 @@ __decorateClass$N([
     }
   })
 ], FlowPopup.prototype, "flipFallbackPlacements", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "flip-fallback-strategy" })
 ], FlowPopup.prototype, "flipFallbackStrategy", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Object })
 ], FlowPopup.prototype, "flipBoundary", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "flip-padding", type: Number })
 ], FlowPopup.prototype, "flipPadding", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Boolean })
 ], FlowPopup.prototype, "shift", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Object })
 ], FlowPopup.prototype, "shiftBoundary", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "shift-padding", type: Number })
 ], FlowPopup.prototype, "shiftPadding", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "auto-size" })
 ], FlowPopup.prototype, "autoSize", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5()
 ], FlowPopup.prototype, "sync", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ type: Object })
 ], FlowPopup.prototype, "autoSizeBoundary", 2);
-__decorateClass$N([
+__decorateClass$O([
   n$5({ attribute: "auto-size-padding", type: Number })
 ], FlowPopup.prototype, "autoSizePadding", 2);
-FlowPopup = __decorateClass$N([
+FlowPopup = __decorateClass$O([
   e$6("flow-ui-popup")
 ], FlowPopup);
-const styles$K = i$7`
+const styles$L = i$7`
   ${componentStyles}
 
   :host {
@@ -2746,15 +2746,15 @@ const styles$K = i$7`
     pointer-events: none;
   }
 `;
-var __defProp$M = Object.defineProperty;
-var __getOwnPropDesc$M = Object.getOwnPropertyDescriptor;
-var __decorateClass$M = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$M(target, key) : target;
+var __defProp$N = Object.defineProperty;
+var __getOwnPropDesc$N = Object.getOwnPropertyDescriptor;
+var __decorateClass$N = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$N(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$M(target, key, result);
+    __defProp$N(target, key, result);
   return result;
 };
 let FlowTooltip = class extends FlowRdfElement {
@@ -2931,50 +2931,50 @@ let FlowTooltip = class extends FlowRdfElement {
     `;
   }
 };
-FlowTooltip.styles = styles$K;
-__decorateClass$M([
+FlowTooltip.styles = styles$L;
+__decorateClass$N([
   i$4("slot:not([name])")
 ], FlowTooltip.prototype, "defaultSlot", 2);
-__decorateClass$M([
+__decorateClass$N([
   i$4(".tooltip__body")
 ], FlowTooltip.prototype, "body", 2);
-__decorateClass$M([
+__decorateClass$N([
   i$4("flow-ui-popup")
 ], FlowTooltip.prototype, "popup", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5()
 ], FlowTooltip.prototype, "content", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5()
 ], FlowTooltip.prototype, "placement", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5({ type: Boolean, reflect: true })
 ], FlowTooltip.prototype, "disabled", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5({ type: Number })
 ], FlowTooltip.prototype, "distance", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5({ type: Boolean, reflect: true })
 ], FlowTooltip.prototype, "open", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5({ type: Number })
 ], FlowTooltip.prototype, "skidding", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5()
 ], FlowTooltip.prototype, "trigger", 2);
-__decorateClass$M([
+__decorateClass$N([
   n$5({ type: Boolean })
 ], FlowTooltip.prototype, "hoist", 2);
-__decorateClass$M([
+__decorateClass$N([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowTooltip.prototype, "handleOpenChange", 1);
-__decorateClass$M([
+__decorateClass$N([
   watch(["content", "distance", "hoist", "placement", "skidding"])
 ], FlowTooltip.prototype, "handleOptionsChange", 1);
-__decorateClass$M([
+__decorateClass$N([
   watch("disabled")
 ], FlowTooltip.prototype, "handleDisabledChange", 1);
-FlowTooltip = __decorateClass$M([
+FlowTooltip = __decorateClass$N([
   e$6("flow-ui-tooltip")
 ], FlowTooltip);
 setDefaultAnimation("tooltip.show", {
@@ -2991,7 +2991,7 @@ setDefaultAnimation("tooltip.hide", {
   ],
   options: { duration: 150, easing: "ease" }
 });
-const styles$J = i$7`
+const styles$K = i$7`
   ${componentStyles}
 
   :host {
@@ -3060,18 +3060,18 @@ const styles$J = i$7`
     margin-inline: var(--flow-ui-spacing-x-small);
   }
 `;
-var __defProp$L = Object.defineProperty;
-var __getOwnPropDesc$L = Object.getOwnPropertyDescriptor;
-var __decorateClass$L = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$L(target, key) : target;
+var __defProp$M = Object.defineProperty;
+var __getOwnPropDesc$M = Object.getOwnPropertyDescriptor;
+var __decorateClass$M = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$M(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$L(target, key, result);
+    __defProp$M(target, key, result);
   return result;
 };
-let FlowIconButton = class extends FlowRdfElement {
+class FlowIconButton extends FlowRdfElement {
   constructor() {
     super(...arguments);
     this.hasSlotController = new HasSlotController(this, "tooltip");
@@ -3230,63 +3230,60 @@ let FlowIconButton = class extends FlowRdfElement {
       return iconButton;
     }
   }
-};
-FlowIconButton.styles = styles$J;
-__decorateClass$L([
+}
+FlowIconButton.styles = styles$K;
+__decorateClass$M([
   i$4(".icon-button")
 ], FlowIconButton.prototype, "button", 2);
-__decorateClass$L([
+__decorateClass$M([
   i$4(".icon-button__tooltip")
 ], FlowIconButton.prototype, "tooltipElem", 2);
-__decorateClass$L([
+__decorateClass$M([
   i$4(".icon-button__confirm_button")
 ], FlowIconButton.prototype, "confirmButton", 2);
-__decorateClass$L([
+__decorateClass$M([
   t$2()
 ], FlowIconButton.prototype, "hasFocus", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "name", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "library", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "src", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "href", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "target", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "download", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "label", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "tooltip", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5({ attribute: "tooltip-placement" })
 ], FlowIconButton.prototype, "tooltipPlacement", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5({ attribute: "tooltip-distance", type: Number })
 ], FlowIconButton.prototype, "tooltipDistance", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5({ attribute: "tooltip-skidding", type: Number })
 ], FlowIconButton.prototype, "tooltipSkidding", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5({ type: Boolean, reflect: true })
 ], FlowIconButton.prototype, "disabled", 2);
-__decorateClass$L([
+__decorateClass$M([
   n$5()
 ], FlowIconButton.prototype, "confirm", 2);
-FlowIconButton = __decorateClass$L([
-  e$6("flow-ui-icon-button")
-], FlowIconButton);
-const styles$I = i$7`
+const styles$J = i$7`
   ${componentStyles}
 
   :host {
@@ -3380,15 +3377,15 @@ const styles$I = i$7`
     padding-inline-end: var(--flow-ui-spacing-medium);
   }
 `;
-var __defProp$K = Object.defineProperty;
-var __getOwnPropDesc$K = Object.getOwnPropertyDescriptor;
-var __decorateClass$K = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$K(target, key) : target;
+var __defProp$L = Object.defineProperty;
+var __getOwnPropDesc$L = Object.getOwnPropertyDescriptor;
+var __decorateClass$L = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$L(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$K(target, key, result);
+    __defProp$L(target, key, result);
   return result;
 };
 const toastStack = Object.assign(document.createElement("div"), { className: "flow-ui-toast-stack" });
@@ -3523,29 +3520,29 @@ let FlowAlert = class extends FlowRdfElement {
     `;
   }
 };
-FlowAlert.styles = styles$I;
-__decorateClass$K([
+FlowAlert.styles = styles$J;
+__decorateClass$L([
   i$4('[part~="base"]')
 ], FlowAlert.prototype, "base", 2);
-__decorateClass$K([
+__decorateClass$L([
   n$5({ type: Boolean, reflect: true })
 ], FlowAlert.prototype, "open", 2);
-__decorateClass$K([
+__decorateClass$L([
   n$5({ type: Boolean, reflect: true })
 ], FlowAlert.prototype, "closable", 2);
-__decorateClass$K([
+__decorateClass$L([
   n$5({ reflect: true })
 ], FlowAlert.prototype, "variant", 2);
-__decorateClass$K([
+__decorateClass$L([
   n$5({ type: Number })
 ], FlowAlert.prototype, "duration", 2);
-__decorateClass$K([
+__decorateClass$L([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowAlert.prototype, "handleOpenChange", 1);
-__decorateClass$K([
+__decorateClass$L([
   watch("duration")
 ], FlowAlert.prototype, "handleDurationChange", 1);
-FlowAlert = __decorateClass$K([
+FlowAlert = __decorateClass$L([
   e$6("flow-ui-alert")
 ], FlowAlert);
 setDefaultAnimation("alert.show", {
@@ -3562,7 +3559,7 @@ setDefaultAnimation("alert.hide", {
   ],
   options: { duration: 250, easing: "ease" }
 });
-const styles$H = i$7`
+const styles$I = i$7`
   ${componentStyles}
 
   :host {
@@ -4337,15 +4334,15 @@ function getAnimationNames() {
 function getEasingNames() {
   return Object.entries(easings).map(([name]) => name);
 }
-var __defProp$J = Object.defineProperty;
-var __getOwnPropDesc$J = Object.getOwnPropertyDescriptor;
-var __decorateClass$J = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$J(target, key) : target;
+var __defProp$K = Object.defineProperty;
+var __getOwnPropDesc$K = Object.getOwnPropertyDescriptor;
+var __decorateClass$K = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$K(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$J(target, key, result);
+    __defProp$K(target, key, result);
   return result;
 };
 let FlowAnimation = class extends FlowRdfElement {
@@ -4476,47 +4473,47 @@ let FlowAnimation = class extends FlowRdfElement {
     return x$1` <slot @slotchange=${this.handleSlotChange}></slot> `;
   }
 };
-FlowAnimation.styles = styles$H;
-__decorateClass$J([
+FlowAnimation.styles = styles$I;
+__decorateClass$K([
   e$3("slot")
 ], FlowAnimation.prototype, "defaultSlot", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5()
 ], FlowAnimation.prototype, "name", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ type: Boolean, reflect: true })
 ], FlowAnimation.prototype, "play", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ type: Number })
 ], FlowAnimation.prototype, "delay", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5()
 ], FlowAnimation.prototype, "direction", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ type: Number })
 ], FlowAnimation.prototype, "duration", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5()
 ], FlowAnimation.prototype, "easing", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ attribute: "end-delay", type: Number })
 ], FlowAnimation.prototype, "endDelay", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5()
 ], FlowAnimation.prototype, "fill", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ type: Number })
 ], FlowAnimation.prototype, "iterations", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ attribute: "iteration-start", type: Number })
 ], FlowAnimation.prototype, "iterationStart", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ attribute: false })
 ], FlowAnimation.prototype, "keyframes", 2);
-__decorateClass$J([
+__decorateClass$K([
   n$5({ attribute: "playback-rate", type: Number })
 ], FlowAnimation.prototype, "playbackRate", 2);
-__decorateClass$J([
+__decorateClass$K([
   watch([
     "name",
     "delay",
@@ -4530,16 +4527,16 @@ __decorateClass$J([
     "keyframes"
   ])
 ], FlowAnimation.prototype, "handleAnimationChange", 1);
-__decorateClass$J([
+__decorateClass$K([
   watch("play")
 ], FlowAnimation.prototype, "handlePlayChange", 1);
-__decorateClass$J([
+__decorateClass$K([
   watch("playbackRate")
 ], FlowAnimation.prototype, "handlePlaybackRateChange", 1);
-FlowAnimation = __decorateClass$J([
+FlowAnimation = __decorateClass$K([
   e$6("flow-ui-animation")
 ], FlowAnimation);
-const styles$G = i$7`
+const styles$H = i$7`
   ${componentStyles}
 
   :host {
@@ -4604,15 +4601,15 @@ const styles$G = i$7`
     overflow: hidden;
   }
 `;
-var __defProp$I = Object.defineProperty;
-var __getOwnPropDesc$I = Object.getOwnPropertyDescriptor;
-var __decorateClass$I = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$I(target, key) : target;
-  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
-    if (decorator = decorators[i3])
+var __defProp$J = Object.defineProperty;
+var __getOwnPropDesc$J = Object.getOwnPropertyDescriptor;
+var __decorateClass$J = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$J(target, key) : target;
+  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$I(target, key, result);
+    __defProp$J(target, key, result);
   return result;
 };
 let FlowAvatar = class extends FlowRdfElement {
@@ -4666,32 +4663,32 @@ let FlowAvatar = class extends FlowRdfElement {
     `;
   }
 };
-FlowAvatar.styles = styles$G;
-__decorateClass$I([
+FlowAvatar.styles = styles$H;
+__decorateClass$J([
   t$2()
 ], FlowAvatar.prototype, "hasError", 2);
-__decorateClass$I([
+__decorateClass$J([
   n$5()
 ], FlowAvatar.prototype, "image", 2);
-__decorateClass$I([
+__decorateClass$J([
   n$5()
 ], FlowAvatar.prototype, "label", 2);
-__decorateClass$I([
+__decorateClass$J([
   n$5()
 ], FlowAvatar.prototype, "initials", 2);
-__decorateClass$I([
+__decorateClass$J([
   n$5()
 ], FlowAvatar.prototype, "loading", 2);
-__decorateClass$I([
+__decorateClass$J([
   n$5({ reflect: true })
 ], FlowAvatar.prototype, "shape", 2);
-__decorateClass$I([
+__decorateClass$J([
   watch("image")
 ], FlowAvatar.prototype, "handleImageChange", 1);
-FlowAvatar = __decorateClass$I([
+FlowAvatar = __decorateClass$J([
   e$6("flow-ui-avatar")
 ], FlowAvatar);
-const styles$F = i$7`
+const styles$G = i$7`
   ${componentStyles}
 
   :host {
@@ -4782,15 +4779,15 @@ const styles$F = i$7`
     }
   }
 `;
-var __defProp$H = Object.defineProperty;
-var __getOwnPropDesc$H = Object.getOwnPropertyDescriptor;
-var __decorateClass$H = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$H(target, key) : target;
+var __defProp$I = Object.defineProperty;
+var __getOwnPropDesc$I = Object.getOwnPropertyDescriptor;
+var __decorateClass$I = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$I(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$H(target, key, result);
+    __defProp$I(target, key, result);
   return result;
 };
 let FlowBadge = class extends FlowRdfElement {
@@ -4819,20 +4816,20 @@ let FlowBadge = class extends FlowRdfElement {
     `;
   }
 };
-FlowBadge.styles = styles$F;
-__decorateClass$H([
+FlowBadge.styles = styles$G;
+__decorateClass$I([
   n$5({ reflect: true })
 ], FlowBadge.prototype, "variant", 2);
-__decorateClass$H([
+__decorateClass$I([
   n$5({ type: Boolean, reflect: true })
 ], FlowBadge.prototype, "pill", 2);
-__decorateClass$H([
+__decorateClass$I([
   n$5({ type: Boolean, reflect: true })
 ], FlowBadge.prototype, "pulse", 2);
-FlowBadge = __decorateClass$H([
+FlowBadge = __decorateClass$I([
   e$6("flow-ui-badge")
 ], FlowBadge);
-const styles$E = i$7`
+const styles$F = i$7`
   ${componentStyles}
 
   :host {
@@ -4917,15 +4914,15 @@ const styles$E = i$7`
     user-select: none;
   }
 `;
-var __defProp$G = Object.defineProperty;
-var __getOwnPropDesc$G = Object.getOwnPropertyDescriptor;
-var __decorateClass$G = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$G(target, key) : target;
+var __defProp$H = Object.defineProperty;
+var __getOwnPropDesc$H = Object.getOwnPropertyDescriptor;
+var __decorateClass$H = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$H(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$G(target, key, result);
+    __defProp$H(target, key, result);
   return result;
 };
 let FlowBreadcrumbItem = class extends FlowRdfElement {
@@ -4970,20 +4967,20 @@ let FlowBreadcrumbItem = class extends FlowRdfElement {
     `;
   }
 };
-FlowBreadcrumbItem.styles = styles$E;
-__decorateClass$G([
+FlowBreadcrumbItem.styles = styles$F;
+__decorateClass$H([
   n$5()
 ], FlowBreadcrumbItem.prototype, "href", 2);
-__decorateClass$G([
+__decorateClass$H([
   n$5()
 ], FlowBreadcrumbItem.prototype, "target", 2);
-__decorateClass$G([
+__decorateClass$H([
   n$5()
 ], FlowBreadcrumbItem.prototype, "rel", 2);
-FlowBreadcrumbItem = __decorateClass$G([
+FlowBreadcrumbItem = __decorateClass$H([
   e$6("flow-ui-breadcrumb-item")
 ], FlowBreadcrumbItem);
-const styles$D = i$7`
+const styles$E = i$7`
   ${componentStyles}
 
   .breadcrumb {
@@ -4992,15 +4989,15 @@ const styles$D = i$7`
     flex-wrap: wrap;
   }
 `;
-var __defProp$F = Object.defineProperty;
-var __getOwnPropDesc$F = Object.getOwnPropertyDescriptor;
-var __decorateClass$F = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$F(target, key) : target;
+var __defProp$G = Object.defineProperty;
+var __getOwnPropDesc$G = Object.getOwnPropertyDescriptor;
+var __decorateClass$G = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$G(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$F(target, key, result);
+    __defProp$G(target, key, result);
   return result;
 };
 let FlowBreadcrumb = class extends FlowRdfElement {
@@ -5054,20 +5051,20 @@ let FlowBreadcrumb = class extends FlowRdfElement {
     `;
   }
 };
-FlowBreadcrumb.styles = styles$D;
-__decorateClass$F([
+FlowBreadcrumb.styles = styles$E;
+__decorateClass$G([
   i$4("slot")
 ], FlowBreadcrumb.prototype, "defaultSlot", 2);
-__decorateClass$F([
+__decorateClass$G([
   i$4('slot[name="separator"]')
 ], FlowBreadcrumb.prototype, "separatorSlot", 2);
-__decorateClass$F([
+__decorateClass$G([
   n$5()
 ], FlowBreadcrumb.prototype, "label", 2);
-FlowBreadcrumb = __decorateClass$F([
+FlowBreadcrumb = __decorateClass$G([
   e$6("flow-ui-breadcrumb")
 ], FlowBreadcrumb);
-const styles$C = i$7`
+const styles$D = i$7`
   ${componentStyles}
 
   :host {
@@ -5083,15 +5080,15 @@ const styles$C = i$7`
     flex-direction: column;
   }
 `;
-var __defProp$E = Object.defineProperty;
-var __getOwnPropDesc$E = Object.getOwnPropertyDescriptor;
-var __decorateClass$E = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$E(target, key) : target;
+var __defProp$F = Object.defineProperty;
+var __getOwnPropDesc$F = Object.getOwnPropertyDescriptor;
+var __decorateClass$F = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$F(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$E(target, key, result);
+    __defProp$F(target, key, result);
   return result;
 };
 let FlowButtonGroup = class extends FlowRdfElement {
@@ -5154,23 +5151,23 @@ let FlowButtonGroup = class extends FlowRdfElement {
     `;
   }
 };
-FlowButtonGroup.styles = styles$C;
-__decorateClass$E([
+FlowButtonGroup.styles = styles$D;
+__decorateClass$F([
   i$4("slot")
 ], FlowButtonGroup.prototype, "defaultSlot", 2);
-__decorateClass$E([
+__decorateClass$F([
   t$2()
 ], FlowButtonGroup.prototype, "disableRole", 2);
-__decorateClass$E([
+__decorateClass$F([
   n$5()
 ], FlowButtonGroup.prototype, "label", 2);
-__decorateClass$E([
+__decorateClass$F([
   n$5({ type: Boolean, reflect: true })
 ], FlowButtonGroup.prototype, "vertical", 2);
-__decorateClass$E([
+__decorateClass$F([
   watch("vertical", { waitUntilFirstUpdate: true })
 ], FlowButtonGroup.prototype, "handleVerticalChange", 1);
-FlowButtonGroup = __decorateClass$E([
+FlowButtonGroup = __decorateClass$F([
   e$6("flow-ui-button-group")
 ], FlowButtonGroup);
 function findButton(el) {
@@ -5441,7 +5438,7 @@ const customErrorValidityState = Object.freeze({
   valid: false,
   customError: true
 });
-const styles$B = i$7`
+const styles$C = i$7`
   ${componentStyles}
 
   :host {
@@ -5500,15 +5497,15 @@ const styles$B = i$7`
     }
   }
 `;
-var __defProp$D = Object.defineProperty;
-var __getOwnPropDesc$D = Object.getOwnPropertyDescriptor;
-var __decorateClass$D = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$D(target, key) : target;
+var __defProp$E = Object.defineProperty;
+var __getOwnPropDesc$E = Object.getOwnPropertyDescriptor;
+var __decorateClass$E = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$E(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$D(target, key, result);
+    __defProp$E(target, key, result);
   return result;
 };
 let FlowSpinner = class extends FlowRdfElement {
@@ -5525,8 +5522,8 @@ let FlowSpinner = class extends FlowRdfElement {
     `;
   }
 };
-FlowSpinner.styles = styles$B;
-FlowSpinner = __decorateClass$D([
+FlowSpinner.styles = styles$C;
+FlowSpinner = __decorateClass$E([
   e$6("flow-ui-spinner")
 ], FlowSpinner);
 const buttonStyles = i$7`
@@ -6169,15 +6166,15 @@ const buttonStyles = i$7`
     z-index: 3;
   }
 `;
-var __defProp$C = Object.defineProperty;
-var __getOwnPropDesc$C = Object.getOwnPropertyDescriptor;
-var __decorateClass$C = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$C(target, key) : target;
+var __defProp$D = Object.defineProperty;
+var __getOwnPropDesc$D = Object.getOwnPropertyDescriptor;
+var __decorateClass$D = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$D(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$C(target, key, result);
+    __defProp$D(target, key, result);
   return result;
 };
 let FlowButton = class extends FlowRdfElement {
@@ -6374,88 +6371,88 @@ let FlowButton = class extends FlowRdfElement {
   }
 };
 FlowButton.styles = buttonStyles;
-__decorateClass$C([
+__decorateClass$D([
   i$4(".button")
 ], FlowButton.prototype, "button", 2);
-__decorateClass$C([
+__decorateClass$D([
   t$2()
 ], FlowButton.prototype, "hasFocus", 2);
-__decorateClass$C([
+__decorateClass$D([
   t$2()
 ], FlowButton.prototype, "invalid", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "title", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ reflect: true })
 ], FlowButton.prototype, "variant", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ reflect: true })
 ], FlowButton.prototype, "size", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ type: Boolean, reflect: true })
 ], FlowButton.prototype, "caret", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ type: Boolean, reflect: true })
 ], FlowButton.prototype, "disabled", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ type: Boolean, reflect: true })
 ], FlowButton.prototype, "loading", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ type: Boolean, reflect: true })
 ], FlowButton.prototype, "outline", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ type: Boolean, reflect: true })
 ], FlowButton.prototype, "pill", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ type: Boolean, reflect: true })
 ], FlowButton.prototype, "circle", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "type", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "name", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "value", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "href", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "target", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "rel", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "download", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5()
 ], FlowButton.prototype, "form", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ attribute: "formaction" })
 ], FlowButton.prototype, "formAction", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ attribute: "formenctype" })
 ], FlowButton.prototype, "formEnctype", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ attribute: "formmethod" })
 ], FlowButton.prototype, "formMethod", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ attribute: "formnovalidate", type: Boolean })
 ], FlowButton.prototype, "formNoValidate", 2);
-__decorateClass$C([
+__decorateClass$D([
   n$5({ attribute: "formtarget" })
 ], FlowButton.prototype, "formTarget", 2);
-__decorateClass$C([
+__decorateClass$D([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowButton.prototype, "handleDisabledChange", 1);
-FlowButton = __decorateClass$C([
+FlowButton = __decorateClass$D([
   e$6("flow-ui-button")
 ], FlowButton);
-const styles$A = i$7`
+const styles$B = i$7`
   ${componentStyles}
 
   :host {
@@ -6523,15 +6520,15 @@ const styles$A = i$7`
     display: none;
   }
 `;
-var __defProp$B = Object.defineProperty;
-var __getOwnPropDesc$B = Object.getOwnPropertyDescriptor;
-var __decorateClass$B = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$B(target, key) : target;
+var __defProp$C = Object.defineProperty;
+var __getOwnPropDesc$C = Object.getOwnPropertyDescriptor;
+var __decorateClass$C = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$C(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$B(target, key, result);
+    __defProp$C(target, key, result);
   return result;
 };
 let FlowCard = class extends FlowRdfElement {
@@ -6558,11 +6555,11 @@ let FlowCard = class extends FlowRdfElement {
     `;
   }
 };
-FlowCard.styles = styles$A;
-FlowCard = __decorateClass$B([
+FlowCard.styles = styles$B;
+FlowCard = __decorateClass$C([
   e$6("flow-ui-card")
 ], FlowCard);
-const styles$z = i$7`
+const styles$A = i$7`
   ${componentStyles}
 
   :host {
@@ -6585,15 +6582,15 @@ const styles$z = i$7`
     object-fit: cover;
   }
 `;
-var __defProp$A = Object.defineProperty;
-var __getOwnPropDesc$A = Object.getOwnPropertyDescriptor;
-var __decorateClass$A = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$A(target, key) : target;
+var __defProp$B = Object.defineProperty;
+var __getOwnPropDesc$B = Object.getOwnPropertyDescriptor;
+var __decorateClass$B = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$B(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$A(target, key, result);
+    __defProp$B(target, key, result);
   return result;
 };
 let FlowCarouselItem = class extends FlowRdfElement {
@@ -6608,8 +6605,8 @@ let FlowCarouselItem = class extends FlowRdfElement {
     return x$1` <slot></slot> `;
   }
 };
-FlowCarouselItem.styles = styles$z;
-FlowCarouselItem = __decorateClass$A([
+FlowCarouselItem.styles = styles$A;
+FlowCarouselItem = __decorateClass$B([
   e$6("flow-ui-carousel-item")
 ], FlowCarouselItem);
 /**
@@ -6699,7 +6696,7 @@ class AutoplayController {
     this.host.requestUpdate();
   }
 }
-const styles$y = i$7`
+const styles$z = i$7`
   ${componentStyles}
 
   :host {
@@ -6868,15 +6865,15 @@ const debounce = (delay) => {
     };
   };
 };
-var __defProp$z = Object.defineProperty;
-var __getOwnPropDesc$z = Object.getOwnPropertyDescriptor;
-var __decorateClass$z = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$z(target, key) : target;
+var __defProp$A = Object.defineProperty;
+var __getOwnPropDesc$A = Object.getOwnPropertyDescriptor;
+var __decorateClass$A = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$A(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$z(target, key, result);
+    __defProp$A(target, key, result);
   return result;
 };
 class ScrollController {
@@ -7007,18 +7004,18 @@ class ScrollController {
     host.requestUpdate();
   }
 }
-__decorateClass$z([
+__decorateClass$A([
   debounce(100)
 ], ScrollController.prototype, "handleScrollEnd", 1);
-var __defProp$y = Object.defineProperty;
-var __getOwnPropDesc$y = Object.getOwnPropertyDescriptor;
-var __decorateClass$y = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$y(target, key) : target;
+var __defProp$z = Object.defineProperty;
+var __getOwnPropDesc$z = Object.getOwnPropertyDescriptor;
+var __decorateClass$z = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$z(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$y(target, key, result);
+    __defProp$z(target, key, result);
   return result;
 };
 let FlowCarousel = class extends FlowRdfElement {
@@ -7336,63 +7333,63 @@ let FlowCarousel = class extends FlowRdfElement {
     `;
   }
 };
-FlowCarousel.styles = styles$y;
-__decorateClass$y([
+FlowCarousel.styles = styles$z;
+__decorateClass$z([
   n$5({ type: Boolean, reflect: true })
 ], FlowCarousel.prototype, "loop", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Boolean, reflect: true })
 ], FlowCarousel.prototype, "navigation", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Boolean, reflect: true })
 ], FlowCarousel.prototype, "pagination", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Boolean, reflect: true })
 ], FlowCarousel.prototype, "autoplay", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Number, attribute: "autoplay-interval" })
 ], FlowCarousel.prototype, "autoplayInterval", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Number, attribute: "slides-per-page" })
 ], FlowCarousel.prototype, "slidesPerPage", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Number, attribute: "slides-per-move" })
 ], FlowCarousel.prototype, "slidesPerMove", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5()
 ], FlowCarousel.prototype, "orientation", 2);
-__decorateClass$y([
+__decorateClass$z([
   n$5({ type: Boolean, reflect: true, attribute: "mouse-dragging" })
 ], FlowCarousel.prototype, "mouseDragging", 2);
-__decorateClass$y([
+__decorateClass$z([
   i$4("slot:not([name])")
 ], FlowCarousel.prototype, "defaultSlot", 2);
-__decorateClass$y([
+__decorateClass$z([
   i$4(".carousel__slides")
 ], FlowCarousel.prototype, "scrollContainer", 2);
-__decorateClass$y([
+__decorateClass$z([
   i$4(".carousel__pagination")
 ], FlowCarousel.prototype, "paginationContainer", 2);
-__decorateClass$y([
+__decorateClass$z([
   t$2()
 ], FlowCarousel.prototype, "activeSlide", 2);
-__decorateClass$y([
+__decorateClass$z([
   watch("loop", { waitUntilFirstUpdate: true }),
   watch("slidesPerPage", { waitUntilFirstUpdate: true })
 ], FlowCarousel.prototype, "initializeSlides", 1);
-__decorateClass$y([
+__decorateClass$z([
   watch("activeSlide")
 ], FlowCarousel.prototype, "handelSlideChange", 1);
-__decorateClass$y([
+__decorateClass$z([
   watch("slidesPerMove")
 ], FlowCarousel.prototype, "handleSlidesPerMoveChange", 1);
-__decorateClass$y([
+__decorateClass$z([
   watch("autoplay")
 ], FlowCarousel.prototype, "handleAutoplayChange", 1);
-__decorateClass$y([
+__decorateClass$z([
   watch("mouseDragging")
 ], FlowCarousel.prototype, "handleMouseDraggingChange", 1);
-FlowCarousel = __decorateClass$y([
+FlowCarousel = __decorateClass$z([
   e$6("flow-ui-carousel")
 ], FlowCarousel);
 /**
@@ -7448,7 +7445,7 @@ const defaultValue = (propertyName = "value") => (proto, key) => {
     attributeChangedCallback.call(this, name, old, value);
   };
 };
-const styles$x = i$7`
+const styles$y = i$7`
   ${componentStyles}
 
   :host {
@@ -7564,15 +7561,15 @@ const styles$x = i$7`
     margin-inline-start: var(--flow-ui-input-required-content-offset);
   }
 `;
-var __defProp$x = Object.defineProperty;
-var __getOwnPropDesc$x = Object.getOwnPropertyDescriptor;
-var __decorateClass$x = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$x(target, key) : target;
+var __defProp$y = Object.defineProperty;
+var __getOwnPropDesc$y = Object.getOwnPropertyDescriptor;
+var __decorateClass$y = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$y(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$x(target, key, result);
+    __defProp$y(target, key, result);
   return result;
 };
 let FlowCheckbox = class extends FlowRdfElement {
@@ -7722,50 +7719,50 @@ let FlowCheckbox = class extends FlowRdfElement {
     `;
   }
 };
-FlowCheckbox.styles = styles$x;
-__decorateClass$x([
+FlowCheckbox.styles = styles$y;
+__decorateClass$y([
   i$4('input[type="checkbox"]')
 ], FlowCheckbox.prototype, "input", 2);
-__decorateClass$x([
+__decorateClass$y([
   t$2()
 ], FlowCheckbox.prototype, "hasFocus", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5()
 ], FlowCheckbox.prototype, "title", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5()
 ], FlowCheckbox.prototype, "name", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5()
 ], FlowCheckbox.prototype, "value", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5({ reflect: true })
 ], FlowCheckbox.prototype, "size", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5({ type: Boolean, reflect: true })
 ], FlowCheckbox.prototype, "disabled", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5({ type: Boolean, reflect: true })
 ], FlowCheckbox.prototype, "checked", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5({ type: Boolean, reflect: true })
 ], FlowCheckbox.prototype, "indeterminate", 2);
-__decorateClass$x([
+__decorateClass$y([
   defaultValue("checked")
 ], FlowCheckbox.prototype, "defaultChecked", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5({ reflect: true })
 ], FlowCheckbox.prototype, "form", 2);
-__decorateClass$x([
+__decorateClass$y([
   n$5({ type: Boolean, reflect: true })
 ], FlowCheckbox.prototype, "required", 2);
-__decorateClass$x([
+__decorateClass$y([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowCheckbox.prototype, "handleDisabledChange", 1);
-__decorateClass$x([
+__decorateClass$y([
   watch(["checked", "indeterminate"], { waitUntilFirstUpdate: true })
 ], FlowCheckbox.prototype, "handleStateChange", 1);
-FlowCheckbox = __decorateClass$x([
+FlowCheckbox = __decorateClass$y([
   e$6("flow-ui-checkbox")
 ], FlowCheckbox);
 function bound01(n2, max2) {
@@ -8762,7 +8759,7 @@ function getTabbableBoundary(root) {
   const end = allElements.reverse().find((el) => isTabbable(el)) ?? null;
   return { start, end };
 }
-const styles$w = i$7`
+const styles$x = i$7`
   ${componentStyles}
 
   :host {
@@ -8813,15 +8810,15 @@ const styles$w = i$7`
     max-height: var(--auto-size-available-height) !important;
   }
 `;
-var __defProp$w = Object.defineProperty;
-var __getOwnPropDesc$w = Object.getOwnPropertyDescriptor;
-var __decorateClass$w = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$w(target, key) : target;
+var __defProp$x = Object.defineProperty;
+var __getOwnPropDesc$x = Object.getOwnPropertyDescriptor;
+var __decorateClass$x = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$x(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$w(target, key, result);
+    __defProp$x(target, key, result);
   return result;
 };
 let FlowDropdown = class extends FlowRdfElement {
@@ -9087,44 +9084,44 @@ let FlowDropdown = class extends FlowRdfElement {
     `;
   }
 };
-FlowDropdown.styles = styles$w;
-__decorateClass$w([
+FlowDropdown.styles = styles$x;
+__decorateClass$x([
   i$4(".dropdown")
 ], FlowDropdown.prototype, "popup", 2);
-__decorateClass$w([
+__decorateClass$x([
   i$4(".dropdown__trigger")
 ], FlowDropdown.prototype, "trigger", 2);
-__decorateClass$w([
+__decorateClass$x([
   i$4(".dropdown__panel")
 ], FlowDropdown.prototype, "panel", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ type: Boolean, reflect: true })
 ], FlowDropdown.prototype, "open", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ reflect: true })
 ], FlowDropdown.prototype, "placement", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ type: Boolean, reflect: true })
 ], FlowDropdown.prototype, "disabled", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ attribute: "stay-open-on-select", type: Boolean, reflect: true })
 ], FlowDropdown.prototype, "stayOpenOnSelect", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ attribute: false })
 ], FlowDropdown.prototype, "containingElement", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ type: Number })
 ], FlowDropdown.prototype, "distance", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ type: Number })
 ], FlowDropdown.prototype, "skidding", 2);
-__decorateClass$w([
+__decorateClass$x([
   n$5({ type: Boolean })
 ], FlowDropdown.prototype, "hoist", 2);
-__decorateClass$w([
+__decorateClass$x([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowDropdown.prototype, "handleOpenChange", 1);
-FlowDropdown = __decorateClass$w([
+FlowDropdown = __decorateClass$x([
   e$6("flow-ui-dropdown")
 ], FlowDropdown);
 setDefaultAnimation("dropdown.show", {
@@ -9198,7 +9195,7 @@ const formControlStyles = i$7`
     margin-top: var(--flow-ui-spacing-2x-small);
   }
 `;
-const styles$v = i$7`
+const styles$w = i$7`
   ${componentStyles}
   ${formControlStyles}
 
@@ -9488,15 +9485,15 @@ const styles$v = i$7`
     -moz-appearance: textfield;
   }
 `;
-var __defProp$v = Object.defineProperty;
-var __getOwnPropDesc$v = Object.getOwnPropertyDescriptor;
-var __decorateClass$v = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$v(target, key) : target;
+var __defProp$w = Object.defineProperty;
+var __getOwnPropDesc$w = Object.getOwnPropertyDescriptor;
+var __decorateClass$w = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$w(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$v(target, key, result);
+    __defProp$w(target, key, result);
   return result;
 };
 let FlowInput = class extends FlowRdfElement {
@@ -9818,104 +9815,104 @@ let FlowInput = class extends FlowRdfElement {
     `;
   }
 };
-FlowInput.styles = styles$v;
-__decorateClass$v([
+FlowInput.styles = styles$w;
+__decorateClass$w([
   i$4(".input__control")
 ], FlowInput.prototype, "input", 2);
-__decorateClass$v([
+__decorateClass$w([
   t$2()
 ], FlowInput.prototype, "hasFocus", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "title", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ reflect: true })
 ], FlowInput.prototype, "type", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "name", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "value", 2);
-__decorateClass$v([
+__decorateClass$w([
   defaultValue()
 ], FlowInput.prototype, "defaultValue", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ reflect: true })
 ], FlowInput.prototype, "size", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean, reflect: true })
 ], FlowInput.prototype, "filled", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean, reflect: true })
 ], FlowInput.prototype, "pill", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "label", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ attribute: "help-text" })
 ], FlowInput.prototype, "helpText", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean })
 ], FlowInput.prototype, "clearable", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean, reflect: true })
 ], FlowInput.prototype, "disabled", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "placeholder", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean, reflect: true })
 ], FlowInput.prototype, "readonly", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ attribute: "password-toggle", type: Boolean })
 ], FlowInput.prototype, "passwordToggle", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ attribute: "password-visible", type: Boolean })
 ], FlowInput.prototype, "passwordVisible", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ attribute: "no-spin-buttons", type: Boolean })
 ], FlowInput.prototype, "noSpinButtons", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ reflect: true })
 ], FlowInput.prototype, "form", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean, reflect: true })
 ], FlowInput.prototype, "required", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "pattern", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Number })
 ], FlowInput.prototype, "minlength", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Number })
 ], FlowInput.prototype, "maxlength", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "min", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "max", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "step", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "autocapitalize", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "autocorrect", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "autocomplete", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({ type: Boolean })
 ], FlowInput.prototype, "autofocus", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "enterkeyhint", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5({
     type: Boolean,
     converter: {
@@ -9925,22 +9922,22 @@ __decorateClass$v([
     }
   })
 ], FlowInput.prototype, "spellcheck", 2);
-__decorateClass$v([
+__decorateClass$w([
   n$5()
 ], FlowInput.prototype, "inputmode", 2);
-__decorateClass$v([
+__decorateClass$w([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowInput.prototype, "handleDisabledChange", 1);
-__decorateClass$v([
+__decorateClass$w([
   watch("step", { waitUntilFirstUpdate: true })
 ], FlowInput.prototype, "handleStepChange", 1);
-__decorateClass$v([
+__decorateClass$w([
   watch("value", { waitUntilFirstUpdate: true })
 ], FlowInput.prototype, "handleValueChange", 1);
-FlowInput = __decorateClass$v([
+FlowInput = __decorateClass$w([
   e$6("flow-ui-input")
 ], FlowInput);
-const styles$u = i$7`
+const styles$v = i$7`
   ${componentStyles}
 
   :host(:not(:focus-within)) {
@@ -9955,15 +9952,15 @@ const styles$u = i$7`
     padding: 0 !important;
   }
 `;
-var __defProp$u = Object.defineProperty;
-var __getOwnPropDesc$u = Object.getOwnPropertyDescriptor;
-var __decorateClass$u = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$u(target, key) : target;
+var __defProp$v = Object.defineProperty;
+var __getOwnPropDesc$v = Object.getOwnPropertyDescriptor;
+var __decorateClass$v = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$v(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$u(target, key, result);
+    __defProp$v(target, key, result);
   return result;
 };
 let FlowVisuallyHidden = class extends FlowRdfElement {
@@ -9971,11 +9968,11 @@ let FlowVisuallyHidden = class extends FlowRdfElement {
     return x$1` <slot></slot> `;
   }
 };
-FlowVisuallyHidden.styles = styles$u;
-FlowVisuallyHidden = __decorateClass$u([
+FlowVisuallyHidden.styles = styles$v;
+FlowVisuallyHidden = __decorateClass$v([
   e$6("flow-ui-visually-hidden")
 ], FlowVisuallyHidden);
-const styles$t = i$7`
+const styles$u = i$7`
   ${componentStyles}
 
   :host {
@@ -10307,15 +10304,15 @@ const styles$t = i$7`
     cursor: not-allowed;
   }
 `;
-var __defProp$t = Object.defineProperty;
-var __getOwnPropDesc$t = Object.getOwnPropertyDescriptor;
-var __decorateClass$t = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$t(target, key) : target;
+var __defProp$u = Object.defineProperty;
+var __getOwnPropDesc$u = Object.getOwnPropertyDescriptor;
+var __decorateClass$u = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$u(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$t(target, key, result);
+    __defProp$u(target, key, result);
   return result;
 };
 const hasEyeDropper = "EyeDropper" in window;
@@ -11100,113 +11097,113 @@ let FlowColorPicker = class extends FlowRdfElement {
     `;
   }
 };
-FlowColorPicker.styles = styles$t;
-__decorateClass$t([
+FlowColorPicker.styles = styles$u;
+__decorateClass$u([
   i$4('[part~="base"]')
 ], FlowColorPicker.prototype, "base", 2);
-__decorateClass$t([
+__decorateClass$u([
   i$4('[part~="input"]')
 ], FlowColorPicker.prototype, "input", 2);
-__decorateClass$t([
+__decorateClass$u([
   i$4(".color-dropdown")
 ], FlowColorPicker.prototype, "dropdown", 2);
-__decorateClass$t([
+__decorateClass$u([
   i$4('[part~="preview"]')
 ], FlowColorPicker.prototype, "previewButton", 2);
-__decorateClass$t([
+__decorateClass$u([
   i$4('[part~="trigger"]')
 ], FlowColorPicker.prototype, "trigger", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "hasFocus", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "isDraggingGridHandle", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "isEmpty", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "inputValue", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "hue", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "saturation", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "brightness", 2);
-__decorateClass$t([
+__decorateClass$u([
   t$2()
 ], FlowColorPicker.prototype, "alpha", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5()
 ], FlowColorPicker.prototype, "value", 2);
-__decorateClass$t([
+__decorateClass$u([
   defaultValue()
 ], FlowColorPicker.prototype, "defaultValue", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5()
 ], FlowColorPicker.prototype, "label", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5()
 ], FlowColorPicker.prototype, "format", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Boolean, reflect: true })
 ], FlowColorPicker.prototype, "inline", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ reflect: true })
 ], FlowColorPicker.prototype, "size", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ attribute: "no-format-toggle", type: Boolean })
 ], FlowColorPicker.prototype, "noFormatToggle", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5()
 ], FlowColorPicker.prototype, "name", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Boolean, reflect: true })
 ], FlowColorPicker.prototype, "disabled", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ reflect: true })
 ], FlowColorPicker.prototype, "placement", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Number })
 ], FlowColorPicker.prototype, "distance", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Number })
 ], FlowColorPicker.prototype, "skidding", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Boolean })
 ], FlowColorPicker.prototype, "hoist", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Boolean })
 ], FlowColorPicker.prototype, "opacity", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Boolean })
 ], FlowColorPicker.prototype, "uppercase", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5()
 ], FlowColorPicker.prototype, "swatches", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ reflect: true })
 ], FlowColorPicker.prototype, "form", 2);
-__decorateClass$t([
+__decorateClass$u([
   n$5({ type: Boolean, reflect: true })
 ], FlowColorPicker.prototype, "required", 2);
-__decorateClass$t([
+__decorateClass$u([
   watch("format", { waitUntilFirstUpdate: true })
 ], FlowColorPicker.prototype, "handleFormatChange", 1);
-__decorateClass$t([
+__decorateClass$u([
   watch("opacity", { waitUntilFirstUpdate: true })
 ], FlowColorPicker.prototype, "handleOpacityChange", 1);
-__decorateClass$t([
+__decorateClass$u([
   watch("value")
 ], FlowColorPicker.prototype, "handleValueChange", 1);
-FlowColorPicker = __decorateClass$t([
+FlowColorPicker = __decorateClass$u([
   e$6("flow-ui-color-picker")
 ], FlowColorPicker);
-const styles$s = i$7`
+const styles$t = i$7`
   ${componentStyles}
 
   :host {
@@ -11286,15 +11283,15 @@ const styles$s = i$7`
     padding: var(--flow-ui-spacing-medium);
   }
 `;
-var __defProp$s = Object.defineProperty;
-var __getOwnPropDesc$s = Object.getOwnPropertyDescriptor;
-var __decorateClass$s = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$s(target, key) : target;
+var __defProp$t = Object.defineProperty;
+var __getOwnPropDesc$t = Object.getOwnPropertyDescriptor;
+var __decorateClass$t = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$t(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$s(target, key, result);
+    __defProp$t(target, key, result);
   return result;
 };
 let FlowDetails = class extends FlowRdfElement {
@@ -11422,32 +11419,32 @@ let FlowDetails = class extends FlowRdfElement {
     `;
   }
 };
-FlowDetails.styles = styles$s;
-__decorateClass$s([
+FlowDetails.styles = styles$t;
+__decorateClass$t([
   i$4(".details")
 ], FlowDetails.prototype, "details", 2);
-__decorateClass$s([
+__decorateClass$t([
   i$4(".details__header")
 ], FlowDetails.prototype, "header", 2);
-__decorateClass$s([
+__decorateClass$t([
   i$4(".details__body")
 ], FlowDetails.prototype, "body", 2);
-__decorateClass$s([
+__decorateClass$t([
   i$4(".details__expand-icon-slot")
 ], FlowDetails.prototype, "expandIconSlot", 2);
-__decorateClass$s([
+__decorateClass$t([
   n$5({ type: Boolean, reflect: true })
 ], FlowDetails.prototype, "open", 2);
-__decorateClass$s([
+__decorateClass$t([
   n$5()
 ], FlowDetails.prototype, "summary", 2);
-__decorateClass$s([
+__decorateClass$t([
   n$5({ type: Boolean, reflect: true })
 ], FlowDetails.prototype, "disabled", 2);
-__decorateClass$s([
+__decorateClass$t([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowDetails.prototype, "handleOpenChange", 1);
-FlowDetails = __decorateClass$s([
+FlowDetails = __decorateClass$t([
   e$6("flow-ui-details")
 ], FlowDetails);
 setDefaultAnimation("details.show", {
@@ -11561,7 +11558,7 @@ function scrollIntoView(element, container, direction = "vertical", behavior = "
     }
   }
 }
-const styles$r = i$7`
+const styles$s = i$7`
   ${componentStyles}
 
   :host {
@@ -11681,15 +11678,15 @@ const styles$r = i$7`
     }
   }
 `;
-var __defProp$r = Object.defineProperty;
-var __getOwnPropDesc$r = Object.getOwnPropertyDescriptor;
-var __decorateClass$r = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$r(target, key) : target;
+var __defProp$s = Object.defineProperty;
+var __getOwnPropDesc$s = Object.getOwnPropertyDescriptor;
+var __decorateClass$s = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$s(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$r(target, key, result);
+    __defProp$s(target, key, result);
   return result;
 };
 let FlowDialog = class extends FlowRdfElement {
@@ -11869,29 +11866,29 @@ let FlowDialog = class extends FlowRdfElement {
     `;
   }
 };
-FlowDialog.styles = styles$r;
-__decorateClass$r([
+FlowDialog.styles = styles$s;
+__decorateClass$s([
   i$4(".dialog")
 ], FlowDialog.prototype, "dialog", 2);
-__decorateClass$r([
+__decorateClass$s([
   i$4(".dialog__panel")
 ], FlowDialog.prototype, "panel", 2);
-__decorateClass$r([
+__decorateClass$s([
   i$4(".dialog__overlay")
 ], FlowDialog.prototype, "overlay", 2);
-__decorateClass$r([
+__decorateClass$s([
   n$5({ type: Boolean, reflect: true })
 ], FlowDialog.prototype, "open", 2);
-__decorateClass$r([
+__decorateClass$s([
   n$5({ reflect: true })
 ], FlowDialog.prototype, "label", 2);
-__decorateClass$r([
+__decorateClass$s([
   n$5({ attribute: "no-header", type: Boolean, reflect: true })
 ], FlowDialog.prototype, "noHeader", 2);
-__decorateClass$r([
+__decorateClass$s([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowDialog.prototype, "handleOpenChange", 1);
-FlowDialog = __decorateClass$r([
+FlowDialog = __decorateClass$s([
   e$6("flow-ui-dialog")
 ], FlowDialog);
 setDefaultAnimation("dialog.show", {
@@ -11920,7 +11917,7 @@ setDefaultAnimation("dialog.overlay.hide", {
   keyframes: [{ opacity: 1 }, { opacity: 0 }],
   options: { duration: 250 }
 });
-const styles$q = i$7`
+const styles$r = i$7`
   ${componentStyles}
 
   :host {
@@ -11949,15 +11946,15 @@ const styles$q = i$7`
     padding: var(--inset) 0;
   }
 `;
-var __defProp$q = Object.defineProperty;
-var __getOwnPropDesc$q = Object.getOwnPropertyDescriptor;
-var __decorateClass$q = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$q(target, key) : target;
+var __defProp$r = Object.defineProperty;
+var __getOwnPropDesc$r = Object.getOwnPropertyDescriptor;
+var __decorateClass$r = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$r(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$q(target, key, result);
+    __defProp$r(target, key, result);
   return result;
 };
 let FlowDivider = class extends FlowRdfElement {
@@ -11978,20 +11975,20 @@ let FlowDivider = class extends FlowRdfElement {
     }
   */
 };
-FlowDivider.styles = styles$q;
-__decorateClass$q([
+FlowDivider.styles = styles$r;
+__decorateClass$r([
   n$5({ type: Boolean, reflect: true })
 ], FlowDivider.prototype, "vertical", 2);
-__decorateClass$q([
+__decorateClass$r([
   watch("vertical")
 ], FlowDivider.prototype, "handleVerticalChange", 1);
-FlowDivider = __decorateClass$q([
+FlowDivider = __decorateClass$r([
   e$6("flow-ui-divider")
 ], FlowDivider);
 function uppercaseFirstLetter(string) {
   return string.charAt(0).toUpperCase() + string.slice(1);
 }
-const styles$p = i$7`
+const styles$q = i$7`
   ${componentStyles}
 
   :host {
@@ -12147,15 +12144,15 @@ const styles$p = i$7`
     }
   }
 `;
-var __defProp$p = Object.defineProperty;
-var __getOwnPropDesc$p = Object.getOwnPropertyDescriptor;
-var __decorateClass$p = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$p(target, key) : target;
+var __defProp$q = Object.defineProperty;
+var __getOwnPropDesc$q = Object.getOwnPropertyDescriptor;
+var __decorateClass$q = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$q(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$p(target, key, result);
+    __defProp$q(target, key, result);
   return result;
 };
 let FlowDrawer = class extends FlowRdfElement {
@@ -12365,38 +12362,38 @@ let FlowDrawer = class extends FlowRdfElement {
     `;
   }
 };
-FlowDrawer.styles = styles$p;
-__decorateClass$p([
+FlowDrawer.styles = styles$q;
+__decorateClass$q([
   i$4(".drawer")
 ], FlowDrawer.prototype, "drawer", 2);
-__decorateClass$p([
+__decorateClass$q([
   i$4(".drawer__panel")
 ], FlowDrawer.prototype, "panel", 2);
-__decorateClass$p([
+__decorateClass$q([
   i$4(".drawer__overlay")
 ], FlowDrawer.prototype, "overlay", 2);
-__decorateClass$p([
+__decorateClass$q([
   n$5({ type: Boolean, reflect: true })
 ], FlowDrawer.prototype, "open", 2);
-__decorateClass$p([
+__decorateClass$q([
   n$5({ reflect: true })
 ], FlowDrawer.prototype, "label", 2);
-__decorateClass$p([
+__decorateClass$q([
   n$5({ reflect: true })
 ], FlowDrawer.prototype, "placement", 2);
-__decorateClass$p([
+__decorateClass$q([
   n$5({ type: Boolean, reflect: true })
 ], FlowDrawer.prototype, "contained", 2);
-__decorateClass$p([
+__decorateClass$q([
   n$5({ attribute: "no-header", type: Boolean, reflect: true })
 ], FlowDrawer.prototype, "noHeader", 2);
-__decorateClass$p([
+__decorateClass$q([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowDrawer.prototype, "handleOpenChange", 1);
-__decorateClass$p([
+__decorateClass$q([
   watch("contained", { waitUntilFirstUpdate: true })
 ], FlowDrawer.prototype, "handleNoModalChange", 1);
-FlowDrawer = __decorateClass$p([
+FlowDrawer = __decorateClass$q([
   e$6("flow-ui-drawer")
 ], FlowDrawer);
 setDefaultAnimation("drawer.showTop", {
@@ -12483,7 +12480,8 @@ setDefaultAnimation("drawer.overlay.hide", {
   keyframes: [{ opacity: 1 }, { opacity: 0 }],
   options: { duration: 250 }
 });
-const styles$o = i$7`
+FlowIconButton.define("flow-ui-icon-button");
+const styles$p = i$7`
   ${componentStyles}
 
   :host {
@@ -12581,15 +12579,15 @@ const styles$o = i$7`
     }
   }
 `;
-var __defProp$o = Object.defineProperty;
-var __getOwnPropDesc$o = Object.getOwnPropertyDescriptor;
-var __decorateClass$o = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$o(target, key) : target;
+var __defProp$p = Object.defineProperty;
+var __getOwnPropDesc$p = Object.getOwnPropertyDescriptor;
+var __decorateClass$p = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$p(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$o(target, key, result);
+    __defProp$p(target, key, result);
   return result;
 };
 let FlowMenuItem = class extends FlowRdfElement {
@@ -12683,38 +12681,38 @@ let FlowMenuItem = class extends FlowRdfElement {
     `;
   }
 };
-FlowMenuItem.styles = styles$o;
-__decorateClass$o([
+FlowMenuItem.styles = styles$p;
+__decorateClass$p([
   i$4("slot:not([name])")
 ], FlowMenuItem.prototype, "defaultSlot", 2);
-__decorateClass$o([
+__decorateClass$p([
   i$4(".menu-item")
 ], FlowMenuItem.prototype, "menuItem", 2);
-__decorateClass$o([
+__decorateClass$p([
   n$5()
 ], FlowMenuItem.prototype, "type", 2);
-__decorateClass$o([
+__decorateClass$p([
   n$5({ type: Boolean, reflect: true })
 ], FlowMenuItem.prototype, "checked", 2);
-__decorateClass$o([
+__decorateClass$p([
   n$5()
 ], FlowMenuItem.prototype, "value", 2);
-__decorateClass$o([
+__decorateClass$p([
   n$5({ type: Boolean, reflect: true })
 ], FlowMenuItem.prototype, "disabled", 2);
-__decorateClass$o([
+__decorateClass$p([
   watch("checked")
 ], FlowMenuItem.prototype, "handleCheckedChange", 1);
-__decorateClass$o([
+__decorateClass$p([
   watch("disabled")
 ], FlowMenuItem.prototype, "handleDisabledChange", 1);
-__decorateClass$o([
+__decorateClass$p([
   watch("type")
 ], FlowMenuItem.prototype, "handleTypeChange", 1);
-FlowMenuItem = __decorateClass$o([
+FlowMenuItem = __decorateClass$p([
   e$6("flow-ui-menu-item")
 ], FlowMenuItem);
-const styles$n = i$7`
+const styles$o = i$7`
   ${componentStyles}
 
   :host {
@@ -12733,15 +12731,15 @@ const styles$n = i$7`
     user-select: none;
   }
 `;
-var __defProp$n = Object.defineProperty;
-var __getOwnPropDesc$n = Object.getOwnPropertyDescriptor;
-var __decorateClass$n = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$n(target, key) : target;
-  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
-    if (decorator = decorators[i3])
+var __defProp$o = Object.defineProperty;
+var __getOwnPropDesc$o = Object.getOwnPropertyDescriptor;
+var __decorateClass$o = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$o(target, key) : target;
+  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$n(target, key, result);
+    __defProp$o(target, key, result);
   return result;
 };
 let FlowMenuLabel = class extends FlowRdfElement {
@@ -12749,11 +12747,11 @@ let FlowMenuLabel = class extends FlowRdfElement {
     return x$1` <slot part="base" class="menu-label"></slot> `;
   }
 };
-FlowMenuLabel.styles = styles$n;
-FlowMenuLabel = __decorateClass$n([
+FlowMenuLabel.styles = styles$o;
+FlowMenuLabel = __decorateClass$o([
   e$6("flow-ui-menu-label")
 ], FlowMenuLabel);
-const styles$m = i$7`
+const styles$n = i$7`
   ${componentStyles}
 
   :host {
@@ -12771,15 +12769,15 @@ const styles$m = i$7`
     --spacing: var(--flow-ui-spacing-x-small);
   }
 `;
-var __defProp$m = Object.defineProperty;
-var __getOwnPropDesc$m = Object.getOwnPropertyDescriptor;
-var __decorateClass$m = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$m(target, key) : target;
+var __defProp$n = Object.defineProperty;
+var __getOwnPropDesc$n = Object.getOwnPropertyDescriptor;
+var __decorateClass$n = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$n(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$m(target, key, result);
+    __defProp$n(target, key, result);
   return result;
 };
 let FlowMenu = class extends FlowRdfElement {
@@ -12885,29 +12883,29 @@ let FlowMenu = class extends FlowRdfElement {
     `;
   }
 };
-FlowMenu.styles = styles$m;
-__decorateClass$m([
+FlowMenu.styles = styles$n;
+__decorateClass$n([
   i$4("slot")
 ], FlowMenu.prototype, "defaultSlot", 2);
-FlowMenu = __decorateClass$m([
+FlowMenu = __decorateClass$n([
   e$6("flow-ui-menu")
 ], FlowMenu);
-const styles$l = i$7`
+const styles$m = i$7`
   ${componentStyles}
 
   :host {
     display: contents;
   }
 `;
-var __defProp$l = Object.defineProperty;
-var __getOwnPropDesc$l = Object.getOwnPropertyDescriptor;
-var __decorateClass$l = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$l(target, key) : target;
+var __defProp$m = Object.defineProperty;
+var __getOwnPropDesc$m = Object.getOwnPropertyDescriptor;
+var __decorateClass$m = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$m(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$l(target, key, result);
+    __defProp$m(target, key, result);
   return result;
 };
 let FlowMutationObserver = class extends FlowRdfElement {
@@ -12969,39 +12967,39 @@ let FlowMutationObserver = class extends FlowRdfElement {
     return x$1` <slot></slot> `;
   }
 };
-FlowMutationObserver.styles = styles$l;
-__decorateClass$l([
+FlowMutationObserver.styles = styles$m;
+__decorateClass$m([
   n$5({ reflect: true })
 ], FlowMutationObserver.prototype, "attr", 2);
-__decorateClass$l([
+__decorateClass$m([
   n$5({ attribute: "attr-old-value", type: Boolean, reflect: true })
 ], FlowMutationObserver.prototype, "attrOldValue", 2);
-__decorateClass$l([
+__decorateClass$m([
   n$5({ attribute: "char-data", type: Boolean, reflect: true })
 ], FlowMutationObserver.prototype, "charData", 2);
-__decorateClass$l([
+__decorateClass$m([
   n$5({ attribute: "char-data-old-value", type: Boolean, reflect: true })
 ], FlowMutationObserver.prototype, "charDataOldValue", 2);
-__decorateClass$l([
+__decorateClass$m([
   n$5({ attribute: "child-list", type: Boolean, reflect: true })
 ], FlowMutationObserver.prototype, "childList", 2);
-__decorateClass$l([
+__decorateClass$m([
   n$5({ type: Boolean, reflect: true })
 ], FlowMutationObserver.prototype, "disabled", 2);
-__decorateClass$l([
+__decorateClass$m([
   watch("disabled")
 ], FlowMutationObserver.prototype, "handleDisabledChange", 1);
-__decorateClass$l([
+__decorateClass$m([
   watch("attr", { waitUntilFirstUpdate: true }),
   watch("attr-old-value", { waitUntilFirstUpdate: true }),
   watch("char-data", { waitUntilFirstUpdate: true }),
   watch("char-data-old-value", { waitUntilFirstUpdate: true }),
   watch("childList", { waitUntilFirstUpdate: true })
 ], FlowMutationObserver.prototype, "handleChange", 1);
-FlowMutationObserver = __decorateClass$l([
+FlowMutationObserver = __decorateClass$m([
   e$6("flow-ui-mutation-observer")
 ], FlowMutationObserver);
-const styles$k = i$7`
+const styles$l = i$7`
   ${componentStyles}
 
   :host {
@@ -13087,15 +13085,15 @@ const styles$k = i$7`
     }
   }
 `;
-var __defProp$k = Object.defineProperty;
-var __getOwnPropDesc$k = Object.getOwnPropertyDescriptor;
-var __decorateClass$k = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$k(target, key) : target;
+var __defProp$l = Object.defineProperty;
+var __getOwnPropDesc$l = Object.getOwnPropertyDescriptor;
+var __decorateClass$l = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$l(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$k(target, key, result);
+    __defProp$l(target, key, result);
   return result;
 };
 let FlowOption = class extends FlowRdfElement {
@@ -13171,38 +13169,38 @@ let FlowOption = class extends FlowRdfElement {
     `;
   }
 };
-FlowOption.styles = styles$k;
-__decorateClass$k([
+FlowOption.styles = styles$l;
+__decorateClass$l([
   i$4(".option__label")
 ], FlowOption.prototype, "defaultSlot", 2);
-__decorateClass$k([
+__decorateClass$l([
   t$2()
 ], FlowOption.prototype, "current", 2);
-__decorateClass$k([
+__decorateClass$l([
   t$2()
 ], FlowOption.prototype, "selected", 2);
-__decorateClass$k([
+__decorateClass$l([
   t$2()
 ], FlowOption.prototype, "hasHover", 2);
-__decorateClass$k([
+__decorateClass$l([
   n$5({ reflect: true })
 ], FlowOption.prototype, "value", 2);
-__decorateClass$k([
+__decorateClass$l([
   n$5({ type: Boolean, reflect: true })
 ], FlowOption.prototype, "disabled", 2);
-__decorateClass$k([
+__decorateClass$l([
   watch("disabled")
 ], FlowOption.prototype, "handleDisabledChange", 1);
-__decorateClass$k([
+__decorateClass$l([
   watch("selected")
 ], FlowOption.prototype, "handleSelectedChange", 1);
-__decorateClass$k([
+__decorateClass$l([
   watch("value")
 ], FlowOption.prototype, "handleValueChange", 1);
-FlowOption = __decorateClass$k([
+FlowOption = __decorateClass$l([
   e$6("flow-ui-option")
 ], FlowOption);
-const styles$j = i$7`
+const styles$k = i$7`
   ${componentStyles}
 
   :host {
@@ -13284,15 +13282,15 @@ const styles$j = i$7`
     }
   }
 `;
-var __defProp$j = Object.defineProperty;
-var __getOwnPropDesc$j = Object.getOwnPropertyDescriptor;
-var __decorateClass$j = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$j(target, key) : target;
+var __defProp$k = Object.defineProperty;
+var __getOwnPropDesc$k = Object.getOwnPropertyDescriptor;
+var __decorateClass$k = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$k(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$j(target, key, result);
+    __defProp$k(target, key, result);
   return result;
 };
 let FlowProgressBar = class extends FlowRdfElement {
@@ -13326,20 +13324,20 @@ let FlowProgressBar = class extends FlowRdfElement {
     `;
   }
 };
-FlowProgressBar.styles = styles$j;
-__decorateClass$j([
+FlowProgressBar.styles = styles$k;
+__decorateClass$k([
   n$5({ type: Number, reflect: true })
 ], FlowProgressBar.prototype, "value", 2);
-__decorateClass$j([
+__decorateClass$k([
   n$5({ type: Boolean, reflect: true })
 ], FlowProgressBar.prototype, "indeterminate", 2);
-__decorateClass$j([
+__decorateClass$k([
   n$5()
 ], FlowProgressBar.prototype, "label", 2);
-FlowProgressBar = __decorateClass$j([
+FlowProgressBar = __decorateClass$k([
   e$6("flow-ui-progress-bar")
 ], FlowProgressBar);
-const styles$i = i$7`
+const styles$j = i$7`
   ${componentStyles}
 
   :host {
@@ -13406,15 +13404,15 @@ const styles$i = i$7`
     user-select: none;
   }
 `;
-var __defProp$i = Object.defineProperty;
-var __getOwnPropDesc$i = Object.getOwnPropertyDescriptor;
-var __decorateClass$i = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$i(target, key) : target;
+var __defProp$j = Object.defineProperty;
+var __getOwnPropDesc$j = Object.getOwnPropertyDescriptor;
+var __decorateClass$j = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$j(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$i(target, key, result);
+    __defProp$j(target, key, result);
   return result;
 };
 let FlowProgressRing = class extends FlowRdfElement {
@@ -13456,23 +13454,23 @@ let FlowProgressRing = class extends FlowRdfElement {
     `;
   }
 };
-FlowProgressRing.styles = styles$i;
-__decorateClass$i([
+FlowProgressRing.styles = styles$j;
+__decorateClass$j([
   i$4(".progress-ring__indicator")
 ], FlowProgressRing.prototype, "indicator", 2);
-__decorateClass$i([
+__decorateClass$j([
   t$2()
 ], FlowProgressRing.prototype, "indicatorOffset", 2);
-__decorateClass$i([
+__decorateClass$j([
   n$5({ type: Number, reflect: true })
 ], FlowProgressRing.prototype, "value", 2);
-__decorateClass$i([
+__decorateClass$j([
   n$5()
 ], FlowProgressRing.prototype, "label", 2);
-FlowProgressRing = __decorateClass$i([
+FlowProgressRing = __decorateClass$j([
   e$6("flow-ui-progress-ring")
 ], FlowProgressRing);
-const styles$h = i$7`
+const styles$i = i$7`
   ${componentStyles}
   ${formControlStyles}
 
@@ -13507,15 +13505,15 @@ const styles$h = i$7`
     border: 0;
   }
 `;
-var __defProp$h = Object.defineProperty;
-var __getOwnPropDesc$h = Object.getOwnPropertyDescriptor;
-var __decorateClass$h = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$h(target, key) : target;
+var __defProp$i = Object.defineProperty;
+var __getOwnPropDesc$i = Object.getOwnPropertyDescriptor;
+var __decorateClass$i = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$i(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$h(target, key, result);
+    __defProp$i(target, key, result);
   return result;
 };
 let FlowRadioGroup = class extends FlowRdfElement {
@@ -13754,53 +13752,53 @@ let FlowRadioGroup = class extends FlowRdfElement {
     `;
   }
 };
-FlowRadioGroup.styles = styles$h;
-__decorateClass$h([
+FlowRadioGroup.styles = styles$i;
+__decorateClass$i([
   i$4("slot:not([name])")
 ], FlowRadioGroup.prototype, "defaultSlot", 2);
-__decorateClass$h([
+__decorateClass$i([
   i$4(".radio-group__validation-input")
 ], FlowRadioGroup.prototype, "validationInput", 2);
-__decorateClass$h([
+__decorateClass$i([
   t$2()
 ], FlowRadioGroup.prototype, "errorMessage", 2);
-__decorateClass$h([
+__decorateClass$i([
   t$2()
 ], FlowRadioGroup.prototype, "defaultValue", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5()
 ], FlowRadioGroup.prototype, "label", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5({ attribute: "help-text" })
 ], FlowRadioGroup.prototype, "helpText", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5()
 ], FlowRadioGroup.prototype, "name", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5({ reflect: true })
 ], FlowRadioGroup.prototype, "value", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5({ reflect: true })
 ], FlowRadioGroup.prototype, "size", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5({ reflect: true })
 ], FlowRadioGroup.prototype, "form", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5({ type: Boolean, reflect: true })
 ], FlowRadioGroup.prototype, "required", 2);
-__decorateClass$h([
+__decorateClass$i([
   n$5({ type: Boolean, reflect: true })
 ], FlowRadioGroup.prototype, "vertical", 2);
-__decorateClass$h([
+__decorateClass$i([
   watch("size", { waitUntilFirstUpdate: true })
 ], FlowRadioGroup.prototype, "handleSizeChange", 1);
-__decorateClass$h([
+__decorateClass$i([
   watch("value")
 ], FlowRadioGroup.prototype, "handleValueChange", 1);
-FlowRadioGroup = __decorateClass$h([
+FlowRadioGroup = __decorateClass$i([
   e$6("flow-ui-radio-group")
 ], FlowRadioGroup);
-const styles$g = i$7`
+const styles$h = i$7`
   ${componentStyles}
 
   :host {
@@ -13911,15 +13909,15 @@ const styles$g = i$7`
     user-select: none;
   }
 `;
-var __defProp$g = Object.defineProperty;
-var __getOwnPropDesc$g = Object.getOwnPropertyDescriptor;
-var __decorateClass$g = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key) : target;
+var __defProp$h = Object.defineProperty;
+var __getOwnPropDesc$h = Object.getOwnPropertyDescriptor;
+var __decorateClass$h = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$h(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$g(target, key, result);
+    __defProp$h(target, key, result);
   return result;
 };
 let FlowRadio = class extends FlowRdfElement {
@@ -13999,32 +13997,32 @@ let FlowRadio = class extends FlowRdfElement {
     `;
   }
 };
-FlowRadio.styles = styles$g;
-__decorateClass$g([
+FlowRadio.styles = styles$h;
+__decorateClass$h([
   t$2()
 ], FlowRadio.prototype, "checked", 2);
-__decorateClass$g([
+__decorateClass$h([
   t$2()
 ], FlowRadio.prototype, "hasFocus", 2);
-__decorateClass$g([
+__decorateClass$h([
   n$5()
 ], FlowRadio.prototype, "value", 2);
-__decorateClass$g([
+__decorateClass$h([
   n$5({ reflect: true })
 ], FlowRadio.prototype, "size", 2);
-__decorateClass$g([
+__decorateClass$h([
   n$5({ type: Boolean, reflect: true })
 ], FlowRadio.prototype, "disabled", 2);
-__decorateClass$g([
+__decorateClass$h([
   watch("checked")
 ], FlowRadio.prototype, "handleCheckedChange", 1);
-__decorateClass$g([
+__decorateClass$h([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowRadio.prototype, "handleDisabledChange", 1);
-FlowRadio = __decorateClass$g([
+FlowRadio = __decorateClass$h([
   e$6("flow-ui-radio")
 ], FlowRadio);
-const styles$f = i$7`
+const styles$g = i$7`
   ${componentStyles}
   ${formControlStyles}
 
@@ -14251,15 +14249,15 @@ const styles$f = i$7`
     }
   }
 `;
-var __defProp$f = Object.defineProperty;
-var __getOwnPropDesc$f = Object.getOwnPropertyDescriptor;
-var __decorateClass$f = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target;
+var __defProp$g = Object.defineProperty;
+var __getOwnPropDesc$g = Object.getOwnPropertyDescriptor;
+var __decorateClass$g = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$f(target, key, result);
+    __defProp$g(target, key, result);
   return result;
 };
 let FlowRange = class extends FlowRdfElement {
@@ -14494,89 +14492,89 @@ let FlowRange = class extends FlowRdfElement {
     `;
   }
 };
-FlowRange.styles = styles$f;
-__decorateClass$f([
+FlowRange.styles = styles$g;
+__decorateClass$g([
   i$4(".range__control")
 ], FlowRange.prototype, "input", 2);
-__decorateClass$f([
+__decorateClass$g([
   i$4(".range__tooltip")
 ], FlowRange.prototype, "output", 2);
-__decorateClass$f([
+__decorateClass$g([
   t$2()
 ], FlowRange.prototype, "hasFocus", 2);
-__decorateClass$f([
+__decorateClass$g([
   t$2()
 ], FlowRange.prototype, "hasTooltip", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5()
 ], FlowRange.prototype, "title", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5()
 ], FlowRange.prototype, "name", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ type: Number })
 ], FlowRange.prototype, "value", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5()
 ], FlowRange.prototype, "label", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ attribute: "help-text" })
 ], FlowRange.prototype, "helpText", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ type: Boolean, reflect: true })
 ], FlowRange.prototype, "disabled", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ type: Number })
 ], FlowRange.prototype, "min", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ type: Number })
 ], FlowRange.prototype, "max", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ type: Number })
 ], FlowRange.prototype, "step", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5()
 ], FlowRange.prototype, "tooltip", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ attribute: false })
 ], FlowRange.prototype, "tooltipFormatter", 2);
-__decorateClass$f([
+__decorateClass$g([
   n$5({ reflect: true })
 ], FlowRange.prototype, "form", 2);
-__decorateClass$f([
+__decorateClass$g([
   defaultValue()
 ], FlowRange.prototype, "defaultValue", 2);
-__decorateClass$f([
+__decorateClass$g([
   e$4({ passive: true })
 ], FlowRange.prototype, "handleThumbDragStart", 1);
-__decorateClass$f([
+__decorateClass$g([
   watch("value", { waitUntilFirstUpdate: true })
 ], FlowRange.prototype, "handleValueChange", 1);
-__decorateClass$f([
+__decorateClass$g([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowRange.prototype, "handleDisabledChange", 1);
-__decorateClass$f([
+__decorateClass$g([
   watch("hasTooltip", { waitUntilFirstUpdate: true })
 ], FlowRange.prototype, "syncRange", 1);
-FlowRange = __decorateClass$f([
+FlowRange = __decorateClass$g([
   e$6("flow-ui-range")
 ], FlowRange);
-const styles$e = i$7`
+const styles$f = i$7`
   ${componentStyles}
 
   :host {
     display: contents;
   }
 `;
-var __defProp$e = Object.defineProperty;
-var __getOwnPropDesc$e = Object.getOwnPropertyDescriptor;
-var __decorateClass$e = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target;
+var __defProp$f = Object.defineProperty;
+var __getOwnPropDesc$f = Object.getOwnPropertyDescriptor;
+var __decorateClass$f = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$e(target, key, result);
+    __defProp$f(target, key, result);
   return result;
 };
 let FlowResizeObserver = class extends FlowRdfElement {
@@ -14629,17 +14627,17 @@ let FlowResizeObserver = class extends FlowRdfElement {
     return x$1` <slot @slotchange=${this.handleSlotChange}></slot> `;
   }
 };
-FlowResizeObserver.styles = styles$e;
-__decorateClass$e([
+FlowResizeObserver.styles = styles$f;
+__decorateClass$f([
   n$5({ type: Boolean, reflect: true })
 ], FlowResizeObserver.prototype, "disabled", 2);
-__decorateClass$e([
+__decorateClass$f([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowResizeObserver.prototype, "handleDisabledChange", 1);
-FlowResizeObserver = __decorateClass$e([
+FlowResizeObserver = __decorateClass$f([
   e$6("flow-ui-resize-observer")
 ], FlowResizeObserver);
-const styles$d = i$7`
+const styles$e = i$7`
   ${componentStyles}
 
   :host {
@@ -14754,15 +14752,15 @@ const styles$d = i$7`
     border-radius: var(--flow-ui-border-radius-pill);
   }
 `;
-var __defProp$d = Object.defineProperty;
-var __getOwnPropDesc$d = Object.getOwnPropertyDescriptor;
-var __decorateClass$d = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target;
+var __defProp$e = Object.defineProperty;
+var __getOwnPropDesc$e = Object.getOwnPropertyDescriptor;
+var __decorateClass$e = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$d(target, key, result);
+    __defProp$e(target, key, result);
   return result;
 };
 let FlowTag = class extends FlowRdfElement {
@@ -14817,23 +14815,23 @@ let FlowTag = class extends FlowRdfElement {
     `;
   }
 };
-FlowTag.styles = styles$d;
-__decorateClass$d([
+FlowTag.styles = styles$e;
+__decorateClass$e([
   n$5({ reflect: true })
 ], FlowTag.prototype, "variant", 2);
-__decorateClass$d([
+__decorateClass$e([
   n$5({ reflect: true })
 ], FlowTag.prototype, "size", 2);
-__decorateClass$d([
+__decorateClass$e([
   n$5({ type: Boolean, reflect: true })
 ], FlowTag.prototype, "pill", 2);
-__decorateClass$d([
+__decorateClass$e([
   n$5({ type: Boolean })
 ], FlowTag.prototype, "removable", 2);
-FlowTag = __decorateClass$d([
+FlowTag = __decorateClass$e([
   e$6("flow-ui-tag")
 ], FlowTag);
-const styles$c = i$7`
+const styles$d = i$7`
   ${componentStyles}
   ${formControlStyles}
 
@@ -15154,15 +15152,15 @@ const styles$c = i$7`
     padding-inline: var(--flow-ui-spacing-x-large);
   }
 `;
-var __defProp$c = Object.defineProperty;
-var __getOwnPropDesc$c = Object.getOwnPropertyDescriptor;
-var __decorateClass$c = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target;
+var __defProp$d = Object.defineProperty;
+var __getOwnPropDesc$d = Object.getOwnPropertyDescriptor;
+var __decorateClass$d = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$c(target, key, result);
+    __defProp$d(target, key, result);
   return result;
 };
 let FlowSelect = class extends FlowRdfElement {
@@ -15739,38 +15737,38 @@ let FlowSelect = class extends FlowRdfElement {
     `;
   }
 };
-FlowSelect.styles = styles$c;
-__decorateClass$c([
+FlowSelect.styles = styles$d;
+__decorateClass$d([
   i$4(".select")
 ], FlowSelect.prototype, "popup", 2);
-__decorateClass$c([
+__decorateClass$d([
   i$4(".select__combobox")
 ], FlowSelect.prototype, "combobox", 2);
-__decorateClass$c([
+__decorateClass$d([
   i$4(".select__display-input")
 ], FlowSelect.prototype, "displayInput", 2);
-__decorateClass$c([
+__decorateClass$d([
   i$4(".select__value-input")
 ], FlowSelect.prototype, "valueInput", 2);
-__decorateClass$c([
+__decorateClass$d([
   i$4(".select__listbox")
 ], FlowSelect.prototype, "listbox", 2);
-__decorateClass$c([
+__decorateClass$d([
   t$2()
 ], FlowSelect.prototype, "hasFocus", 2);
-__decorateClass$c([
+__decorateClass$d([
   t$2()
 ], FlowSelect.prototype, "displayLabel", 2);
-__decorateClass$c([
+__decorateClass$d([
   t$2()
 ], FlowSelect.prototype, "currentOption", 2);
-__decorateClass$c([
+__decorateClass$d([
   t$2()
 ], FlowSelect.prototype, "selectedOptions", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5()
 ], FlowSelect.prototype, "name", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({
     converter: {
       fromAttribute: (value) => value.split(" "),
@@ -15778,64 +15776,64 @@ __decorateClass$c([
     }
   })
 ], FlowSelect.prototype, "value", 2);
-__decorateClass$c([
+__decorateClass$d([
   defaultValue()
 ], FlowSelect.prototype, "defaultValue", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ reflect: true })
 ], FlowSelect.prototype, "size", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5()
 ], FlowSelect.prototype, "placeholder", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean, reflect: true })
 ], FlowSelect.prototype, "multiple", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ attribute: "max-options-visible", type: Number })
 ], FlowSelect.prototype, "maxOptionsVisible", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean, reflect: true })
 ], FlowSelect.prototype, "disabled", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean })
 ], FlowSelect.prototype, "clearable", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean, reflect: true })
 ], FlowSelect.prototype, "open", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean })
 ], FlowSelect.prototype, "hoist", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean, reflect: true })
 ], FlowSelect.prototype, "filled", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean, reflect: true })
 ], FlowSelect.prototype, "pill", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5()
 ], FlowSelect.prototype, "label", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ reflect: true })
 ], FlowSelect.prototype, "placement", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ attribute: "help-text" })
 ], FlowSelect.prototype, "helpText", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ reflect: true })
 ], FlowSelect.prototype, "form", 2);
-__decorateClass$c([
+__decorateClass$d([
   n$5({ type: Boolean, reflect: true })
 ], FlowSelect.prototype, "required", 2);
-__decorateClass$c([
+__decorateClass$d([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], FlowSelect.prototype, "handleDisabledChange", 1);
-__decorateClass$c([
+__decorateClass$d([
   watch("value", { waitUntilFirstUpdate: true })
 ], FlowSelect.prototype, "handleValueChange", 1);
-__decorateClass$c([
+__decorateClass$d([
   watch("open", { waitUntilFirstUpdate: true })
 ], FlowSelect.prototype, "handleOpenChange", 1);
-FlowSelect = __decorateClass$c([
+FlowSelect = __decorateClass$d([
   e$6("flow-ui-select")
 ], FlowSelect);
 setDefaultAnimation("select.show", {
@@ -15860,7 +15858,7 @@ const isNumber = (val) => typeof val === "number" && !Number.isNaN(val) && Numbe
 const isBoolean = (val) => typeof val === "boolean";
 const isDate = (val) => val instanceof Date;
 const isValue = (val) => isStringFull(val) || isNumber(val) || isBoolean(val) || isDate(val);
-const styles$b = i$7`
+const styles$c = i$7`
   ${componentStyles}
 
   :host {
@@ -15895,6 +15893,19 @@ const styles$b = i$7`
     z-index: 1;
   }
 
+  .divider-highlight {
+    width: 100%;
+    height: 100%;
+    background-color: var(--flow-ui-color-primary-500);
+    transition: transform var(--flow-ui-transition-fast) ease-in-out;
+    transition-delay: var(--flow-ui-transition-x-fast);
+    transform: scaleY(0);
+  }
+
+  :host([dragging]) .divider-highlight, .divider:hover .divider-highlight {
+    transform: scaleY(1);
+  }
+
   .divider:focus {
     outline: none;
   }
@@ -15966,15 +15977,15 @@ const styles$b = i$7`
     --divider-width: 0px !important;
   }
 `;
-var __defProp$b = Object.defineProperty;
-var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
-var __decorateClass$b = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target;
+var __defProp$c = Object.defineProperty;
+var __getOwnPropDesc$c = Object.getOwnPropertyDescriptor;
+var __decorateClass$c = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target;
   for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
     if (decorator = decorators[i3])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$b(target, key, result);
+    __defProp$c(target, key, result);
   return result;
 };
 class FlowSplitPanel extends FlowRdfElement {
@@ -16033,7 +16044,7 @@ class FlowSplitPanel extends FlowRdfElement {
       onMove: (x2, y2) => {
         let newPositionInPixels = this.vertical ? y2 : x2;
         if (this.primary === "end") {
-          newPositionInPixels = this.size - newPositionInPixels;
+          newPositionInPixels = this.size - newPositionInPixels - 1;
         }
         if (isValue(this.closedPosition)) {
           let snapPoint;
@@ -16097,6 +16108,9 @@ class FlowSplitPanel extends FlowRdfElement {
     const { width, height } = entries[0].contentRect;
     this.size = this.vertical ? height : width;
   }
+  handleCloseChange() {
+    this.emit(this.closed ? "flow-ui-collapse" : "flow-ui-expand");
+  }
   handlePositionChange() {
     this.emit("flow-ui-reposition");
   }
@@ -16160,63 +16174,137 @@ class FlowSplitPanel extends FlowRdfElement {
         @mousedown=${this.handleDrag}
         @touchstart=${this.handleDrag}
       >
-        <slot name="divider"></slot>
+        <slot name="divider"><div class="divider-highlight"></div></slot>
       </div>
 
       <slot name="end" part="panel end" class="end"></slot>
     `;
   }
 }
-FlowSplitPanel.styles = styles$b;
-__decorateClass$b([
+FlowSplitPanel.styles = styles$c;
+__decorateClass$c([
   i$4(".divider")
 ], FlowSplitPanel.prototype, "divider", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Number, reflect: true })
 ], FlowSplitPanel.prototype, "position", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ attribute: "position-units" })
 ], FlowSplitPanel.prototype, "positionUnits", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Number, attribute: "min-position" })
 ], FlowSplitPanel.prototype, "minPosition", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Number, attribute: "max-position" })
 ], FlowSplitPanel.prototype, "maxPosition", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Number, attribute: "closed-position" })
 ], FlowSplitPanel.prototype, "closedPosition", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Boolean, reflect: true })
 ], FlowSplitPanel.prototype, "closed", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Boolean, reflect: true })
 ], FlowSplitPanel.prototype, "hidden", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Boolean, reflect: true })
 ], FlowSplitPanel.prototype, "vertical", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Boolean, reflect: true })
 ], FlowSplitPanel.prototype, "disabled", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5()
 ], FlowSplitPanel.prototype, "primary", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5()
 ], FlowSplitPanel.prototype, "snap", 2);
-__decorateClass$b([
+__decorateClass$c([
   n$5({ type: Number, attribute: "snap-threshold" })
 ], FlowSplitPanel.prototype, "snapThreshold", 2);
-__decorateClass$b([
+__decorateClass$c([
   t$2()
 ], FlowSplitPanel.prototype, "dragging", 2);
-__decorateClass$b([
+__decorateClass$c([
+  watch("closed", { waitUntilFirstUpdate: true })
+], FlowSplitPanel.prototype, "handleCloseChange", 1);
+__decorateClass$c([
   watch("position", { waitUntilFirstUpdate: true })
 ], FlowSplitPanel.prototype, "handlePositionChange", 1);
-__decorateClass$b([
+__decorateClass$c([
   watch("vertical")
 ], FlowSplitPanel.prototype, "handleVerticalChange", 1);
 FlowSplitPanel.define("flow-ui-split-panel");
+const styles$b = i$7`
+  ${componentStyles}
+
+  :host([closed]) .icon-button {
+    transform: rotate(180deg);
+  }
+
+  .icon-button {
+    transition: transform var(--flow-ui-transition-medium) ease-in-out;
+  }
+`;
+var __defProp$b = Object.defineProperty;
+var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
+var __decorateClass$b = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target;
+  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$b(target, key, result);
+  return result;
+};
+class FlowSplitPanelToggleButton extends FlowIconButton {
+  constructor() {
+    super();
+    this.parentSplitPanel = null;
+    this.name = "chevron-left";
+    this.closed = false;
+    this.handleSplitPanelOpenClose = this.handleSplitPanelOpenClose.bind(this);
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.parentSplitPanel = this.closest("flow-ui-split-panel");
+    if (this.parentSplitPanel) {
+      this.parentSplitPanel.addEventListener("flow-ui-expand", this.handleSplitPanelOpenClose);
+      this.parentSplitPanel.addEventListener("flow-ui-collapse", this.handleSplitPanelOpenClose);
+      if (this.parentSplitPanel.vertical) {
+        this.name = this.parentSplitPanel.primary === "start" ? "chevron-up" : "chevron-down";
+      } else {
+        this.name = this.parentSplitPanel.primary === "start" ? "chevron-left" : "chevron-right";
+      }
+    }
+  }
+  disconnectedCallback() {
+    if (this.parentSplitPanel) {
+      this.parentSplitPanel.removeEventListener("flow-ui-expand", this.handleSplitPanelOpenClose);
+      this.parentSplitPanel.removeEventListener("flow-ui-collapse", this.handleSplitPanelOpenClose);
+    }
+    super.disconnectedCallback();
+  }
+  handleClick(event) {
+    this.closed = !this.closed;
+    super.handleClick(event);
+    if (this.parentSplitPanel) {
+      this.parentSplitPanel.closed = this.closed;
+    }
+  }
+  handleSplitPanelOpenClose() {
+    if (this.parentSplitPanel) {
+      this.closed = this.parentSplitPanel.closed;
+    }
+  }
+}
+FlowSplitPanelToggleButton.styles = [FlowIconButton.styles, styles$b];
+__decorateClass$b([
+  n$5()
+], FlowSplitPanelToggleButton.prototype, "name", 2);
+__decorateClass$b([
+  n$5({ type: Boolean, reflect: true })
+], FlowSplitPanelToggleButton.prototype, "closed", 2);
+FlowSplitPanelToggleButton.define("flow-ui-split-panel-toggle-button");
 const styles$a = i$7`
   ${componentStyles}
 
@@ -16586,11 +16674,16 @@ const styles$9 = i$7`
   .tab-group {
     height: 100%;
     display: flex;
-    justify-content: stretch;
+    justify-content: start;
     border-radius: 0;
     overflow: hidden;
   }
 
+  /* Ensure nav is positioned when tab-group is placed in a split panel and the panel is closed */
+  .tab-group--end, .tab-group--bottom {
+    justify-content: end;
+  }
+
   .tab-group__nav-container {
     display: flex;
     flex: 0 0 auto;
@@ -20492,7 +20585,7 @@ const translation = {
   toggleColorFormat: "Toggle color format"
 };
 registerTranslation(translation);
-const version = "0.0.3";
+const version = "0.0.4";
 const CONSOLE_HIGHLIGHT_STYLE = `
   padding: 2px 4px;
   border-radius: 2px;
@@ -20541,6 +20634,7 @@ export {
   FlowSelect,
   FlowSpinner,
   FlowSplitPanel,
+  FlowSplitPanelToggleButton,
   FlowSwitch,
   FlowTab,
   FlowTabGroup,