@codbex/harmonia 1.4.1 → 1.5.0

package/dist/harmonia.esm.js

@@ -2210,10 +2210,10 @@ function accordion_default(Alpine) {
     }) : { single: false };
     el.setAttribute("data-slot", "accordion");
   });
-  Alpine.directive("h-accordion-item", (el, { original, expression, modifiers }, { effect, Alpine: Alpine2 }) => {
+  Alpine.directive("h-accordion-item", (el, { original: original2, expression, modifiers }, { effect, Alpine: Alpine2 }) => {
     const accordion = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_accordion"));
     if (!accordion) {
-      throw new Error(`${original} must be inside an accordion`);
+      throw new Error(`${original2} must be inside an accordion`);
     }
     el.classList.add("border-b", "last:border-b-0", "[[data-variant=header]_&]:data-[state=closed]:border-b-0");
     el.setAttribute("data-slot", "accordion-item");
@@ -2241,14 +2241,14 @@ function accordion_default(Alpine) {
     setAttributes();
     effect(setAttributes);
   });
-  Alpine.directive("h-accordion-trigger", (el, { original, expression }, { effect, evaluateLater, Alpine: Alpine2, cleanup }) => {
+  Alpine.directive("h-accordion-trigger", (el, { original: original2, expression }, { effect, evaluateLater, Alpine: Alpine2, cleanup }) => {
     if (el.tagName.length !== 2 && !el.tagName.startsWith("H")) {
-      throw new Error(`${original} must be a header element`);
+      throw new Error(`${original2} must be a header element`);
     }
     const accordion = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_accordion"));
     const accordionItem = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_accordionItem"));
     if (!accordionItem || !accordion) {
-      throw new Error(`${original} must have an accordion and accordion item parent elements`);
+      throw new Error(`${original2} must have an accordion and accordion item parent elements`);
     }
     el.classList.add(
       "flex",
@@ -2433,10 +2433,10 @@ function avatar_default(Alpine) {
       el.classList.add("cursor-pointer", "hover:bg-secondary-hover", "active:bg-secondary-active");
     }
   });
-  Alpine.directive("h-avatar-image", (el, { original }, { cleanup }) => {
+  Alpine.directive("h-avatar-image", (el, { original: original2 }, { cleanup }) => {
     const avatar = Alpine.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_avatar"));
     if (!avatar) {
-      throw new Error(`${original} must be inside an avatar element`);
+      throw new Error(`${original2} must be inside an avatar element`);
     }
     el.classList.add("aspect-square", "size-full");
     el.setAttribute("data-slot", "avatar-image");
@@ -2467,10 +2467,10 @@ function avatar_default(Alpine) {
       observer.disconnect();
     });
   });
-  Alpine.directive("h-avatar-fallback", (el, { original }, { effect }) => {
+  Alpine.directive("h-avatar-fallback", (el, { original: original2 }, { effect }) => {
     const avatar = Alpine.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_avatar"));
     if (!avatar) {
-      throw new Error(`${original} must be inside an avatar element`);
+      throw new Error(`${original2} must be inside an avatar element`);
     }
     el.classList.add("hidden", "bg-muted", "flex", "size-full", "items-center", "justify-center");
     el.setAttribute("data-slot", "avatar-fallback");
@@ -2679,7 +2679,7 @@ var getButtonSize = (size3, isAddon = false) => {
   }
 };
 function button_default(Alpine) {
-  Alpine.directive("h-button", (el, { original, modifiers }, { cleanup }) => {
+  Alpine.directive("h-button", (el, { original: original2, modifiers }, { cleanup }) => {
     setButtonClasses(el);
     if (!el.hasAttribute("data-slot")) {
       el.setAttribute("data-slot", "button");
@@ -2696,7 +2696,7 @@ function button_default(Alpine) {
       el.classList.remove(...getButtonSize(lastSize, isAddon));
       el.classList.add(...getButtonSize(size3, isAddon));
       if (size3.startsWith("icon") && !el.hasAttribute("aria-labelledby") && !el.hasAttribute("aria-label")) {
-        console.error(`${original}: Icon-only buttons must have an "aria-label" or "aria-labelledby" attribute`, el);
+        console.error(`${original2}: Icon-only buttons must have an "aria-label" or "aria-labelledby" attribute`, el);
       }
       lastSize = size3;
     }
@@ -2775,10 +2775,6 @@ var oppositeSideMap = {
   bottom: "top",
   top: "bottom"
 };
-var oppositeAlignmentMap = {
-  start: "end",
-  end: "start"
-};
 function clamp(start, value, end2) {
   return max(start, min(value, end2));
 }
@@ -2797,9 +2793,9 @@ function getOppositeAxis(axis) {
 function getAxisLength(axis) {
   return axis === "y" ? "height" : "width";
 }
-var yAxisSides = /* @__PURE__ */ new Set(["top", "bottom"]);
 function getSideAxis(placement) {
-  return yAxisSides.has(getSide(placement)) ? "y" : "x";
+  const firstChar = placement[0];
+  return firstChar === "t" || firstChar === "b" ? "y" : "x";
 }
 function getAlignmentAxis(placement) {
   return getOppositeAxis(getSideAxis(placement));
@@ -2822,7 +2818,7 @@ function getExpandedPlacements(placement) {
   return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
 }
 function getOppositeAlignmentPlacement(placement) {
-  return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
+  return placement.includes("start") ? placement.replace("start", "end") : placement.replace("end", "start");
 }
 var lrPlacement = ["left", "right"];
 var rlPlacement = ["right", "left"];
@@ -2853,7 +2849,8 @@ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
   return list;
 }
 function getOppositePlacement(placement) {
-  return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
+  const side = getSide(placement);
+  return oppositeSideMap[side] + placement.slice(side.length);
 }
 function expandPaddingObject(padding) {
   return {
@@ -3003,6 +3000,7 @@ async function detectOverflow(state, options) {
     right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
   };
 }
+var MAX_RESET_COUNT = 50;
 var computePosition = async (reference, floating, config) => {
   const {
     placement = "bottom",
@@ -3010,7 +3008,10 @@ var computePosition = async (reference, floating, config) => {
     middleware = [],
     platform: platform2
   } = config;
-  const validMiddleware = middleware.filter(Boolean);
+  const platformWithDetectOverflow = platform2.detectOverflow ? platform2 : {
+    ...platform2,
+    detectOverflow
+  };
   const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(floating));
   let rects = await platform2.getElementRects({
     reference,
@@ -3022,14 +3023,17 @@ var computePosition = async (reference, floating, config) => {
     y
   } = computeCoordsFromPlacement(rects, placement, rtl);
   let statefulPlacement = placement;
-  let middlewareData = {};
   let resetCount = 0;
-  for (let i = 0; i < validMiddleware.length; i++) {
-    var _platform$detectOverf;
+  const middlewareData = {};
+  for (let i = 0; i < middleware.length; i++) {
+    const currentMiddleware = middleware[i];
+    if (!currentMiddleware) {
+      continue;
+    }
     const {
       name,
       fn
-    } = validMiddleware[i];
+    } = currentMiddleware;
     const {
       x: nextX,
       y: nextY,
@@ -3043,10 +3047,7 @@ var computePosition = async (reference, floating, config) => {
       strategy,
       middlewareData,
       rects,
-      platform: {
-        ...platform2,
-        detectOverflow: (_platform$detectOverf = platform2.detectOverflow) != null ? _platform$detectOverf : detectOverflow
-      },
+      platform: platformWithDetectOverflow,
       elements: {
         reference,
         floating
@@ -3054,14 +3055,11 @@ var computePosition = async (reference, floating, config) => {
     });
     x = nextX != null ? nextX : x;
     y = nextY != null ? nextY : y;
-    middlewareData = {
-      ...middlewareData,
-      [name]: {
-        ...middlewareData[name],
-        ...data
-      }
+    middlewareData[name] = {
+      ...middlewareData[name],
+      ...data
     };
-    if (reset && resetCount <= 50) {
+    if (reset && resetCount < MAX_RESET_COUNT) {
       resetCount++;
       if (typeof reset === "object") {
         if (reset.placement) {
@@ -3523,7 +3521,6 @@ function isShadowRoot(value) {
   }
   return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
 }
-var invalidOverflowDisplayValues = /* @__PURE__ */ new Set(["inline", "contents"]);
 function isOverflowElement(element) {
   const {
     overflow,
@@ -3531,29 +3528,31 @@ function isOverflowElement(element) {
     overflowY,
     display
   } = getComputedStyle2(element);
-  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
+  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== "inline" && display !== "contents";
 }
-var tableElements = /* @__PURE__ */ new Set(["table", "td", "th"]);
 function isTableElement(element) {
-  return tableElements.has(getNodeName(element));
+  return /^(table|td|th)$/.test(getNodeName(element));
 }
-var topLayerSelectors = [":popover-open", ":modal"];
 function isTopLayer(element) {
-  return topLayerSelectors.some((selector) => {
-    try {
-      return element.matches(selector);
-    } catch (_e) {
-      return false;
+  try {
+    if (element.matches(":popover-open")) {
+      return true;
     }
-  });
+  } catch (_e) {
+  }
+  try {
+    return element.matches(":modal");
+  } catch (_e) {
+    return false;
+  }
 }
-var transformProperties = ["transform", "translate", "scale", "rotate", "perspective"];
-var willChangeValues = ["transform", "translate", "scale", "rotate", "perspective", "filter"];
-var containValues = ["paint", "layout", "strict", "content"];
+var willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
+var containRe = /paint|layout|strict|content/;
+var isNotNone = (value) => !!value && value !== "none";
+var isWebKitValue;
 function isContainingBlock(elementOrCss) {
-  const webkit = isWebKit();
   const css = isElement(elementOrCss) ? getComputedStyle2(elementOrCss) : elementOrCss;
-  return transformProperties.some((value) => css[value] ? css[value] !== "none" : false) || (css.containerType ? css.containerType !== "normal" : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : false) || !webkit && (css.filter ? css.filter !== "none" : false) || willChangeValues.some((value) => (css.willChange || "").includes(value)) || containValues.some((value) => (css.contain || "").includes(value));
+  return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || "") || containRe.test(css.contain || "");
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
@@ -3568,12 +3567,13 @@ function getContainingBlock(element) {
   return null;
 }
 function isWebKit() {
-  if (typeof CSS === "undefined" || !CSS.supports) return false;
-  return CSS.supports("-webkit-backdrop-filter", "none");
+  if (isWebKitValue == null) {
+    isWebKitValue = typeof CSS !== "undefined" && CSS.supports && CSS.supports("-webkit-backdrop-filter", "none");
+  }
+  return isWebKitValue;
 }
-var lastTraversableNodeNames = /* @__PURE__ */ new Set(["html", "body", "#document"]);
 function isLastTraversableNode(node) {
-  return lastTraversableNodeNames.has(getNodeName(node));
+  return /^(html|body|#document)$/.test(getNodeName(node));
 }
 function getComputedStyle2(element) {
   return getWindow(element).getComputedStyle(element);
@@ -3627,8 +3627,9 @@ function getOverflowAncestors(node, list, traverseIframes) {
   if (isBody) {
     const frameElement = getFrameElement(win);
     return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
+  } else {
+    return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
   }
-  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
 }
 function getFrameElement(win) {
   return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
@@ -3792,7 +3793,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
       scroll = getNodeScroll(offsetParent);
     }
-    if (isHTMLElement(offsetParent)) {
+    if (isOffsetParentAnElement) {
       const offsetRect = getBoundingClientRect(offsetParent);
       scale = getScale(offsetParent);
       offsets.x = offsetRect.x + offsetParent.clientLeft;
@@ -3866,7 +3867,6 @@ function getViewportRect(element, strategy) {
     y
   };
 }
-var absoluteOrFixed = /* @__PURE__ */ new Set(["absolute", "fixed"]);
 function getInnerBoundingClientRect(element, strategy) {
   const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
   const top2 = clientRect.top + element.clientTop;
@@ -3924,7 +3924,7 @@ function getClippingElementAncestors(element, cache) {
     if (!currentNodeIsContaining && computedStyle.position === "fixed") {
       currentContainingBlockComputedStyle = null;
     }
-    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
+    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === "absolute" || currentContainingBlockComputedStyle.position === "fixed") || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
     if (shouldDropCurrentNode) {
       result = result.filter((ancestor) => ancestor !== currentNode);
     } else {
@@ -3944,20 +3944,23 @@ function getClippingRect(_ref) {
   } = _ref;
   const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
-  const firstClippingAncestor = clippingAncestors[0];
-  const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
-    const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
-    accRect.top = max(rect.top, accRect.top);
-    accRect.right = min(rect.right, accRect.right);
-    accRect.bottom = min(rect.bottom, accRect.bottom);
-    accRect.left = max(rect.left, accRect.left);
-    return accRect;
-  }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
+  const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
+  let top2 = firstRect.top;
+  let right = firstRect.right;
+  let bottom = firstRect.bottom;
+  let left = firstRect.left;
+  for (let i = 1; i < clippingAncestors.length; i++) {
+    const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
+    top2 = max(rect.top, top2);
+    right = min(rect.right, right);
+    bottom = min(rect.bottom, bottom);
+    left = max(rect.left, left);
+  }
   return {
-    width: clippingRect.right - clippingRect.left,
-    height: clippingRect.bottom - clippingRect.top,
-    x: clippingRect.left,
-    y: clippingRect.top
+    width: right - left,
+    height: bottom - top2,
+    x: left,
+    y: top2
   };
 }
 function getDimensions(element) {
@@ -4166,7 +4169,7 @@ function autoUpdate(reference, floating, update, options) {
     animationFrame = false
   } = options;
   const referenceEl = unwrapElement(reference);
-  const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
+  const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...floating ? getOverflowAncestors(floating) : []] : [];
   ancestors.forEach((ancestor) => {
     ancestorScroll && ancestor.addEventListener("scroll", update, {
       passive: true
@@ -4179,7 +4182,7 @@ function autoUpdate(reference, floating, update, options) {
   if (elementResize) {
     resizeObserver = new ResizeObserver((_ref) => {
       let [firstEntry] = _ref;
-      if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
+      if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) {
         resizeObserver.unobserve(floating);
         cancelAnimationFrame(reobserveFrame);
         reobserveFrame = requestAnimationFrame(() => {
@@ -4192,7 +4195,9 @@ function autoUpdate(reference, floating, update, options) {
     if (referenceEl && !animationFrame) {
       resizeObserver.observe(referenceEl);
     }
-    resizeObserver.observe(floating);
+    if (floating) {
+      resizeObserver.observe(floating);
+    }
   }
   let frameId;
   let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
@@ -4245,7 +4250,7 @@ var computePosition2 = (reference, floating, options) => {
 
 // src/components/calendar.js
 function calendar_default(Alpine) {
-  Alpine.directive("h-calendar", (el, { original, expression }, { effect, evaluateLater, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-calendar", (el, { original: original2, expression }, { effect, evaluateLater, cleanup, Alpine: Alpine2 }) => {
     const datepicker = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_datepicker"));
     el.classList.add("border", "rounded-control", "gap-2", "p-2");
     el.setAttribute("tabindex", "-1");
@@ -4289,7 +4294,7 @@ function calendar_default(Alpine) {
     const onInputChange = () => {
       const newValue = new Date(datepicker._h_datepicker.input.value);
       if (isNaN(newValue)) {
-        console.error(`${original}: input value is not a valid date - ${datepicker._h_datepicker.input.value}`);
+        console.error(`${original2}: input value is not a valid date - ${datepicker._h_datepicker.input.value}`);
         datepicker._h_datepicker.input.setCustomValidity("Input value is not a valid date.");
         return;
       } else if (selected.getTime() !== newValue.getTime()) {
@@ -4306,7 +4311,7 @@ function calendar_default(Alpine) {
       if (el.hasOwnProperty("_x_model") && el._x_model.get()) {
         selected = new Date(el._x_model.get());
         if (isNaN(selected)) {
-          console.error(`${original}: input value is not a valid date - ${el._x_model.get()}`);
+          console.error(`${original2}: input value is not a valid date - ${el._x_model.get()}`);
           if (datepicker) datepicker._h_datepicker.input.setCustomValidity("Input value is not a valid date.");
           else el.setAttribute("data-invalid", "true");
         } else if (datepicker) {
@@ -4815,10 +4820,10 @@ function collapsible_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-collapsible-trigger", (el, { original, modifiers }, { effect, Alpine: Alpine2, cleanup }) => {
+  Alpine.directive("h-collapsible-trigger", (el, { original: original2, modifiers }, { effect, Alpine: Alpine2, cleanup }) => {
     const collapsible = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_collapsible"));
     if (!collapsible) {
-      throw new Error(`${original} must be inside a collapsible element`);
+      throw new Error(`${original2} must be inside a collapsible element`);
     }
     if (!el.hasAttribute("data-slot")) el.setAttribute("data-slot", "collapsible-trigger");
     if (modifiers.includes("chevron")) {
@@ -4837,10 +4842,10 @@ function collapsible_default(Alpine) {
       el.removeEventListener("click", handler);
     });
   });
-  Alpine.directive("h-collapsible-content", (el, { original }, { effect, Alpine: Alpine2 }) => {
+  Alpine.directive("h-collapsible-content", (el, { original: original2 }, { effect, Alpine: Alpine2 }) => {
     const collapsible = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_collapsible"));
     if (!collapsible) {
-      throw new Error(`${original} must be inside an h-collapsible element`);
+      throw new Error(`${original2} must be inside an h-collapsible element`);
     }
     if (!el.hasAttribute("data-slot")) el.setAttribute("data-slot", "collapsible-content");
     el.classList.add("data-[state=closed]:!hidden");
@@ -4871,7 +4876,7 @@ function sizeObserver(el) {
 
 // src/components/datepicker.js
 function datepicker_default(Alpine) {
-  Alpine.directive("h-date-picker", (el, { original, modifiers }, { Alpine: Alpine2, cleanup }) => {
+  Alpine.directive("h-date-picker", (el, { original: original2, modifiers }, { Alpine: Alpine2, cleanup }) => {
     const state = Alpine2.reactive({
       expanded: false
     });
@@ -4884,7 +4889,7 @@ function datepicker_default(Alpine) {
     };
     el._h_datepicker.input = el.querySelector("input");
     if (!el._h_datepicker.input || el._h_datepicker.input.tagName !== "INPUT") {
-      throw new Error(`${original} must contain an input`);
+      throw new Error(`${original2} must contain an input`);
     } else if (el._h_datepicker.input.hasAttribute("id")) {
       el._h_datepicker.id = el._h_datepicker.input.getAttribute("id");
     } else {
@@ -4961,16 +4966,16 @@ function datepicker_default(Alpine) {
       observer.disconnect();
     });
   });
-  Alpine.directive("h-date-picker-trigger", (el, { original }, { effect, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-date-picker-trigger", (el, { original: original2 }, { effect, cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "BUTTON") {
-      throw new Error(`${original} must be a button`);
+      throw new Error(`${original2} must be a button`);
     }
     if (!el.hasAttribute("aria-labelledby") && !el.hasAttribute("aria-label")) {
-      throw new Error(`${original}: must have an "aria-label" or "aria-labelledby" attribute`);
+      throw new Error(`${original2}: must have an "aria-label" or "aria-labelledby" attribute`);
     }
     const datepicker = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_datepicker"));
     if (!datepicker) {
-      throw new Error(`${original} must be inside an date-picker element`);
+      throw new Error(`${original2} must be inside an date-picker element`);
     }
     el.classList.add("cursor-pointer", "inline-flex", "items-center", "justify-center", "h-full", "aspect-square", "bg-transparent", "hover:bg-secondary", "active:bg-secondary-active", "outline-none");
     if (datepicker._h_datepicker.inTable) {
@@ -5250,13 +5255,13 @@ function fieldset_default(Alpine) {
 
 // src/components/icon.js
 function icon_default(Alpine) {
-  Alpine.directive("h-icon", (el, { original, modifiers }) => {
+  Alpine.directive("h-icon", (el, { original: original2, modifiers }) => {
     if (el.tagName.toLowerCase() !== "svg") {
-      throw new Error(`${original} works only on svg elements`);
+      throw new Error(`${original2} works only on svg elements`);
     } else if (!el.hasAttribute("role")) {
-      throw new Error(`${original} must have a role`);
+      throw new Error(`${original2} must have a role`);
     } else if (el.getAttribute("role") === "img" && !el.hasAttribute("aria-labelledby") && !el.hasAttribute("aria-label")) {
-      throw new Error(`${original}: svg images with the role of img must have an "aria-label" or "aria-labelledby" attribute`);
+      throw new Error(`${original2}: svg images with the role of img must have an "aria-label" or "aria-labelledby" attribute`);
     }
     el.classList.add("fill-current");
     el.setAttribute("data-slot", "icon");
@@ -5473,7 +5478,7 @@ function input_default(Alpine) {
     el.classList.add("text-muted-foreground", "flex", "items-center", "gap-2", "text-sm", "[&_svg]:pointer-events-none", "[&_svg:not([class*='size-'])]:size-4");
     el.setAttribute("data-slot", "label");
   });
-  Alpine.directive("h-input-number", (el, { original }, { cleanup }) => {
+  Alpine.directive("h-input-number", (el, { original: original2 }, { cleanup }) => {
     el.classList.add(
       "overflow-hidden",
       "group/input-number",
@@ -5506,7 +5511,7 @@ function input_default(Alpine) {
     el.setAttribute("data-slot", "input-number");
     const input = el.querySelector("input");
     if (!input || input.getAttribute("type") !== "number") {
-      throw new Error(`${original} must contain an input of type 'number'`);
+      throw new Error(`${original2} must contain an input of type 'number'`);
     }
     if (!input.hasAttribute("type")) input.setAttribute("type", "number");
     if (!input.hasAttribute("inputmode")) input.setAttribute("inputmode", "numeric");
@@ -5752,13 +5757,13 @@ function list_default(Alpine) {
     el.setAttribute("data-slot", "list");
     el.setAttribute("role", "group");
   });
-  Alpine.directive("h-list-header", (el, { original }, { Alpine: Alpine2 }) => {
+  Alpine.directive("h-list-header", (el, { original: original2 }, { Alpine: Alpine2 }) => {
     el.classList.add("font-medium", "flex", "items-center", "p-2", "gap-2", "align-middle", "bg-table-header", "text-table-header-foreground");
     el.setAttribute("role", "presentation");
     el.setAttribute("data-slot", "list-header");
     const list = Alpine2.findClosest(el.parentElement, (parent) => parent.getAttribute("data-slot") === "list");
     if (!list) {
-      throw new Error(`${original} must be placed inside a list element`);
+      throw new Error(`${original2} must be placed inside a list element`);
     }
     if (!el.hasAttribute("id")) {
       const id = `lbh${v4_default()}`;
@@ -5810,9 +5815,9 @@ function menu_default(Alpine) {
     };
     el.setAttribute("data-state", "closed");
   });
-  Alpine.directive("h-menu", (el, { original, modifiers }, { cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-menu", (el, { original: original2, modifiers }, { cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "UL") {
-      throw new Error(`${original} must be an ul element`);
+      throw new Error(`${original2} must be an ul element`);
     }
     el.classList.add("hidden", "fixed", "bg-popover", "text-popover-foreground", "font-normal", "z-50", "min-w-[8rem]", "overflow-x-hidden", "overflow-y-auto", "rounded-md", "p-1", "shadow-md", "border", "outline-none");
     el.setAttribute("role", "menu");
@@ -5820,7 +5825,7 @@ function menu_default(Alpine) {
     el.setAttribute("tabindex", "-1");
     el.setAttribute("data-slot", "menu");
     if (!el.hasAttribute("aria-labelledby") && !el.hasAttribute("aria-label")) {
-      throw new Error(`${original} must have an "aria-label" or "aria-labelledby" attribute`);
+      throw new Error(`${original2} must have an "aria-label" or "aria-labelledby" attribute`);
     }
     const isSubmenu = modifiers.includes("sub");
     const menuTrigger = (() => {
@@ -5832,7 +5837,7 @@ function menu_default(Alpine) {
       return sibling;
     })();
     if (!isSubmenu && !menuTrigger) {
-      throw new Error(`${original} menu must be placed after a menu trigger element`);
+      throw new Error(`${original2} menu must be placed after a menu trigger element`);
     }
     let menuSubItem;
     if (isSubmenu) menuSubItem = Alpine2.findClosest(el.parentElement, (parent) => parent.getAttribute("data-slot") === "menu-sub");
@@ -6051,9 +6056,9 @@ function menu_default(Alpine) {
       el.removeEventListener("keydown", onKeyDown);
     });
   });
-  Alpine.directive("h-menu-item", (el, { original }, { cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-menu-item", (el, { original: original2 }, { cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "LI") {
-      throw new Error(`${original} must be a li element`);
+      throw new Error(`${original2} must be a li element`);
     }
     el.classList.add(
       "focus:bg-secondary-hover",
@@ -6107,7 +6112,7 @@ function menu_default(Alpine) {
       el.removeEventListener("mouseleave", focusOut);
     });
   });
-  Alpine.directive("h-menu-sub", (el, { original }, { cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-menu-sub", (el, { original: original2 }, { cleanup, Alpine: Alpine2 }) => {
     el.classList.add(
       "focus:bg-secondary-hover",
       "hover:bg-secondary-hover",
@@ -6139,7 +6144,7 @@ function menu_default(Alpine) {
     const chevronRight = createSvg({ icon: ChevronRight, classes: "size-4 ml-auto", attrs: { "aria-hidden": true, role: "presentation" } });
     el.appendChild(chevronRight);
     const parentMenu = Alpine2.findClosest(el.parentElement, (parent) => parent.getAttribute("role") === "menu");
-    if (!parentMenu) throw new Error(`${original} must have a parent`);
+    if (!parentMenu) throw new Error(`${original2} must have a parent`);
     el._menu_sub = {
       open: void 0,
       close: void 0,
@@ -6233,9 +6238,9 @@ function menu_default(Alpine) {
     el.classList.add("text-foreground", "px-2", "py-1.5", "text-sm", "font-semibold", "text-left", "data-[inset=true]:pl-8");
     el.setAttribute("data-slot", "menu-label");
   });
-  Alpine.directive("h-menu-checkbox-item", (el, { original }, { cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-menu-checkbox-item", (el, { original: original2 }, { cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "LI" && el.tagName !== "DIV") {
-      throw new Error(`${original} must be a li or div element`);
+      throw new Error(`${original2} must be a li or div element`);
     }
     el.classList.add(
       "focus:bg-secondary-hover",
@@ -6301,9 +6306,9 @@ function menu_default(Alpine) {
       el.removeEventListener("mouseleave", focusOut);
     });
   });
-  Alpine.directive("h-menu-radio-item", (el, { original, expression }, { effect, evaluateLater, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-menu-radio-item", (el, { original: original2, expression }, { effect, evaluateLater, cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "LI" && el.tagName !== "DIV") {
-      throw new Error(`${original} must be a li or div element`);
+      throw new Error(`${original2} must be a li or div element`);
     }
     el.classList.add(
       "focus:bg-secondary-hover",
@@ -6532,7 +6537,7 @@ function popover_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-popover", (el, { original, modifiers }, { effect }) => {
+  Alpine.directive("h-popover", (el, { original: original2, modifiers }, { effect }) => {
     const popover = (() => {
       let sibling = el.previousElementSibling;
       while (sibling && !sibling.hasOwnProperty("_popover")) {
@@ -6541,7 +6546,7 @@ function popover_default(Alpine) {
       return sibling;
     })();
     if (!popover) {
-      throw new Error(`${original} must be placed after a popover element`);
+      throw new Error(`${original2} must be placed after a popover element`);
     }
     el.classList.add("absolute", "bg-popover", "text-popover-foreground", "data-[state=closed]:hidden", "top-0", "left-0", "z-50", "min-w-[1rem]", "rounded-md", "border", "shadow-md", "outline-hidden", "overflow-auto");
     el.setAttribute("data-slot", "popover");
@@ -6744,9 +6749,9 @@ function select_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-select-input", (el, { original }, { effect, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-select-input", (el, { original: original2 }, { effect, cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "INPUT") {
-      throw new Error(`${original} must be an input of type "text"`);
+      throw new Error(`${original2} must be an input of type "text"`);
     }
     const select = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_select"));
     const label = (() => {
@@ -6757,7 +6762,7 @@ function select_default(Alpine) {
       return;
     })();
     if (!select) {
-      throw new Error(`${original} must be inside a select element`);
+      throw new Error(`${original2} must be inside a select element`);
     } else if (el.hasOwnProperty("_x_model")) {
       select._h_select.multiple = Array.isArray(el._x_model.get());
       select._h_model.set = (value) => {
@@ -6777,6 +6782,7 @@ function select_default(Alpine) {
         } else {
           el._x_model.set("");
         }
+        el.dispatchEvent(new Event("change", { bubbles: true }));
       };
       select._h_model.get = el._x_model.get;
     } else {
@@ -7017,10 +7023,10 @@ function select_default(Alpine) {
       }
     });
   });
-  Alpine.directive("h-select-content", (el, { original }, { effect, Alpine: Alpine2 }) => {
+  Alpine.directive("h-select-content", (el, { original: original2 }, { effect, Alpine: Alpine2 }) => {
     const select = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_select"));
     if (!select) {
-      throw new Error(`${original} must be inside a select element`);
+      throw new Error(`${original2} must be inside a select element`);
     }
     el.classList.add("absolute", "bg-popover", "text-popover-foreground", "data-[state=closed]:hidden", "p-1", "top-0", "left-0", "z-50", "min-w-[1rem]", "overflow-x-hidden", "overflow-y-auto", "rounded-md", "border", "shadow-md");
     el.setAttribute("data-slot", "select-content");
@@ -7029,7 +7035,7 @@ function select_default(Alpine) {
     el.setAttribute("tabindex", "-1");
     el.setAttribute("data-state", select._h_select.expanded ? "open" : "closed");
     if (!select._h_select.trigger) {
-      throw new Error(`${original}: trigger not found`);
+      throw new Error(`${original2}: trigger not found`);
     }
     let autoUpdateCleanup;
     function updatePosition() {
@@ -7071,10 +7077,10 @@ function select_default(Alpine) {
       }
     });
   });
-  Alpine.directive("h-select-search", (el, { original }, { effect, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-select-search", (el, { original: original2 }, { effect, cleanup, Alpine: Alpine2 }) => {
     const select = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_select"));
     if (!select) {
-      throw new Error(`${original} must be inside an h-select element`);
+      throw new Error(`${original2} must be inside an h-select element`);
     } else {
       select._h_select.filterType = FilterType[el.getAttribute("data-filter")] ?? FilterType["starts-with"];
     }
@@ -7146,10 +7152,10 @@ function select_default(Alpine) {
       selectGroup._h_selectGroup.labelledby = id;
     }
   });
-  Alpine.directive("h-select-option", (el, { original, expression }, { effect, evaluateLater, cleanup }) => {
+  Alpine.directive("h-select-option", (el, { original: original2, expression }, { effect, evaluateLater, cleanup }) => {
     const select = Alpine.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_select"));
     if (!select) {
-      throw new Error(`${original} must be inside an h-select element`);
+      throw new Error(`${original2} must be inside an h-select element`);
     }
     el.classList.add(
       "focus:bg-primary",
@@ -7403,10 +7409,10 @@ function sidebar_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-sidebar-group-label", (el, { original }, { cleanup }) => {
+  Alpine.directive("h-sidebar-group-label", (el, { original: original2 }, { cleanup }) => {
     const group = Alpine.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_sidebar_group"));
     if (!group) {
-      throw new Error(`${original} must be placed inside a sidebar group`);
+      throw new Error(`${original2} must be placed inside a sidebar group`);
     }
     el.classList.add(
       "ring-sidebar-ring",
@@ -7493,10 +7499,10 @@ function sidebar_default(Alpine) {
     }
     el.setAttribute("data-slot", "sidebar-group-action");
   });
-  Alpine.directive("h-sidebar-group-content", (el, { original }, { effect }) => {
+  Alpine.directive("h-sidebar-group-content", (el, { original: original2 }, { effect }) => {
     const group = Alpine.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_sidebar_group"));
     if (!group) {
-      throw new Error(`${original} must be placed inside a sidebar group`);
+      throw new Error(`${original2} must be placed inside a sidebar group`);
     }
     el.classList.add("w-full", "text-sm", "data-[collapsed=true]:hidden", "group-data-[collapsed=true]/sidebar:!block");
     el.setAttribute("data-slot", "sidebar-group-content");
@@ -7509,16 +7515,16 @@ function sidebar_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-sidebar-menu", (el, { original }) => {
+  Alpine.directive("h-sidebar-menu", (el, { original: original2 }) => {
     if (el.tagName !== "UL") {
-      throw new Error(`${original} must be an ul element`);
+      throw new Error(`${original2} must be an ul element`);
     }
     el.classList.add("vbox", "w-full", "min-w-0", "gap-1");
     el.setAttribute("data-slot", "sidebar-menu");
   });
-  Alpine.directive("h-sidebar-menu-item", (el, { original, expression, modifiers }, { effect, evaluate: evaluate2, evaluateLater, Alpine: Alpine2 }) => {
+  Alpine.directive("h-sidebar-menu-item", (el, { original: original2, expression, modifiers }, { effect, evaluate: evaluate2, evaluateLater, Alpine: Alpine2 }) => {
     if (el.tagName !== "LI") {
-      throw new Error(`${original} must be a li element`);
+      throw new Error(`${original2} must be a li element`);
     }
     el._h_sidebar_menu_item = {
       isSub: false,
@@ -7554,9 +7560,9 @@ function sidebar_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-sidebar-menu-button", (el, { original }, { cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-sidebar-menu-button", (el, { original: original2 }, { cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "BUTTON" && el.tagName !== "A") {
-      throw new Error(`${original} must be a button or a link`);
+      throw new Error(`${original2} must be a button or a link`);
     } else if (el.tagName === "BUTTON") {
       el.setAttribute("type", "button");
     }
@@ -7692,9 +7698,9 @@ function sidebar_default(Alpine) {
     }
     el.setAttribute("data-slot", "sidebar-menu-action");
   });
-  Alpine.directive("h-sidebar-menu-badge", (el, { original }) => {
+  Alpine.directive("h-sidebar-menu-badge", (el, { original: original2 }) => {
     if (el.tagName !== "SPAN") {
-      throw new Error(`${original} must be a span element`);
+      throw new Error(`${original2} must be a span element`);
     }
     el.classList.add("flex-1", "pointer-events-none", "flex", "h-full", "min-w-min", "items-center", "justify-end", "text-xs", "font-medium", "tabular-nums", "select-none", "group-data-[collapsed=true]/sidebar:hidden");
     el.setAttribute("data-slot", "sidebar-menu-badge");
@@ -7720,13 +7726,13 @@ function sidebar_default(Alpine) {
     el.setAttribute("data-slot", "sidebar-separator");
     el.setAttribute("role", "none");
   });
-  Alpine.directive("h-sidebar-menu-sub", (el, { original }, { effect, Alpine: Alpine2 }) => {
+  Alpine.directive("h-sidebar-menu-sub", (el, { original: original2 }, { effect, Alpine: Alpine2 }) => {
     if (el.tagName !== "UL") {
-      throw new Error(`${original} must be an ul element`);
+      throw new Error(`${original2} must be an ul element`);
     }
     const menuItem = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_sidebar_menu_item"));
     if (!menuItem) {
-      throw new Error(`${original} must be placed inside a sidebar menu item`);
+      throw new Error(`${original2} must be placed inside a sidebar menu item`);
     }
     el.classList.add("vbox", "min-w-0", "translate-x-px", "gap-1", "pl-2.5", "py-0.5", "ml-3.5", "data-[collapsed=true]:!hidden", "group-data-[collapsed=true]/sidebar:!hidden");
     if (el.getAttribute("data-line") !== "false") {
@@ -7961,6 +7967,10 @@ function split_default(Alpine) {
         refreshGutters();
         queueLayout();
       },
+      gutterHidden() {
+        refreshGutters();
+        queueLayout();
+      },
       panelChange() {
         queueLayout();
       },
@@ -7991,14 +8001,15 @@ function split_default(Alpine) {
       observer.disconnect();
     });
   });
-  Alpine.directive("h-split-panel", (el, { original }, { effect, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-split-panel", (el, { original: original2 }, { effect, cleanup, Alpine: Alpine2 }) => {
     const split = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_split"));
     if (!split) {
-      throw new Error(`${original} must be inside an split element`);
+      throw new Error(`${original2} must be inside an split element`);
     }
     el.classList.add("flex", "shrink", "grow-0", "box-border", "min-w-0", "min-h-0", "overflow-visible");
     el.setAttribute("tabindex", "-1");
     el.setAttribute("data-slot", "split-panel");
+    let gutterless = el.getAttribute("data-gutterless") === "true";
     const gutter = document.createElement("span");
     gutter.setAttribute("data-slot", "split-gutter");
     gutter.setAttribute("aria-disabled", el.getAttribute("data-locked") === "true");
@@ -8120,7 +8131,7 @@ function split_default(Alpine) {
         }
       },
       setGutter(last) {
-        if (this.hidden || last) {
+        if (this.hidden || gutterless || last) {
           gutter.remove();
         } else if (!gutter.parentElement) {
           el.after(gutter);
@@ -8234,7 +8245,10 @@ function split_default(Alpine) {
     };
     const observer = new MutationObserver((mutations) => {
       mutations.forEach((mutation) => {
-        if (mutation.attributeName === "data-hidden") {
+        if (mutation.attributeName === "data-gutterless") {
+          gutterless = el.getAttribute("data-gutterless") === "true";
+          split._h_split.gutterHidden();
+        } else if (mutation.attributeName === "data-hidden") {
           panel.hidden = el.getAttribute("data-hidden") === "true";
           if (panel.hidden) {
             el.classList.add("hidden");
@@ -8253,7 +8267,7 @@ function split_default(Alpine) {
         }
       });
     });
-    observer.observe(el, { attributes: true, attributeFilter: ["data-hidden", "data-locked", "data-collapse"] });
+    observer.observe(el, { attributes: true, attributeFilter: ["data-hidden", "data-locked", "data-collapse", "data-gutterless"] });
     cleanup(() => {
       gutter.remove();
       gutter.removeEventListener("pointerdown", drag);
@@ -8514,7 +8528,7 @@ function tabs_default(Alpine) {
     el.setAttribute("role", "tablist");
     el.setAttribute("data-slot", "tab-list");
   });
-  Alpine.directive("h-tab", (el, { original }) => {
+  Alpine.directive("h-tab", (el, { original: original2 }) => {
     el.classList.add(
       "cursor-pointer",
       "focus-visible:border-ring",
@@ -8561,8 +8575,8 @@ function tabs_default(Alpine) {
     );
     el.setAttribute("role", "tab");
     el.setAttribute("data-slot", "tab");
-    if (!el.hasAttribute("id")) throw new Error(`${original}: Tabs must have an id`);
-    if (!el.hasAttribute("aria-controls")) throw new Error(`${original}: aria-controls must be set to the tab-content id.`);
+    if (!el.hasAttribute("id")) throw new Error(`${original2}: Tabs must have an id`);
+    if (!el.hasAttribute("aria-controls")) throw new Error(`${original2}: aria-controls must be set to the tab-content id.`);
   });
   Alpine.directive("h-tab-action", (el) => {
     el.classList.add("cursor-pointer", "ml-auto", "rounded-md", "text-foreground", "hover:bg-secondary", "hover:text-secondary-foreground", "active:bg-secondary-active");
@@ -8596,13 +8610,13 @@ function tabs_default(Alpine) {
     el.setAttribute("role", "button");
     el.setAttribute("data-slot", "tab-list-action");
   });
-  Alpine.directive("h-tabs-content", (el, { original }) => {
+  Alpine.directive("h-tabs-content", (el, { original: original2 }) => {
     el.classList.add("flex-1", "outline-none");
     el.setAttribute("role", "tabpanel");
     el.setAttribute("tabindex", "0");
     el.setAttribute("data-slot", "tabs-content");
-    if (!el.hasAttribute("id")) throw new Error(`${original}: Tab content must have an id`);
-    if (!el.hasAttribute("aria-labelledby")) throw new Error(`${original}: aria-labelledby must be set to the tab id.`);
+    if (!el.hasAttribute("id")) throw new Error(`${original2}: Tab content must have an id`);
+    if (!el.hasAttribute("aria-labelledby")) throw new Error(`${original2}: aria-labelledby must be set to the tab id.`);
   });
 }
 
@@ -8995,13 +9009,13 @@ function timepicker_default(Alpine) {
       top.removeEventListener("click", el._h_timepicker.close);
     });
   });
-  Alpine.directive("h-time-picker-input", (el, { original }, { effect, cleanup, Alpine: Alpine2 }) => {
+  Alpine.directive("h-time-picker-input", (el, { original: original2 }, { effect, cleanup, Alpine: Alpine2 }) => {
     if (el.tagName !== "INPUT") {
-      throw new Error(`${original} must be a readonly input of type "text"`);
+      throw new Error(`${original2} must be a readonly input of type "text"`);
     }
     const timepicker = Alpine2.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_timepicker"));
     if (!timepicker) {
-      throw new Error(`${original} must be inside a time-picker element`);
+      throw new Error(`${original2} must be inside a time-picker element`);
     }
     timepicker._h_timepicker.focusInput = () => {
       el.focus();
@@ -9611,7 +9625,7 @@ function toolbar_default(Alpine) {
     el.setAttribute("data-slot", "toolbar-image");
   });
   Alpine.directive("h-toolbar-title", (el) => {
-    el.classList.add("text", "[[data-size=sm]_&]:text-sm", "[[data-size=md]_&]:text-sm", "first:pl-2", "font-medium", "whitespace-nowrap", "text-ellipsis", "overflow-hidden");
+    el.classList.add("text", "[[data-size=sm]_&]:text-sm", "[[data-size=md]_&]:text-sm", "first-of-type:pl-2", "font-medium", "whitespace-nowrap", "text-ellipsis", "overflow-hidden");
     el.setAttribute("data-slot", "toolbar-title");
   });
   Alpine.directive("h-toolbar-spacer", (el) => {
@@ -9650,7 +9664,7 @@ function tooltip_default(Alpine) {
       el.removeEventListener("pointerleave", handler);
     });
   });
-  Alpine.directive("h-tooltip", (el, { original }, { effect }) => {
+  Alpine.directive("h-tooltip", (el, { original: original2 }, { effect }) => {
     const tooltip = (() => {
       let sibling = el.previousElementSibling;
       while (sibling && !sibling.hasOwnProperty("_tooltip")) {
@@ -9659,7 +9673,7 @@ function tooltip_default(Alpine) {
       return sibling;
     })();
     if (!tooltip) {
-      throw new Error(`${original} must be placed after a tooltip trigger element`);
+      throw new Error(`${original2} must be placed after a tooltip trigger element`);
     }
     el.classList.add("absolute", "bg-foreground", "text-background", "z-50", "w-fit", "rounded-md", "px-3", "py-1.5", "text-xs", "text-balance");
     el.setAttribute("data-slot", "tooltip");
@@ -9865,9 +9879,9 @@ function tree_default(Alpine) {
       });
     }
   });
-  Alpine.directive("h-tree-button", (el, { original }, { effect }) => {
+  Alpine.directive("h-tree-button", (el, { original: original2 }, { effect }) => {
     const treeItem = Alpine.findClosest(el.parentElement, (parent) => parent.hasOwnProperty("_h_tree_item"));
-    if (!treeItem) throw new Error(`${original} must be inside a tree item`);
+    if (!treeItem) throw new Error(`${original2} must be inside a tree item`);
     el.classList.add(
       "flex",
       "w-full",
@@ -9930,7 +9944,7 @@ function tree_default(Alpine) {
 }
 
 // package.json
-var version = "1.4.1";
+var version = "1.5.0";
 
 // src/utils/breakpoint-listener.js
 function getBreakpointListener(handler, breakpoint = 768) {
@@ -10010,6 +10024,12 @@ var getColorScheme = () => {
   }
   return "light";
 };
+var getSystemColorScheme = () => {
+  if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) {
+    return "dark";
+  }
+  return "light";
+};
 var addColorSchemeListener = (callback) => {
   callbacks.push(callback);
 };
@@ -10035,9 +10055,53 @@ function focus_default(Alpine) {
   });
 }
 
+// src/utils/include.js
+function include_default(Alpine) {
+  Alpine.directive("h-include", (el, { modifiers, expression }, { evaluateLater, effect }) => {
+    const getUrl = evaluateLater(expression);
+    function getHtml(url) {
+      const parsed = new URL(url, window.location.origin);
+      if (parsed.origin === window.location.origin) {
+        fetch(url).then((response) => {
+          if (response.status === 200) return response.text();
+          throw response;
+        }).then((content) => {
+          if (modifiers.includes("js")) {
+            const container = document.createElement("div");
+            container.innerHTML = content;
+            let staticScript = container.querySelector("script");
+            const script = document.createElement("script");
+            for (let a = 0; a < staticScript.attributes.length; a++) {
+              script.setAttribute(staticScript.attributes[a].name, staticScript.attributes[a].value);
+            }
+            script.appendChild(document.createTextNode(staticScript.innerHTML));
+            staticScript.remove();
+            while (container.childNodes.length > 0) {
+              el.appendChild(container.childNodes[0]);
+            }
+            el.appendChild(script);
+          } else {
+            el.innerHTML = content;
+          }
+        }).catch((response) => {
+          console.error(response);
+        });
+      } else {
+        throw new Error(`${original}: external requests not allowed`);
+      }
+    }
+    effect(() => {
+      getUrl((url) => {
+        if (url) getHtml(url);
+        else el.innerHTML = "";
+      });
+    });
+  }).before("bind");
+}
+
 // src/utils/template.js
 function template_default(Alpine) {
-  Alpine.directive("h-template", (el, { original, expression }, { evaluate: evaluate2, Alpine: Alpine2, cleanup }) => {
+  Alpine.directive("h-template", (el, { original: original2, expression }, { evaluate: evaluate2, Alpine: Alpine2, cleanup }) => {
     if (el.hasAttribute(Alpine2.prefixed("data"))) {
       const template = evaluate2(expression);
       const clone = template.content.cloneNode(true).firstElementChild;
@@ -10051,7 +10115,7 @@ function template_default(Alpine) {
         clone.remove();
       });
     } else {
-      console.error(`${original}: ${Alpine2.prefixed("data")} directive is missing`);
+      console.error(`${original2}: ${Alpine2.prefixed("data")} directive is missing`);
     }
   });
 }
@@ -10072,6 +10136,7 @@ var registerComponents = (registerPlugin) => {
   registerPlugin(fieldset_default);
   registerPlugin(focus_default);
   registerPlugin(icon_default);
+  registerPlugin(include_default);
   registerPlugin(info_page_default);
   registerPlugin(input_default);
   registerPlugin(label_default);
@@ -10118,6 +10183,7 @@ export {
   fieldset_default as Fieldset,
   focus_default as Focus,
   icon_default as Icon,
+  include_default as Include,
   info_page_default as InfoPage,
   input_default as Input,
   label_default as Label,
@@ -10151,6 +10217,7 @@ export {
   module_default as default,
   getBreakpointListener,
   getColorScheme,
+  getSystemColorScheme,
   registerComponents,
   removeColorSchemeListener,
   setColorScheme,