@codbex/harmonia 1.4.0 → 1.4.2

package/dist/harmonia.esm.js

@@ -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;
@@ -7377,7 +7382,7 @@ function sidebar_default(Alpine) {
     el.setAttribute("data-slot", "sidebar-header");
   });
   Alpine.directive("h-sidebar-content", (el) => {
-    el.classList.add("vbox", "min-h-0", "flex-1", "gap-2", "overflow-auto", "group-data-[collapsed=true]/sidebar:overflow-hidden");
+    el.classList.add("vbox", "min-h-0", "flex-1", "overflow-auto", "scrollbar-none");
     el.setAttribute("data-slot", "sidebar-content");
   });
   Alpine.directive("h-sidebar-group", (el, { expression, modifiers }, { effect, evaluate: evaluate2, evaluateLater, Alpine: Alpine2 }) => {
@@ -7701,13 +7706,16 @@ function sidebar_default(Alpine) {
   });
   Alpine.directive("h-sidebar-menu-skeleton", (el, { modifiers }) => {
     el.classList.add("flex", "h-8", "items-center", "gap-2", "rounded-md", "px-2");
+    const skeleton = document.createElement("div");
+    skeleton.classList.add("h-4", "flex-1", "bg-sidebar-secondary", "animate-pulse", "rounded-md");
     if (modifiers.includes("icon")) {
+      skeleton.classList.add("group-data-[collapsed=true]/sidebar:!hidden");
       const icon = document.createElement("div");
       icon.classList.add("size-4", "rounded-md", "bg-sidebar-secondary", "animate-pulse", "rounded-md");
       el.appendChild(icon);
+    } else {
+      skeleton.classList.add("group-data-[collapsed=true]/sidebar:!w-4", "group-data-[collapsed=true]/sidebar:!max-w-4");
     }
-    const skeleton = document.createElement("div");
-    skeleton.classList.add("h-4", "flex-1", "bg-sidebar-secondary", "animate-pulse", "rounded-md");
     skeleton.style.maxWidth = `${Math.floor(Math.random() * 40) + 50}%`;
     el.appendChild(skeleton);
     el.setAttribute("data-slot", "sidebar-menu-skeleton");
@@ -7958,6 +7966,10 @@ function split_default(Alpine) {
         refreshGutters();
         queueLayout();
       },
+      gutterHidden() {
+        refreshGutters();
+        queueLayout();
+      },
       panelChange() {
         queueLayout();
       },
@@ -7996,6 +8008,7 @@ function split_default(Alpine) {
     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");
@@ -8117,7 +8130,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);
@@ -8231,7 +8244,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");
@@ -8250,7 +8266,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);
@@ -9608,7 +9624,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) => {
@@ -9927,7 +9943,7 @@ function tree_default(Alpine) {
 }
 
 // package.json
-var version = "1.4.0";
+var version = "1.4.2";
 
 // src/utils/breakpoint-listener.js
 function getBreakpointListener(handler, breakpoint = 768) {