@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/CHANGELOG.md +29 -5
- package/dist/controls.cjs +2 -1
- package/dist/controls.cjs.map +1 -1
- package/dist/controls.css +22 -7
- package/dist/controls.d.cts +3 -0
- package/dist/controls.d.ts +3 -0
- package/dist/controls.js +2 -1
- package/dist/controls.js.map +1 -1
- package/dist/index.cjs +31 -6
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +31 -6
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
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
|
-
|
|
707
|
-
const
|
|
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 = [];
|