pne-ui 4.3.0 → 4.3.2

package/esm/component/table/measureNaturalWidth.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Width an element needs to lay its content out on a single row.
+ *
+ * This is deliberately *not* the measurement that made the control bands flap
+ * before. That code measured the elements it had just laid out, so the answer
+ * described the space the band had already been given and every fit check was
+ * self-confirming; with two such bands measuring each other, fractional CSS
+ * pixels were enough to start an endless ResizeObserver cycle.
+ *
+ * A natural width does not depend on the space offered: it is a property of the
+ * content alone. A layout decision taken from it therefore cannot feed back into
+ * the measurement, which is what lets the bands place their rows from CSS and
+ * measure only when their content changes - never on resize.
+ *
+ * The element is measured in place, by briefly taking it out of flow rather than
+ * by cloning it into `document.body`. A clone leaves inherited styles and
+ * ancestor selectors behind, so it measures a different element than the one on
+ * screen; taken out of flow, the element keeps its own cascade. Callers must run
+ * this inside `useLayoutEffect`, where the swap happens before paint.
+ */
+export declare const measureNaturalWidth: (element: HTMLElement | null | undefined) => number;

package/esm/component/table/measureNaturalWidth.js

@@ -0,0 +1,38 @@
+/**
+ * Width an element needs to lay its content out on a single row.
+ *
+ * This is deliberately *not* the measurement that made the control bands flap
+ * before. That code measured the elements it had just laid out, so the answer
+ * described the space the band had already been given and every fit check was
+ * self-confirming; with two such bands measuring each other, fractional CSS
+ * pixels were enough to start an endless ResizeObserver cycle.
+ *
+ * A natural width does not depend on the space offered: it is a property of the
+ * content alone. A layout decision taken from it therefore cannot feed back into
+ * the measurement, which is what lets the bands place their rows from CSS and
+ * measure only when their content changes - never on resize.
+ *
+ * The element is measured in place, by briefly taking it out of flow rather than
+ * by cloning it into `document.body`. A clone leaves inherited styles and
+ * ancestor selectors behind, so it measures a different element than the one on
+ * screen; taken out of flow, the element keeps its own cascade. Callers must run
+ * this inside `useLayoutEffect`, where the swap happens before paint.
+ */
+export const measureNaturalWidth = (element) => {
+    if (!element) {
+        return 0;
+    }
+    const savedCssText = element.style.cssText;
+    Object.assign(element.style, {
+        left: '-99999px',
+        maxWidth: 'none',
+        position: 'fixed',
+        top: '0',
+        visibility: 'hidden',
+        width: 'max-content',
+    });
+    const naturalWidth = element.getBoundingClientRect().width;
+    element.style.cssText = savedCssText;
+    return naturalWidth;
+};
+//# sourceMappingURL=measureNaturalWidth.js.map

package/esm/component/table/measureNaturalWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"measureNaturalWidth.js","sourceRoot":"","sources":["../../../src/component/table/measureNaturalWidth.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,OAAuC,EAAU,EAAE;IACnF,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,OAAO,CAAC,CAAA;IACZ,CAAC;IAED,MAAM,YAAY,GAAG,OAAO,CAAC,KAAK,CAAC,OAAO,CAAA;IAE1C,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;QACzB,IAAI,EAAE,UAAU;QAChB,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,OAAO;QACjB,GAAG,EAAE,GAAG;QACR,UAAU,EAAE,QAAQ;QACpB,KAAK,EAAE,aAAa;KACvB,CAAC,CAAA;IAEF,MAAM,YAAY,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAA;IAE1D,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,YAAY,CAAA;IAEpC,OAAO,YAAY,CAAA;AACvB,CAAC,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pne-ui",
-    "version": "4.3.0",
+    "version": "4.3.2",
     "description": "",
     "repository": {
         "type": "git",

package/cjs/component/table/tableLayoutMeasurement.d.ts

@@ -1,7 +0,0 @@
-/**
- * CSSOM integer measurements such as clientWidth/scrollWidth can disagree with
- * fractional DOMRect widths by less than one CSS pixel. Treat that difference
- * as fitting so nested responsive controls cannot oscillate at a rounding edge.
- */
-export declare const TABLE_LAYOUT_MEASUREMENT_TOLERANCE = 1;
-export declare const measuredLayoutWidthFits: (requiredWidth: number, availableWidth: number) => boolean;

package/cjs/component/table/tableLayoutMeasurement.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.measuredLayoutWidthFits = exports.TABLE_LAYOUT_MEASUREMENT_TOLERANCE = void 0;
-/**
- * CSSOM integer measurements such as clientWidth/scrollWidth can disagree with
- * fractional DOMRect widths by less than one CSS pixel. Treat that difference
- * as fitting so nested responsive controls cannot oscillate at a rounding edge.
- */
-exports.TABLE_LAYOUT_MEASUREMENT_TOLERANCE = 1;
-const measuredLayoutWidthFits = (requiredWidth, availableWidth) => requiredWidth < availableWidth + exports.TABLE_LAYOUT_MEASUREMENT_TOLERANCE;
-exports.measuredLayoutWidthFits = measuredLayoutWidthFits;
-//# sourceMappingURL=tableLayoutMeasurement.js.map

package/cjs/component/table/tableLayoutMeasurement.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tableLayoutMeasurement.js","sourceRoot":"","sources":["../../../src/component/table/tableLayoutMeasurement.ts"],"names":[],"mappings":";;;AAAA;;;;GAIG;AACU,QAAA,kCAAkC,GAAG,CAAC,CAAA;AAE5C,MAAM,uBAAuB,GAAG,CACnC,aAAqB,EACrB,cAAsB,EACf,EAAE,CAAC,aAAa,GAAG,cAAc,GAAG,0CAAkC,CAAA;AAHpE,QAAA,uBAAuB,2BAG6C"}

package/esm/component/table/tableLayoutMeasurement.d.ts

@@ -1,7 +0,0 @@
-/**
- * CSSOM integer measurements such as clientWidth/scrollWidth can disagree with
- * fractional DOMRect widths by less than one CSS pixel. Treat that difference
- * as fitting so nested responsive controls cannot oscillate at a rounding edge.
- */
-export declare const TABLE_LAYOUT_MEASUREMENT_TOLERANCE = 1;
-export declare const measuredLayoutWidthFits: (requiredWidth: number, availableWidth: number) => boolean;

package/esm/component/table/tableLayoutMeasurement.js

@@ -1,8 +0,0 @@
-/**
- * CSSOM integer measurements such as clientWidth/scrollWidth can disagree with
- * fractional DOMRect widths by less than one CSS pixel. Treat that difference
- * as fitting so nested responsive controls cannot oscillate at a rounding edge.
- */
-export const TABLE_LAYOUT_MEASUREMENT_TOLERANCE = 1;
-export const measuredLayoutWidthFits = (requiredWidth, availableWidth) => requiredWidth < availableWidth + TABLE_LAYOUT_MEASUREMENT_TOLERANCE;
-//# sourceMappingURL=tableLayoutMeasurement.js.map

package/esm/component/table/tableLayoutMeasurement.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tableLayoutMeasurement.js","sourceRoot":"","sources":["../../../src/component/table/tableLayoutMeasurement.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAAC,CAAA;AAEnD,MAAM,CAAC,MAAM,uBAAuB,GAAG,CACnC,aAAqB,EACrB,cAAsB,EACf,EAAE,CAAC,aAAa,GAAG,cAAc,GAAG,kCAAkC,CAAA"}