taffy-js 0.2.11 → 0.2.12

package/pkg/taffy_wasm.js

@@ -245,8 +245,9 @@ const TaffyTreeFinalization = (typeof FinalizationRegistry === 'undefined')
  *
  * @example
  * ```typescript
- * import { AlignContent, FlexWrap } from 'taffy-js';
+ * import { Style, AlignContent, FlexWrap } from 'taffy-js';
  *
+ * const style = new Style();
  * style.flexWrap = FlexWrap.Wrap;
  * style.alignContent = AlignContent.SpaceBetween;  // Distribute lines evenly
  * ```
@@ -299,8 +300,9 @@ export const AlignContent = Object.freeze({
  *
  * @example
  * ```typescript
- * import { AlignItems } from 'taffy-js';
+ * import { Style, AlignItems } from 'taffy-js';
  *
+ * const style = new Style();
  * style.alignItems = AlignItems.Center;   // Center items on cross axis
  * style.alignItems = AlignItems.Stretch;  // Stretch items to fill container
  * ```
@@ -345,8 +347,9 @@ export const AlignItems = Object.freeze({
  *
  * @example
  * ```typescript
- * import { AlignSelf } from 'taffy-js';
+ * import { Style, AlignSelf } from 'taffy-js';
  *
+ * const style = new Style();
  * style.alignSelf = AlignSelf.Auto;    // Use parent's align-items
  * style.alignSelf = AlignSelf.Center;  // Override to center this item
  * ```
@@ -395,8 +398,9 @@ export const AlignSelf = Object.freeze({
  *
  * @example
  * ```typescript
- * import { BoxSizing } from 'taffy-js';
+ * import { Style, BoxSizing } from 'taffy-js';
  *
+ * const style = new Style();
  * style.boxSizing = BoxSizing.BorderBox;   // Size includes padding and border
  * style.boxSizing = BoxSizing.ContentBox;  // Size is content only
  * ```
@@ -421,8 +425,9 @@ export const BoxSizing = Object.freeze({
  *
  * @example
  * ```typescript
- * import { Display } from 'taffy-js';
+ * import { Style, Display } from 'taffy-js';
  *
+ * const style = new Style();
  * style.display = Display.Flex;  // Enable flexbox layout
  * style.display = Display.Grid;  // Enable grid layout
  * style.display = Display.None;  // Hide element from layout
@@ -456,8 +461,9 @@ export const Display = Object.freeze({
  *
  * @example
  * ```typescript
- * import { FlexDirection } from 'taffy-js';
+ * import { Style, FlexDirection } from 'taffy-js';
  *
+ * const style = new Style();
  * style.flexDirection = FlexDirection.Row;     // Horizontal, left to right
  * style.flexDirection = FlexDirection.Column;  // Vertical, top to bottom
  * ```
@@ -490,8 +496,9 @@ export const FlexDirection = Object.freeze({
  *
  * @example
  * ```typescript
- * import { FlexWrap } from 'taffy-js';
+ * import { Style, FlexWrap } from 'taffy-js';
  *
+ * const style = new Style();
  * style.flexWrap = FlexWrap.NoWrap;  // All items on single line
  * style.flexWrap = FlexWrap.Wrap;    // Items wrap to new lines
  * ```
@@ -520,8 +527,9 @@ export const FlexWrap = Object.freeze({
  *
  * @example
  * ```typescript
- * import { GridAutoFlow } from 'taffy-js';
+ * import { Style, GridAutoFlow } from 'taffy-js';
  *
+ * const style = new Style();
  * style.gridAutoFlow = GridAutoFlow.Row;       // Fill rows first
  * style.gridAutoFlow = GridAutoFlow.Column;    // Fill columns first
  * style.gridAutoFlow = GridAutoFlow.RowDense;  // Fill rows, pack densely
@@ -555,8 +563,9 @@ export const GridAutoFlow = Object.freeze({
  *
  * @example
  * ```typescript
- * import { JustifyContent } from 'taffy-js';
+ * import { Style, JustifyContent } from 'taffy-js';
  *
+ * const style = new Style();
  * style.justifyContent = JustifyContent.Center;        // Center items
  * style.justifyContent = JustifyContent.SpaceBetween;  // Distribute evenly
  * ```
@@ -609,6 +618,11 @@ export const JustifyContent = Object.freeze({
  *
  * @example
  * ```typescript
+ * const tree = new TaffyTree();
+ * const rootId = tree.newLeaf(new Style());
+ * const node = rootId;
+ *
+ * tree.computeLayout(rootId, { width: 800, height: 600 });
  * const layout = tree.getLayout(node);
  *
  * console.log("Position:", layout.x, layout.y);
@@ -887,8 +901,9 @@ if (Symbol.dispose) Layout.prototype[Symbol.dispose] = Layout.prototype.free;
  *
  * @example
  * ```typescript
- * import { Overflow } from 'taffy-js';
+ * import { Style, Overflow } from 'taffy-js';
  *
+ * const style = new Style();
  * style.overflow = { x: Overflow.Hidden, y: Overflow.Scroll };
  * ```
  * @enum {0 | 1 | 2 | 3}
@@ -920,8 +935,9 @@ export const Overflow = Object.freeze({
  *
  * @example
  * ```typescript
- * import { Position } from 'taffy-js';
+ * import { Style, Position } from 'taffy-js';
  *
+ * const style = new Style();
  * style.position = Position.Relative;  // Normal document flow
  * style.position = Position.Absolute;  // Removed from flow, uses inset values
  * ```
@@ -1019,6 +1035,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.border = { left: 1, right: 1, top: 1, bottom: 1 };
      * ```
      * @param {Rect<LengthPercentage>} val
@@ -1033,6 +1050,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.margin = { left: 10, right: 10, top: 5, bottom: 5 };
      * ```
      * @param {Rect<LengthPercentageAuto>} val
@@ -1100,6 +1118,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Flex;
      * ```
      * @param {Display} val
@@ -1114,6 +1133,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.padding = { left: 20, right: 20, top: 10, bottom: 10 };
      * ```
      * @param {Rect<LengthPercentage>} val
@@ -1152,6 +1172,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
      * // CSS: grid-row: 1 / 3
      * style.gridRow = { start: 1, end: 3 };
@@ -1170,6 +1191,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.maxSize = { width: "auto", height: 500 };
      * ```
      * @param {Size<Dimension>} val
@@ -1184,6 +1206,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.minSize = { width: 100, height: "auto" };
      * ```
      * @param {Size<Dimension>} val
@@ -1198,6 +1221,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.overflow = { x: Overflow.Hidden, y: Overflow.Scroll };
      * ```
      * @param {Point<Overflow>} val
@@ -1213,6 +1237,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.position = Position.Absolute;
      * style.inset = { left: 10, top: 10, right: "auto", bottom: "auto" };
      * ```
@@ -1267,6 +1292,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.flexGrow = 2;
      * ```
      * @param {number} val
@@ -1282,6 +1308,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.flexWrap = FlexWrap.Wrap;
      * ```
      * @param {FlexWrap} val
@@ -1323,7 +1350,7 @@ export class Style {
      * Defines the size of implicitly created rows.
      *
      * @returns - An array of track sizing functions
-     * @returns {any}
+     * @returns {TrackSizingFunction[]}
      */
     get gridAutoRows() {
         const ret = wasm.style_gridAutoRows(this.__wbg_ptr);
@@ -1336,6 +1363,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.alignSelf = AlignSelf.Stretch;
      * ```
      * @param {AlignSelf | undefined} val
@@ -1350,6 +1378,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.boxSizing = BoxSizing.ContentBox;
      * ```
      * @param {BoxSizing} val
@@ -1364,6 +1393,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.flexBasis = 100;
      * ```
      * @param {Dimension} val
@@ -1378,6 +1408,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.textAlign = TextAlign.LegacyCenter;
      * ```
      * @param {TextAlign} val
@@ -1418,6 +1449,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.alignItems = AlignItems.Center;
      * ```
      * @param {AlignItems | undefined} val
@@ -1432,6 +1464,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.flexShrink = 2;
      * ```
      * @param {number} val
@@ -1446,6 +1479,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
      * // CSS: grid-column: 1 / 4
      * style.gridColumn = { start: 1, end: 4 };
@@ -1478,6 +1512,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.aspectRatio = 16 / 9;
      * ```
      * @param {number | undefined} val
@@ -1492,6 +1527,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.justifySelf = AlignSelf.End;
      * ```
      * @param {AlignSelf | undefined} val
@@ -1505,7 +1541,7 @@ export class Style {
      * Defines the size of implicitly created columns.
      *
      * @returns - An array of track sizing functions
-     * @returns {any}
+     * @returns {TrackSizingFunction[]}
      */
     get gridAutoColumns() {
         const ret = wasm.style_gridAutoColumns(this.__wbg_ptr);
@@ -1518,6 +1554,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.alignContent = AlignContent.SpaceBetween;
      * ```
      * @param {AlignContent | undefined} val
@@ -1541,6 +1578,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
      * style.justifyItems = AlignItems.Center;
      * ```
@@ -1553,10 +1591,9 @@ export class Style {
      * Gets the grid-template-rows property
      *
      * Defines the track sizing functions (heights) of the grid rows.
-     * Returns Taffy's native serialization format.
      *
      * @returns - An array of `GridTrack` values
-     * @returns {GridTrack[]}
+     * @returns {GridTemplateComponent[]}
      */
     get gridTemplateRows() {
         const ret = wasm.style_gridTemplateRows(this.__wbg_ptr);
@@ -1570,6 +1607,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.flexDirection = FlexDirection.Column;
      * ```
      * @param {FlexDirection} val
@@ -1584,6 +1622,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
      * style.gridAutoFlow = GridAutoFlow.Column;
      * ```
@@ -1599,10 +1638,11 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
-     * style.gridAutoRows = [{ min: "Auto", max: "Auto" }];
+     * style.gridAutoRows = [{ min: "auto", max: "auto" }];
      * ```
-     * @param {any} val
+     * @param {TrackSizingFunction[]} val
      */
     set gridAutoRows(val) {
         wasm.style_set_gridAutoRows(this.__wbg_ptr, val);
@@ -1613,7 +1653,7 @@ export class Style {
      * Defines named grid areas that can be referenced by grid items.
      *
      * @returns - An array of `GridArea` values
-     * @returns {GridArea[]}
+     * @returns {GridTemplateArea[]}
      */
     get gridTemplateAreas() {
         const ret = wasm.style_gridTemplateAreas(this.__wbg_ptr);
@@ -1626,6 +1666,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.justifyContent = JustifyContent.Center;
      * ```
      * @param {JustifyContent | undefined} val
@@ -1640,6 +1681,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.overflow = { x: Overflow.Scroll, y: Overflow.Scroll };
      * style.scrollbarWidth = 15;
      * ```
@@ -1663,7 +1705,7 @@ export class Style {
      * Defines the track sizing functions (widths) of the grid columns.
      *
      * @returns - An array of `GridTrack` values
-     * @returns {GridTrack[]}
+     * @returns {GridTemplateComponent[]}
      */
     get gridTemplateColumns() {
         const ret = wasm.style_gridTemplateColumns(this.__wbg_ptr);
@@ -1673,7 +1715,7 @@ export class Style {
      * Sets the grid-auto-columns property
      *
      * @param val - An array of track sizing functions for implicit columns
-     * @param {any} val
+     * @param {TrackSizingFunction[]} val
      */
     set gridAutoColumns(val) {
         wasm.style_set_gridAutoColumns(this.__wbg_ptr, val);
@@ -1681,18 +1723,8 @@ export class Style {
     /**
      * Sets the grid-template-rows property
      *
-     * @param val - An array of GridTrack objects (Taffy's serde format)
-     *
-     * @example
-     * ```typescript
-     * style.display = Display.Grid;
-     * // Simple: use Taffy's serde format
-     * style.gridTemplateRows = [
-     *   { type: "Single", value: { min: { Length: 100 }, max: { Length: 100 } } },
-     *   { type: "Single", value: { min: "Auto", max: { Fr: 1.0 } } }
-     * ];
-     * ```
-     * @param {GridTrack[]} val
+     * @param val - An array of GridTrack objects
+     * @param {GridTemplateComponent[]} val
      */
     set gridTemplateRows(val) {
         wasm.style_set_gridTemplateRows(this.__wbg_ptr, val);
@@ -1716,13 +1748,14 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
      * style.gridTemplateAreas = [
-     *   { name: "header", row_start: 1, row_end: 2, column_start: 1, column_end: 4 },
-     *   { name: "main", row_start: 2, row_end: 4, column_start: 2, column_end: 4 }
+     *   { name: "header", rowStart: 1, rowEnd: 2, columnStart: 1, columnEnd: 4 },
+     *   { name: "main", rowStart: 2, rowEnd: 4, columnStart: 2, columnEnd: 4 }
      * ];
      * ```
-     * @param {GridArea[]} val
+     * @param {GridTemplateArea[]} val
      */
     set gridTemplateAreas(val) {
         wasm.style_set_gridTemplateAreas(this.__wbg_ptr, val);
@@ -1734,14 +1767,15 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.display = Display.Grid;
      * style.gridTemplateColumns = [
-     *   { type: "Single", value: { min: { Length: 200 }, max: { Length: 200 } } },
-     *   { type: "Single", value: { min: "Auto", max: { Fr: 1.0 } } },
-     *   { type: "Single", value: { min: "Auto", max: { Fr: 1.0 } } }
+     *   { min: 200, max: 200 },
+     *   { min: "auto", max: "1fr" },
+     *   { min: "auto", max: "1fr" }
      * ];
      * ```
-     * @param {GridTrack[]} val
+     * @param {GridTemplateComponent[]} val
      */
     set gridTemplateColumns(val) {
         wasm.style_set_gridTemplateColumns(this.__wbg_ptr, val);
@@ -1765,6 +1799,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.gridTemplateRowNames = [["header-start"], ["header-end", "main-start"], ["main-end"]];
      * ```
      * @param {string[][]} val
@@ -1779,6 +1814,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.gridTemplateColumnNames = [["sidebar-start"], ["sidebar-end", "main-start"], ["main-end"]];
      * ```
      * @param {string[][]} val
@@ -1894,6 +1930,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.gap = { width: 10, height: 10 };
      * ```
      * @param {Size<LengthPercentage>} val
@@ -1967,6 +2004,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.size = { width: 200, height: "100%" };
      * ```
      * @param {Size<Dimension>} val
@@ -2008,6 +2046,7 @@ export class Style {
      *
      * @example
      * ```typescript
+     * const style = new Style();
      * style.position = Position.Absolute;
      * style.inset = { left: 0, top: 0, right: "auto", bottom: "auto" };
      * ```
@@ -2028,6 +2067,8 @@ if (Symbol.dispose) Style.prototype[Symbol.dispose] = Style.prototype.free;
  * @example
  * ```typescript
  * try {
+ *  const tree = new TaffyTree();
+ *  const node = tree.newLeaf(new Style());
  *  tree.remove(node);
  * } catch (e) {
  *   if (e instanceof TaffyError) {
@@ -2122,6 +2163,11 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const rootId = tree.newLeaf(new Style());
+     * const nodeId = rootId;
+     * const availableSpace = { width: 100, height: 100 };
+     *
      * // After updating text content
      * tree.setNodeContext(nodeId, { text: "Updated text" });
      * tree.markDirty(nodeId);
@@ -2145,6 +2191,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const rootId = tree.newLeaf(new Style());
      * tree.printTree(rootId);
      * // Output appears in browser console
      * ```
@@ -2164,6 +2212,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
      * const count: number = tree.childCount(parentId);
      * ```
      * @param {bigint} parent
@@ -2185,6 +2235,10 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const childId = tree.newLeaf(new Style());
+     * tree.addChild(parentId, childId);
      * tree.removeChild(parentId, childId);
      * ```
      * @param {bigint} parent
@@ -2210,6 +2264,11 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const child1 = tree.newLeaf(new Style());
+     * const child2 = tree.newLeaf(new Style());
+     * const child3 = tree.newLeaf(new Style());
      * const children = BigUint64Array.from([child1, child2, child3]);
      * tree.setChildren(parentId, children);
      * ```
@@ -2250,31 +2309,36 @@ export class TaffyTree {
      * to compute layouts for all nodes in the tree.
      *
      * @param node - The root node ID to compute layout for
-     * @param available_space - The available space constraints
+     * @param availableSpace - The available space constraints
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const rootId = tree.newLeaf(new Style());
+     *
      * // Fixed size container
-     * { width: 800, height: 600 }
+     * tree.computeLayout(rootId, { width: 800, height: 600 });
      *
      * // Flexible width, fixed height
-     * { width: "maxContent", height: 600 }
+     * tree.computeLayout(rootId, { width: "max-content", height: 600 });
      *
      * // Minimum content size
-     * { width: "minContent", height: "minContent" }
+     * tree.computeLayout(rootId, { width: "min-content", height: "min-content" });
      * ```
      *
      * @throws `TaffyError` if the node does not exist or available space is invalid
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const rootId = tree.newLeaf(new Style());
      * tree.computeLayout(rootId, { width: 800, height: 600 });
      * ```
      * @param {bigint} node
-     * @param {Size<AvailableSpace>} available_space
+     * @param {Size<AvailableSpace>} availableSpace
      */
-    computeLayout(node, available_space) {
-        const ret = wasm.taffytree_computeLayout(this.__wbg_ptr, node, available_space);
+    computeLayout(node, availableSpace) {
+        const ret = wasm.taffytree_computeLayout(this.__wbg_ptr, node, availableSpace);
         if (ret[1]) {
             throw takeFromExternrefTable0(ret[0]);
         }
@@ -2288,6 +2352,7 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
      * tree.enableRounding();
      * ```
      */
@@ -2303,6 +2368,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const node = tree.newLeaf(new Style());
      * tree.disableRounding();
      * const layout = tree.getLayout(node);
      * console.log(layout.x);
@@ -2320,6 +2387,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const nodeId = tree.newLeaf(new Style());
      * interface Context { text: string };
      * const context = tree.getNodeContext(nodeId) as Context | undefined;
      * if (context) {
@@ -2349,6 +2418,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const nodeId = tree.newLeaf(new Style());
      * interface Context { text: string };
      * tree.setNodeContext(nodeId, { text: "Updated text" } as Context);
      * ```
@@ -2368,6 +2439,7 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
      * const count: number = tree.totalNodeCount();
      * ```
      * @returns {number}
@@ -2388,6 +2460,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const nodeId = tree.newLeaf(new Style());
      * const layout: Layout = tree.unroundedLayout(nodeId);
      * console.log(`Exact width: ${layout.width}`);
      * ```
@@ -2413,6 +2487,7 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
      * const containerStyle = new Style();
      * containerStyle.display = Display.Flex;
      *
@@ -2450,6 +2525,10 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const childId = tree.newLeaf(new Style());
+     * tree.addChild(parentId, childId);
      * const firstChild: bigint = tree.getChildAtIndex(parentId, 0);
      * ```
      * @param {bigint} parent
@@ -2463,6 +2542,28 @@ export class TaffyTree {
         }
         return BigInt.asUintN(64, ret[0]);
     }
+    /**
+     * Gets detailed layout information for grid layouts
+     *
+     * @note
+     * This method is only available when the `detailed_layout_info`
+     * feature is enabled.
+     *
+     * @param node - The node ID
+     *
+     * @returns - Detailed grid info or "None" for non-grid nodes
+     *
+     * @throws `TaffyError` if the node does not exist
+     * @param {bigint} node
+     * @returns {any}
+     */
+    detailedLayoutInfo(node) {
+        const ret = wasm.taffytree_detailedLayoutInfo(this.__wbg_ptr, node);
+        if (ret[2]) {
+            throw takeFromExternrefTable0(ret[1]);
+        }
+        return takeFromExternrefTable0(ret[0]);
+    }
     /**
      * Gets a mutable reference to the context value for a node
      *
@@ -2493,6 +2594,9 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const childId = tree.newLeaf(new Style());
      * tree.insertChildAtIndex(parentId, 0, childId);
      * ```
      * @param {bigint} parent
@@ -2521,6 +2625,7 @@ export class TaffyTree {
      * ```typescript
      * interface TextContext { text: string; isBold: boolean; }
      *
+     * const tree = new TaffyTree();
      * const style = new Style();
      * const context: TextContext = { text: "Hello, World!", isBold: true };
      * const nodeId: bigint = tree.newLeafWithContext(style, context);
@@ -2549,6 +2654,10 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const childId = tree.newLeaf(new Style());
+     * tree.addChild(parentId, childId);
      * const removedId: bigint = tree.removeChildAtIndex(parentId, 0);
      * ```
      * @param {bigint} parent
@@ -2568,21 +2677,28 @@ export class TaffyTree {
      * Removes children from `start_index` (inclusive) to `end_index` (exclusive).
      *
      * @param parent - The parent node ID
-     * @param start_index - Start of range (inclusive)
-     * @param end_index - End of range (exclusive)
+     * @param startIndex - Start of range (inclusive)
+     * @param endIndex - End of range (exclusive)
      *
      * @throws `TaffyError` if the parent node does not exist or range is invalid
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const child1 = tree.newLeaf(new Style());
+     * const child2 = tree.newLeaf(new Style());
+     * const child3 = tree.newLeaf(new Style());
+     * tree.setChildren(parentId, BigUint64Array.from([child1, child2, child3]));
+     *
      * tree.removeChildrenRange(parentId, 1, 3);
      * ```
      * @param {bigint} parent
-     * @param {number} start_index
-     * @param {number} end_index
+     * @param {number} startIndex
+     * @param {number} endIndex
      */
-    removeChildrenRange(parent, start_index, end_index) {
-        const ret = wasm.taffytree_removeChildrenRange(this.__wbg_ptr, parent, start_index, end_index);
+    removeChildrenRange(parent, startIndex, endIndex) {
+        const ret = wasm.taffytree_removeChildrenRange(this.__wbg_ptr, parent, startIndex, endIndex);
         if (ret[1]) {
             throw takeFromExternrefTable0(ret[0]);
         }
@@ -2592,7 +2708,7 @@ export class TaffyTree {
      *
      * @param parent - The parent node ID
      * @param index - The index of the child to replace (0-based)
-     * @param new_child - The new child node ID
+     * @param newChild - The new child node ID
      *
      * @returns - The replaced (old) child ID (`bigint`)
      *
@@ -2600,15 +2716,23 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const oldChild = tree.newLeaf(new Style());
+     * const newChildId = tree.newLeaf(new Style());
+     * tree.addChild(parentId, oldChild);
+     * const child = tree.newLeaf(new Style()); // filler child at index 0 if needed, but index 1 implies 2 children
+     * tree.insertChildAtIndex(parentId, 0, child);
+     *
      * const oldChildId: bigint = tree.replaceChildAtIndex(parentId, 1, newChildId);
      * ```
      * @param {bigint} parent
      * @param {number} index
-     * @param {bigint} new_child
+     * @param {bigint} newChild
      * @returns {bigint}
      */
-    replaceChildAtIndex(parent, index, new_child) {
-        const ret = wasm.taffytree_replaceChildAtIndex(this.__wbg_ptr, parent, index, new_child);
+    replaceChildAtIndex(parent, index, newChild) {
+        const ret = wasm.taffytree_replaceChildAtIndex(this.__wbg_ptr, parent, index, newChild);
         if (ret[2]) {
             throw takeFromExternrefTable0(ret[1]);
         }
@@ -2622,19 +2746,24 @@ export class TaffyTree {
      * called for each leaf node that needs measurement.
      *
      * @param node - The root node ID to compute layout for
-     * @param available_space - The available space constraints
-     * @param measure_func - A function that measures leaf node content
+     * @param availableSpace - The available space constraints
+     * @param measureFunc - A function that measures leaf node content
      *
      * @throws `TaffyError` if the node does not exist or available space is invalid
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const rootId = tree.newLeaf(new Style());
+     *
+     * const measureText = (text: string, width: number) => ({ width: 0, height: 0 });
+     *
      * tree.computeLayoutWithMeasure(
      *   rootId,
-     *   { width: 800, height: "maxContent" },
+     *   { width: 800, height: "max-content" },
      *   (known, available, node, context, style) => {
      *     if (context?.text) {
-     *       const measured = measureText(context.text, available.width);
+     *       const measured = measureText(context.text, available.width as number);
      *       return { width: measured.width, height: measured.height };
      *     }
      *     return { width: 0, height: 0 };
@@ -2642,11 +2771,11 @@ export class TaffyTree {
      * );
      * ```
      * @param {bigint} node
-     * @param {Size<AvailableSpace>} available_space
-     * @param {MeasureFunction} measure_func
+     * @param {Size<AvailableSpace>} availableSpace
+     * @param {MeasureFunction} measureFunc
      */
-    computeLayoutWithMeasure(node, available_space, measure_func) {
-        const ret = wasm.taffytree_computeLayoutWithMeasure(this.__wbg_ptr, node, available_space, measure_func);
+    computeLayoutWithMeasure(node, availableSpace, measureFunc) {
+        const ret = wasm.taffytree_computeLayoutWithMeasure(this.__wbg_ptr, node, availableSpace, measureFunc);
         if (ret[1]) {
             throw takeFromExternrefTable0(ret[0]);
         }
@@ -2663,6 +2792,9 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const id1 = tree.newLeaf(new Style());
+     * const id2 = tree.newLeaf(new Style());
      * const nodes = BigUint64Array.from([id1, id2]);
      * const contexts = tree.getDisjointNodeContextMut(nodes);
      * ```
@@ -2705,6 +2837,7 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
      * tree.clear();
      * console.log(tree.totalNodeCount());
      * ```
@@ -2726,6 +2859,11 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const rootId = tree.newLeaf(new Style());
+     * const nodeId = rootId;
+     * const availableSpace = { width: 100, height: 100 };
+     *
      * if (tree.dirty(nodeId)) {
      *   tree.computeLayout(rootId, availableSpace);
      * }
@@ -2751,6 +2889,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const nodeId = tree.newLeaf(new Style());
      * const style: Style = tree.getStyle(nodeId);
      * console.log('Flex grow:', style.flexGrow);
      * ```
@@ -2778,6 +2918,12 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const style = new Style();
+     * style.size = { width: 100, height: 100 };
+     * const rootId = tree.newLeaf(style);
+     * const nodeId = rootId;
+     *
      * tree.computeLayout(rootId, { width: 800, height: 600 });
      * const layout: Layout = tree.getLayout(nodeId);
      * console.log(`Position: (${layout.x}, ${layout.y}), Size: ${layout.width}x${layout.height}`);
@@ -2801,7 +2947,11 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
-     * const parentId: bigint | undefined = tree.parent(childId);
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const childId = tree.newLeaf(new Style());
+     * tree.addChild(parentId, childId);
+     * const parent: bigint | undefined = tree.parent(childId);
      * ```
      * @param {bigint} child
      * @returns {bigint | undefined}
@@ -2824,6 +2974,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const nodeId = tree.newLeaf(new Style());
      * try {
      *   const removedId: bigint = tree.remove(nodeId);
      * } catch (e) {
@@ -2851,6 +3003,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
      * const children: BigUint64Array = tree.children(parentId);
      * ```
      * @param {bigint} parent
@@ -2877,6 +3031,7 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
      * const style = new Style();
      * style.size = { width: 100, height: 50 };
      * const nodeId: bigint = tree.newLeaf(style);
@@ -2904,6 +3059,9 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const parentId = tree.newLeaf(new Style());
+     * const childId = tree.newLeaf(new Style());
      * tree.addChild(parentId, childId);
      * ```
      * @param {bigint} parent
@@ -2928,6 +3086,8 @@ export class TaffyTree {
      *
      * @example
      * ```typescript
+     * const tree = new TaffyTree();
+     * const nodeId = tree.newLeaf(new Style());
      * const newStyle = new Style();
      * newStyle.flexGrow = 2;
      * tree.setStyle(nodeId, newStyle);
@@ -2953,8 +3113,9 @@ if (Symbol.dispose) TaffyTree.prototype[Symbol.dispose] = TaffyTree.prototype.fr
  *
  * @example
  * ```typescript
- * import { TextAlign } from 'taffy-js';
+ * import { Style, TextAlign } from 'taffy-js';
  *
+ * const style = new Style();
  * style.textAlign = TextAlign.LegacyCenter;  // Center block children
  * ```
  * @enum {0 | 1 | 2 | 3}
@@ -3067,10 +3228,6 @@ function __wbg_get_imports() {
         const ret = typeof(val) === 'object' && val !== null;
         return ret;
     };
-    imports.wbg.__wbg___wbindgen_is_string_704ef9c8fc131030 = function(arg0) {
-        const ret = typeof(arg0) === 'string';
-        return ret;
-    };
     imports.wbg.__wbg___wbindgen_is_undefined_f6b95eab589e0269 = function(arg0) {
         const ret = arg0 === undefined;
         return ret;
@@ -3189,7 +3346,7 @@ function __wbg_get_imports() {
         const ret = arg0.length;
         return ret;
     };
-    imports.wbg.__wbg_log_23225a7078e26a12 = function(arg0, arg1) {
+    imports.wbg.__wbg_log_725a3bd25b473a36 = function(arg0, arg1) {
         console.log(getStringFromWasm0(arg0, arg1));
     };
     imports.wbg.__wbg_new_1ba21ce319a06297 = function() {
@@ -3208,10 +3365,6 @@ function __wbg_get_imports() {
         const ret = new Error();
         return ret;
     };
-    imports.wbg.__wbg_new_b546ae120718850e = function() {
-        const ret = new Map();
-        return ret;
-    };
     imports.wbg.__wbg_next_138a17bbf04e926c = function(arg0) {
         const ret = arg0.next;
         return ret;
@@ -3233,10 +3386,6 @@ function __wbg_get_imports() {
     imports.wbg.__wbg_set_7df433eea03a5c14 = function(arg0, arg1, arg2) {
         arg0[arg1 >>> 0] = arg2;
     };
-    imports.wbg.__wbg_set_efaaf145b9377369 = function(arg0, arg1, arg2) {
-        const ret = arg0.set(arg1, arg2);
-        return ret;
-    };
     imports.wbg.__wbg_stack_0ed75d68575b0f3c = function(arg0, arg1) {
         const ret = arg1.stack;
         const ptr1 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);