@ai-matrx/design-system 0.61.6 → 0.61.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -681,12 +681,33 @@ function describe(el) {
681
681
  const t = (el.textContent ?? "").replace(/\s+/g, " ").trim();
682
682
  return t.length > 60 ? `${t.slice(0, 57)}\u2026` : t;
683
683
  }
684
+ var INTERACTIVE = 'a[href],button,[role="tab"],[role="button"],[role="radio"],[role="link"],[role="menuitem"],[role="option"]';
685
+ function ownTextNodes(el, view) {
686
+ const out = [];
687
+ const walker = el.ownerDocument.createTreeWalker(
688
+ el,
689
+ 4
690
+ /* NodeFilter.SHOW_TEXT */
691
+ );
692
+ for (let n = walker.nextNode(); n; n = walker.nextNode()) {
693
+ let offFlow = false;
694
+ for (let p = n.parentElement; p && p !== el; p = p.parentElement) {
695
+ const pcs = view.getComputedStyle(p);
696
+ if (pcs.position === "absolute" || pcs.position === "fixed" || pcs.display === "none" || p.matches(INTERACTIVE)) {
697
+ offFlow = true;
698
+ break;
699
+ }
700
+ }
701
+ if (!offFlow) out.push(n);
702
+ }
703
+ return out;
704
+ }
684
705
  function findPillViolation(el, maxWidth = PILL_MAX_WIDTH_PX) {
685
706
  if (el.getAttribute("data-matrx-pill") === "off") return null;
686
- const text = (el.textContent ?? "").trim();
687
- if (!text) return null;
688
707
  const view = el.ownerDocument.defaultView;
689
708
  if (!view) return null;
709
+ const own = ownTextNodes(el, view);
710
+ if (!own.some((t) => (t.textContent ?? "").trim())) return null;
690
711
  const rect = el.getBoundingClientRect();
691
712
  if (rect.width === 0 || rect.height === 0) return null;
692
713
  const cs = view.getComputedStyle(el);
@@ -694,17 +715,21 @@ function findPillViolation(el, maxWidth = PILL_MAX_WIDTH_PX) {
694
715
  if (rect.width > maxWidth + 0.5) {
695
716
  return `pill is ${Math.round(rect.width)}px wide (budget ${maxWidth}px) holding "${describe(el)}" \u2014 a pill holds a short label: clamp it (Badge, or truncate + max-w + title) or render a list row.`;
696
717
  }
697
- const lines = lineCount(el, cs, rect.height);
718
+ const lines = lineCount(el, own, cs, rect.height);
698
719
  if (lines > 1) {
699
720
  return `pill wraps to ${lines} lines holding "${describe(el)}" \u2014 a pill is one line: clamp it (Badge, or truncate + max-w + title) or render a list row.`;
700
721
  }
701
722
  return null;
702
723
  }
703
- function lineCount(el, cs, height) {
724
+ function lineCount(el, own, cs, height) {
704
725
  const range = el.ownerDocument.createRange?.();
705
726
  if (range && typeof range.getClientRects === "function") {
706
- range.selectNodeContents(el);
707
- const rects = Array.from(range.getClientRects()).filter((r) => r.width > 0 && r.height > 0);
727
+ const rects = [];
728
+ for (const node of own) {
729
+ if (!(node.textContent ?? "").trim()) continue;
730
+ range.selectNodeContents(node);
731
+ rects.push(...Array.from(range.getClientRects()).filter((r) => r.width > 0 && r.height > 0));
732
+ }
708
733
  range.detach?.();
709
734
  if (rects.length) {
710
735
  const mids = [];