@jsenv/dom 0.8.4 → 0.8.6

package/dist/jsenv_dom.js

@@ -92,16 +92,17 @@ const getElementSignature = (element) => {
     }
     return `[${functionLabel}]`;
   }
-  if (element.nodeType === Node.TEXT_NODE) {
-    return `#text(${getElementSignature(element.nodeValue)})`;
-  }
   if (element.props) {
     const type = element.type;
+    const elementName = typeof type === "function" ? type.name : type;
     const id = element.props.id;
     if (id) {
-      return `<${type} id="${id}" />`;
+      return `<${elementName} id="${id}" />`;
     }
-    return `<${type} />`;
+    return `<${elementName} />`;
+  }
+  if (element.nodeType === Node.TEXT_NODE) {
+    return `#text(${getElementSignature(element.nodeValue)})`;
   }
 
   const tagName = element.tagName.toLowerCase();
@@ -399,6 +400,14 @@ const parseCSSColor = (color, element) => {
   if (typeof color !== "string") {
     return color;
   }
+  if (color === "inherit") {
+    if (!element) {
+      return color;
+    }
+    const computedStyle = getComputedStyle(element);
+    const resolvedColor = parseCSSColor(computedStyle.color, element);
+    return resolvedColor;
+  }
   let resolvedColor = color;
 
   // Handle light-dark() function
@@ -1964,6 +1973,7 @@ const getUnit = (value) => {
 };
 // Check if value already has a unit
 const isUnitless = (value) => getUnit(value) === "";
+const hasCSSSizeUnit = (value) => cssSizeUnitSet.has(getUnit(value));
 
 // url(
 // linear-gradient(
@@ -9371,6 +9381,7 @@ const pickPositionRelativeTo = (
   {
     alignToViewportEdgeWhenTargetNearEdge = 0,
     minLeft = 0,
+    positionPreference,
     forcePosition,
   } = {},
 ) => {
@@ -9451,8 +9462,12 @@ const pickPositionRelativeTo = (
       position = forcePosition;
       break determine_position;
     }
-    const preferredPosition = element.getAttribute("data-position");
+    const elementPreferredPosition = element.getAttribute("data-position");
     const minContentVisibilityRatio = 0.6; // 60% minimum visibility to keep position
+
+    // Check positionPreference parameter first, then element attribute
+    const preferredPosition = positionPreference || elementPreferredPosition;
+
     if (preferredPosition) {
       // Element has a preferred position - try to keep it unless we really struggle
       const visibleRatio =
@@ -12611,4 +12626,4 @@ const useResizeStatus = (elementRef, { as = "number" } = {}) => {
   };
 };
 
-export { EASING, activeElementSignal, addActiveElementEffect, addAttributeEffect, allowWheelThrough, appendStyles, canInterceptKeys, captureScrollState, createBackgroundColorTransition, createBackgroundTransition, createBorderRadiusTransition, createBorderTransition, createDragGestureController, createDragToMoveGestureController, createGroupTransitionController, createHeightTransition, createIterableWeakSet, createOpacityTransition, createPubSub, createStyleController, createTimelineTransition, createTransition, createTranslateXTransition, createValueEffect, createWidthTransition, cubicBezier, dragAfterThreshold, elementIsFocusable, elementIsVisibleForFocus, elementIsVisuallyVisible, findAfter, findAncestor, findBefore, findDescendant, findFocusable, getAvailableHeight, getAvailableWidth, getBackground, getBackgroundColor, getBorder, getBorderRadius, getBorderSizes, getContrastRatio, getDefaultStyles, getDragCoordinates, getDropTargetInfo, getElementSignature, getFirstVisuallyVisibleAncestor, getFocusVisibilityInfo, getHeight, getHeightWithoutTransition, getInnerHeight, getInnerWidth, getLuminance, getMarginSizes, getMaxHeight, getMaxWidth, getMinHeight, getMinWidth, getOpacity, getOpacityWithoutTransition, getPaddingSizes, getPositionedParent, getPreferedColorScheme, getScrollBox, getScrollContainer, getScrollContainerSet, getScrollRelativeRect, getSelfAndAncestorScrolls, getStyle, getTranslateX, getTranslateXWithoutTransition, getTranslateY, getVisuallyVisibleInfo, getWidth, getWidthWithoutTransition, initFlexDetailsSet, initFocusGroup, initPositionSticky, isScrollable, measureScrollbar, mergeOneStyle, mergeTwoStyles, normalizeStyles, parseStyle, pickLightOrDark, pickPositionRelativeTo, prefersDarkColors, prefersLightColors, preventFocusNav, preventFocusNavViaKeyboard, preventIntermediateScrollbar, resolveCSSColor, resolveCSSSize, resolveColorLuminance, setAttribute, setAttributes, setStyles, startDragToResizeGesture, stickyAsRelativeCoords, stringifyStyle, trapFocusInside, trapScrollInside, useActiveElement, useAvailableHeight, useAvailableWidth, useMaxHeight, useMaxWidth, useResizeStatus, visibleRectEffect };
+export { EASING, activeElementSignal, addActiveElementEffect, addAttributeEffect, allowWheelThrough, appendStyles, canInterceptKeys, captureScrollState, createBackgroundColorTransition, createBackgroundTransition, createBorderRadiusTransition, createBorderTransition, createDragGestureController, createDragToMoveGestureController, createGroupTransitionController, createHeightTransition, createIterableWeakSet, createOpacityTransition, createPubSub, createStyleController, createTimelineTransition, createTransition, createTranslateXTransition, createValueEffect, createWidthTransition, cubicBezier, dragAfterThreshold, elementIsFocusable, elementIsVisibleForFocus, elementIsVisuallyVisible, findAfter, findAncestor, findBefore, findDescendant, findFocusable, getAvailableHeight, getAvailableWidth, getBackground, getBackgroundColor, getBorder, getBorderRadius, getBorderSizes, getContrastRatio, getDefaultStyles, getDragCoordinates, getDropTargetInfo, getElementSignature, getFirstVisuallyVisibleAncestor, getFocusVisibilityInfo, getHeight, getHeightWithoutTransition, getInnerHeight, getInnerWidth, getLuminance, getMarginSizes, getMaxHeight, getMaxWidth, getMinHeight, getMinWidth, getOpacity, getOpacityWithoutTransition, getPaddingSizes, getPositionedParent, getPreferedColorScheme, getScrollBox, getScrollContainer, getScrollContainerSet, getScrollRelativeRect, getSelfAndAncestorScrolls, getStyle, getTranslateX, getTranslateXWithoutTransition, getTranslateY, getVisuallyVisibleInfo, getWidth, getWidthWithoutTransition, hasCSSSizeUnit, initFlexDetailsSet, initFocusGroup, initPositionSticky, isScrollable, measureScrollbar, mergeOneStyle, mergeTwoStyles, normalizeStyles, parseStyle, pickLightOrDark, pickPositionRelativeTo, prefersDarkColors, prefersLightColors, preventFocusNav, preventFocusNavViaKeyboard, preventIntermediateScrollbar, resolveCSSColor, resolveCSSSize, resolveColorLuminance, setAttribute, setAttributes, setStyles, startDragToResizeGesture, stickyAsRelativeCoords, stringifyStyle, trapFocusInside, trapScrollInside, useActiveElement, useAvailableHeight, useAvailableWidth, useMaxHeight, useMaxWidth, useResizeStatus, visibleRectEffect };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/dom",
-  "version": "0.8.4",
+  "version": "0.8.6",
   "description": "DOM utilities for writing frontend code",
   "repository": {
     "type": "git",