taffy-layout 1.1.0 → 1.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "taffy-layout",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "description": "WebAssembly bindings for Taffy layout library",
   "keywords": [
     "layout",

package/pkg/taffy_wasm.d.ts

@@ -549,7 +549,7 @@ export type GridTemplateArea = {
 };
 
 /**
- * Valid property paths for Style.get() method.
+ * Valid property keys for Style.get() method.
  *
  * Supports both object properties and individual flat properties.
  *
@@ -597,6 +597,74 @@ export type StyleProperty =
   | "gridAutoRows" | "gridAutoColumns"
   | "gridTemplateAreas" | "gridTemplateRowNames" | "gridTemplateColumnNames";
 
+/**
+ * Valid property keys for Layout.get() method.
+ *
+ * Supports both object properties and individual flat properties.
+ *
+ * @example
+ * ```typescript
+ * import { TaffyTree, Style } from "taffy-layout";
+ *
+ * const tree = new TaffyTree();
+ * const root = tree.newLeaf(new Style());
+ * tree.computeLayout(root, { width: 100, height: 100 });
+ * const layout = tree.getLayout(root);
+ * // Object properties
+ * layout.get("position", "size");
+ *
+ * // Individual flat properties
+ * layout.get("width", "height", "marginLeft");
+ *
+ * // Mixed
+ * layout.get("position", "width", "paddingTop");
+ *
+ * tree.free();
+ * ```
+ */
+export type LayoutProperty =
+  // Rendering order
+  | "order"
+  // Position
+  | "position" | "x" | "y"
+  // Size
+  | "size" | "width" | "height"
+  // Content size
+  | "contentSize" | "contentWidth" | "contentHeight"
+  // Scrollbar size
+  | "scrollbarSize" | "scrollbarWidth" | "scrollbarHeight"
+  // Border
+  | "border" | "borderLeft" | "borderRight" | "borderTop" | "borderBottom"
+  // Padding
+  | "padding" | "paddingLeft" | "paddingRight" | "paddingTop" | "paddingBottom"
+  // Margin
+  | "margin" | "marginLeft" | "marginRight" | "marginTop" | "marginBottom";
+
+/**
+ * Type-safe property values for Layout.get().
+ *
+ * Maps property paths to their expected value types.
+ */
+export type LayoutPropertyValues = {
+  [K in LayoutProperty]:
+    K extends "order" ? number :
+    K extends "position" ? Point<number> :
+    K extends "x" | "y" ? number :
+    K extends "size" ? Size<number> :
+    K extends "width" | "height" ? number :
+    K extends "contentSize" ? Size<number> :
+    K extends "contentWidth" | "contentHeight" ? number :
+    K extends "scrollbarSize" ? Size<number> :
+    K extends "scrollbarWidth" | "scrollbarHeight" ? number :
+    K extends "border" ? Rect<number> :
+    K extends "borderLeft" | "borderRight" | "borderTop" | "borderBottom" ? number :
+    K extends "padding" ? Rect<number> :
+    K extends "paddingLeft" | "paddingRight" | "paddingTop" | "paddingBottom" ? number :
+    K extends "margin" ? Rect<number> :
+    K extends "marginLeft" | "marginRight" | "marginTop" | "marginBottom" ? number :
+    unknown;
+};
+
 /**
  * Type-safe property values for batch setting.
  *
@@ -647,6 +715,8 @@ declare module "./taffy_wasm" {
      *
      * @returns Single value for one key, tuple for 2-3 keys, array for 4+ keys
      *
+     * @throws Error if any property key is unknown.
+     *
      * @remarks
      * - Single property: returns exact value type (including `undefined` for optional properties)
      * - 2-3 properties: returns typed tuple for destructuring
@@ -690,11 +760,12 @@ declare module "./taffy_wasm" {
      * Sets multiple style properties in a single WASM call.
      * Supports both object properties and individual flat properties.
      *
-     * @param props - Object mapping property paths to their values
+     * @param props - Object mapping property keys to their values
      *
      * @remarks
-     * Only accepts valid property paths with their corresponding value types.
-     * Invalid properties will be ignored at runtime.
+     * Only accepts valid property keys with their corresponding value types.
+     *
+     * @throws Error if any property key is unknown.
      *
      * @example
      * ```typescript
@@ -709,16 +780,73 @@ declare module "./taffy_wasm" {
      */
     set(props: StylePropertyValues): void;
   }
+
+  interface Layout {
+    /**
+     * Reads multiple layout properties in a single WASM call.
+     * Supports both object properties and individual flat properties.
+     *
+     * @returns Single value for one key, tuple for 2-3 keys, array for 4+ keys
+     *
+     * @throws Error if any property key is unknown.
+     *
+     * @remarks
+     * - Single property: returns exact value type
+     * - 2-3 properties: returns typed tuple for destructuring
+     * - 4+ properties: returns array of union types
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     *
+     * // Single property - returns exact type
+     * const width = layout.get("width"); // number
+     *
+     * // Two properties - returns tuple for destructuring
+     * const [pos, size] = layout.get("position", "size");
+     * // pos: Point<number>, size: Size<number>
+     *
+     * // Three properties - returns tuple for destructuring
+     * const [x, y, w] = layout.get("x", "y", "width");
+     *
+     * // Four or more properties - returns array
+     * const values = layout.get("x", "y", "width", "height");
+     * // values type is: number[]
+     *
+     * tree.free();
+     * ```
+     */
+    get<K extends LayoutProperty>(...keys: [K]): LayoutPropertyValues[K];
+    get<K1 extends LayoutProperty, K2 extends LayoutProperty>(
+      ...keys: [K1, K2]
+    ): [LayoutPropertyValues[K1], LayoutPropertyValues[K2]];
+    get<K1 extends LayoutProperty, K2 extends LayoutProperty, K3 extends LayoutProperty>(
+      ...keys: [K1, K2, K3]
+    ): [LayoutPropertyValues[K1], LayoutPropertyValues[K2], LayoutPropertyValues[K3]];
+    get<Keys extends LayoutProperty[]>(...keys: Keys): LayoutPropertyArrayValues<Keys>;
+  }
 }
 
 /**
- * Helper type to convert an array of property paths to an array of their value types.
+ * Helper type to convert an array of property keys to an array of their value types.
  * Unlike `TupleToStyleValues`, this returns an array type instead of a tuple.
  */
 type StylePropertyArrayValues<Keys extends StyleProperty[]> = {
   [K in keyof Keys]: Keys[K] extends StyleProperty ? StylePropertyValues[Keys[K]] : unknown;
 };
 
+/**
+ * Helper type to convert an array of layout property keys to an array of their value types.
+ */
+type LayoutPropertyArrayValues<Keys extends LayoutProperty[]> = {
+  [K in keyof Keys]: Keys[K] extends LayoutProperty ? LayoutPropertyValues[Keys[K]] : unknown;
+};
+
 
 
 /**
@@ -1152,6 +1280,28 @@ export class Layout {
    * @returns - The computed right border width in pixels
    */
   readonly borderRight: number;
+  /**
+   * Gets the content size as a Size with contentWidth and contentHeight
+   *
+   * If the node has overflow content, this represents the total size of all content
+   * (may exceed the node's width/height).
+   *
+   * @returns - A Size with contentWidth and contentHeight in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const contentSize = layout.contentSize;
+   * console.log(`Content: ${contentSize.width} x ${contentSize.height}`);
+   * tree.free();
+   * ```
+   */
+  readonly contentSize: any;
   /**
    * Gets the right margin
    *
@@ -1206,6 +1356,27 @@ export class Layout {
    * @returns - The computed bottom padding in pixels
    */
   readonly paddingBottom: number;
+  /**
+   * Gets the scrollbar size as a Size with scrollbarWidth and scrollbarHeight
+   *
+   * When overflow is set to scroll, this indicates the space reserved for scrollbars.
+   *
+   * @returns - A Size with scrollbarWidth and scrollbarHeight in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const scrollbarSize = layout.scrollbarSize;
+   * console.log(`Scrollbar: ${scrollbarSize.width} x ${scrollbarSize.height}`);
+   * tree.free();
+   * ```
+   */
+  readonly scrollbarSize: any;
   /**
    * Gets the width of the vertical scrollbar
    *
@@ -1242,6 +1413,25 @@ export class Layout {
    * @returns - The vertical position in pixels
    */
   readonly y: number;
+  /**
+   * Gets the size as a Size with width and height
+   *
+   * @returns - A Size with width and height in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const size = layout.size;
+   * console.log(`Size: ${size.width} x ${size.height}`);
+   * tree.free();
+   * ```
+   */
+  readonly size: any;
   /**
    * Gets the rendering order of the node
    *
@@ -1260,6 +1450,25 @@ export class Layout {
    * @returns - The width in pixels
    */
   readonly width: number;
+  /**
+   * Gets the border as a Rect with left, right, top, bottom border widths
+   *
+   * @returns - A Rect with border widths in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const border = layout.border;
+   * console.log(`Border: ${border.left} ${border.right} ${border.top} ${border.bottom}`);
+   * tree.free();
+   * ```
+   */
+  readonly border: any;
   /**
    * Gets the computed height of the node
    *
@@ -1269,6 +1478,63 @@ export class Layout {
    * @returns - The height in pixels
    */
   readonly height: number;
+  /**
+   * Gets the margin as a Rect with left, right, top, bottom margins
+   *
+   * @returns - A Rect with margin values in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const margin = layout.margin;
+   * console.log(`Margin: ${margin.left} ${margin.right} ${margin.top} ${margin.bottom}`);
+   * tree.free();
+   * ```
+   */
+  readonly margin: any;
+  /**
+   * Gets the padding as a Rect with left, right, top, bottom padding
+   *
+   * @returns - A Rect with padding values in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const padding = layout.padding;
+   * console.log(`Padding: ${padding.left} ${padding.right} ${padding.top} ${padding.bottom}`);
+   * tree.free();
+   * ```
+   */
+  readonly padding: any;
+  /**
+   * Gets the position as a Point with x and y coordinates
+   *
+   * @returns - A Point with x and y coordinates in pixels
+   *
+   * @example
+   * ```typescript
+   * import { TaffyTree, Style } from "taffy-layout";
+   *
+   * const tree = new TaffyTree();
+   * const root = tree.newLeaf(new Style());
+   * tree.computeLayout(root, { width: 100, height: 100 });
+   * const layout = tree.getLayout(root);
+   * const pos = layout.position;
+   * console.log(`Position: (${pos.x}, ${pos.y})`);
+   * tree.free();
+   * ```
+   */
+  readonly position: any;
 }
 
 /**
@@ -1352,31 +1618,6 @@ export enum Position {
 export class Style {
   free(): void;
   [Symbol.dispose](): void;
-  /**
-   * Reads multiple style properties in a single WASM call.
-   *
-   * Supports dot notation for nested properties (e.g., `"size.width"`, `"margin.left"`).
-   *
-   * @param keys - Property paths to read
-   * @returns - Single value if one key, array of values if multiple keys
-   *
-   * @example
-   * ```typescript
-   * const style = new Style();
-   * style.display = Display.Flex;
-   * style.size = { width: 100, height: "50%" };
-   *
-   * // Read single property
-   * const d = style.get("display");
-   *
-   * // Read nested property
-   * const w = style.get("size.width");
-   *
-   * // Read multiple properties with destructuring
-   * const [display, width, margin] = style.get("display", "size.width", "margin.left");
-   * ```
-   */
-  get(...keys: string[]): any;
   /**
    * Creates a new Style instance with default values
    *
@@ -1393,36 +1634,12 @@ export class Style {
    * const style2 = new Style({
    *   display: Display.Flex,
    *   flexDirection: FlexDirection.Column,
-   *   "size.width": 200,
-   *   "margin.left": 10
+   *   width: 200,
+   *   marginLeft: 10
    * });
    * ```
    */
   constructor(props?: any | null);
-  /**
-   * Sets multiple style properties in a single WASM call.
-   *
-   * Accepts an object where keys are property paths (supporting dot notation)
-   * and values are the new property values.
-   *
-   * @param props - Object with property paths as keys and values to set
-   *
-   * @example
-   * ```typescript
-   * const style = new Style();
-   *
-   * // Set multiple properties at once
-   * style.set({
-   *   display: Display.Flex,
-   *   flexDirection: FlexDirection.Column,
-   *   "size.width": 200,
-   *   "size.height": "50%",
-   *   "margin.left": 10,
-   *   "margin.right": "auto"
-   * });
-   * ```
-   */
-  set(props: any): void;
   /**
    * Gets the align-self property
    *
@@ -2722,24 +2939,32 @@ export interface InitOutput {
   readonly __wbg_style_free: (a: number, b: number) => void;
   readonly __wbg_taffyerror_free: (a: number, b: number) => void;
   readonly __wbg_taffytree_free: (a: number, b: number) => void;
+  readonly layout_border: (a: number) => any;
   readonly layout_borderBottom: (a: number) => number;
   readonly layout_borderLeft: (a: number) => number;
   readonly layout_borderRight: (a: number) => number;
   readonly layout_borderTop: (a: number) => number;
   readonly layout_contentHeight: (a: number) => number;
+  readonly layout_contentSize: (a: number) => any;
   readonly layout_contentWidth: (a: number) => number;
+  readonly layout_get: (a: number, b: number, c: number) => any;
   readonly layout_height: (a: number) => number;
+  readonly layout_margin: (a: number) => any;
   readonly layout_marginBottom: (a: number) => number;
   readonly layout_marginLeft: (a: number) => number;
   readonly layout_marginRight: (a: number) => number;
   readonly layout_marginTop: (a: number) => number;
   readonly layout_order: (a: number) => number;
+  readonly layout_padding: (a: number) => any;
   readonly layout_paddingBottom: (a: number) => number;
   readonly layout_paddingLeft: (a: number) => number;
   readonly layout_paddingRight: (a: number) => number;
   readonly layout_paddingTop: (a: number) => number;
+  readonly layout_position: (a: number) => any;
   readonly layout_scrollbarHeight: (a: number) => number;
+  readonly layout_scrollbarSize: (a: number) => any;
   readonly layout_scrollbarWidth: (a: number) => number;
+  readonly layout_size: (a: number) => any;
   readonly layout_width: (a: number) => number;
   readonly layout_x: (a: number) => number;
   readonly layout_y: (a: number) => number;

package/pkg/taffy_wasm.js

@@ -723,6 +723,32 @@ export class Layout {
         const ret = wasm.layout_borderRight(this.__wbg_ptr);
         return ret;
     }
+    /**
+     * Gets the content size as a Size with contentWidth and contentHeight
+     *
+     * If the node has overflow content, this represents the total size of all content
+     * (may exceed the node's width/height).
+     *
+     * @returns - A Size with contentWidth and contentHeight in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const contentSize = layout.contentSize;
+     * console.log(`Content: ${contentSize.width} x ${contentSize.height}`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get contentSize() {
+        const ret = wasm.layout_contentSize(this.__wbg_ptr);
+        return ret;
+    }
     /**
      * Gets the right margin
      *
@@ -809,6 +835,31 @@ export class Layout {
         const ret = wasm.layout_paddingBottom(this.__wbg_ptr);
         return ret;
     }
+    /**
+     * Gets the scrollbar size as a Size with scrollbarWidth and scrollbarHeight
+     *
+     * When overflow is set to scroll, this indicates the space reserved for scrollbars.
+     *
+     * @returns - A Size with scrollbarWidth and scrollbarHeight in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const scrollbarSize = layout.scrollbarSize;
+     * console.log(`Scrollbar: ${scrollbarSize.width} x ${scrollbarSize.height}`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get scrollbarSize() {
+        const ret = wasm.layout_scrollbarSize(this.__wbg_ptr);
+        return ret;
+    }
     /**
      * Gets the width of the vertical scrollbar
      *
@@ -861,6 +912,68 @@ export class Layout {
         const ret = wasm.layout_y(this.__wbg_ptr);
         return ret;
     }
+    /**
+     * Reads multiple layout properties in a single WASM call.
+     *
+     * Supports both compound properties and individual flat properties.
+     *
+     * @throws Error if any property key is unknown.
+     *
+     * @param keys - Property keys to read
+     * @returns - Single value if one key, array of values if multiple keys
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 800, height: 600 });
+     * const layout = tree.getLayout(root);
+     *
+     * // Read single property
+     * const width = layout.get("width");
+     *
+     * // Read compound property
+     * const pos = layout.get("position");
+     *
+     * // Read multiple properties with destructuring
+     * const [position, size] = layout.get("position", "size");
+     *
+     * tree.free();
+     * ```
+     * @param {...string[]} keys
+     * @returns {any}
+     */
+    get(...keys) {
+        const ptr0 = passArrayJsValueToWasm0(keys, wasm.__wbindgen_malloc);
+        const len0 = WASM_VECTOR_LEN;
+        const ret = wasm.layout_get(this.__wbg_ptr, ptr0, len0);
+        return ret;
+    }
+    /**
+     * Gets the size as a Size with width and height
+     *
+     * @returns - A Size with width and height in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const size = layout.size;
+     * console.log(`Size: ${size.width} x ${size.height}`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get size() {
+        const ret = wasm.layout_size(this.__wbg_ptr);
+        return ret;
+    }
     /**
      * Gets the rendering order of the node
      *
@@ -887,6 +1000,29 @@ export class Layout {
         const ret = wasm.layout_width(this.__wbg_ptr);
         return ret;
     }
+    /**
+     * Gets the border as a Rect with left, right, top, bottom border widths
+     *
+     * @returns - A Rect with border widths in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const border = layout.border;
+     * console.log(`Border: ${border.left} ${border.right} ${border.top} ${border.bottom}`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get border() {
+        const ret = wasm.layout_border(this.__wbg_ptr);
+        return ret;
+    }
     /**
      * Gets the computed height of the node
      *
@@ -900,6 +1036,75 @@ export class Layout {
         const ret = wasm.layout_height(this.__wbg_ptr);
         return ret;
     }
+    /**
+     * Gets the margin as a Rect with left, right, top, bottom margins
+     *
+     * @returns - A Rect with margin values in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const margin = layout.margin;
+     * console.log(`Margin: ${margin.left} ${margin.right} ${margin.top} ${margin.bottom}`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get margin() {
+        const ret = wasm.layout_margin(this.__wbg_ptr);
+        return ret;
+    }
+    /**
+     * Gets the padding as a Rect with left, right, top, bottom padding
+     *
+     * @returns - A Rect with padding values in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const padding = layout.padding;
+     * console.log(`Padding: ${padding.left} ${padding.right} ${padding.top} ${padding.bottom}`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get padding() {
+        const ret = wasm.layout_padding(this.__wbg_ptr);
+        return ret;
+    }
+    /**
+     * Gets the position as a Point with x and y coordinates
+     *
+     * @returns - A Point with x and y coordinates in pixels
+     *
+     * @example
+     * ```typescript
+     * import { TaffyTree, Style } from "taffy-layout";
+     *
+     * const tree = new TaffyTree();
+     * const root = tree.newLeaf(new Style());
+     * tree.computeLayout(root, { width: 100, height: 100 });
+     * const layout = tree.getLayout(root);
+     * const pos = layout.position;
+     * console.log(`Position: (${pos.x}, ${pos.y})`);
+     * tree.free();
+     * ```
+     * @returns {any}
+     */
+    get position() {
+        const ret = wasm.layout_position(this.__wbg_ptr);
+        return ret;
+    }
 }
 if (Symbol.dispose) Layout.prototype[Symbol.dispose] = Layout.prototype.free;
 
@@ -2486,9 +2691,11 @@ export class Style {
     /**
      * Reads multiple style properties in a single WASM call.
      *
-     * Supports dot notation for nested properties (e.g., `"size.width"`, `"margin.left"`).
+     * Supports flattened property keys (e.g., `"width"`, `"marginLeft"`).
+     *
+     * @throws Error if any property key is unknown.
      *
-     * @param keys - Property paths to read
+     * @param keys - Property keys to read
      * @returns - Single value if one key, array of values if multiple keys
      *
      * @example
@@ -2501,10 +2708,10 @@ export class Style {
      * const d = style.get("display");
      *
      * // Read nested property
-     * const w = style.get("size.width");
+     * const w = style.get("width");
      *
      * // Read multiple properties with destructuring
-     * const [display, width, margin] = style.get("display", "size.width", "margin.left");
+     * const [display, width, margin] = style.get("display", "width", "marginLeft");
      * ```
      * @param {...string[]} keys
      * @returns {any}
@@ -2531,8 +2738,8 @@ export class Style {
      * const style2 = new Style({
      *   display: Display.Flex,
      *   flexDirection: FlexDirection.Column,
-     *   "size.width": 200,
-     *   "margin.left": 10
+     *   width: 200,
+     *   marginLeft: 10
      * });
      * ```
      * @param {any | null} [props]
@@ -2546,10 +2753,11 @@ export class Style {
     /**
      * Sets multiple style properties in a single WASM call.
      *
-     * Accepts an object where keys are property paths (supporting dot notation)
-     * and values are the new property values.
+     * Accepts an object where keys are property keys.
+     *
+     * @throws Error if any property key is unknown.
      *
-     * @param props - Object with property paths as keys and values to set
+     * @param props - Object with property keys as keys and values to set
      *
      * @example
      * ```typescript
@@ -2559,10 +2767,10 @@ export class Style {
      * style.set({
      *   display: Display.Flex,
      *   flexDirection: FlexDirection.Column,
-     *   "size.width": 200,
-     *   "size.height": "50%",
-     *   "margin.left": 10,
-     *   "margin.right": "auto"
+     *   width: 200,
+     *   height: "50%",
+     *   marginLeft: 10,
+     *   marginRight: "auto"
      * });
      * ```
      * @param {any} props

package/pkg/taffy_wasm_bg.wasm.d.ts

@@ -5,24 +5,32 @@ export const __wbg_layout_free: (a: number, b: number) => void;
 export const __wbg_style_free: (a: number, b: number) => void;
 export const __wbg_taffyerror_free: (a: number, b: number) => void;
 export const __wbg_taffytree_free: (a: number, b: number) => void;
+export const layout_border: (a: number) => any;
 export const layout_borderBottom: (a: number) => number;
 export const layout_borderLeft: (a: number) => number;
 export const layout_borderRight: (a: number) => number;
 export const layout_borderTop: (a: number) => number;
 export const layout_contentHeight: (a: number) => number;
+export const layout_contentSize: (a: number) => any;
 export const layout_contentWidth: (a: number) => number;
+export const layout_get: (a: number, b: number, c: number) => any;
 export const layout_height: (a: number) => number;
+export const layout_margin: (a: number) => any;
 export const layout_marginBottom: (a: number) => number;
 export const layout_marginLeft: (a: number) => number;
 export const layout_marginRight: (a: number) => number;
 export const layout_marginTop: (a: number) => number;
 export const layout_order: (a: number) => number;
+export const layout_padding: (a: number) => any;
 export const layout_paddingBottom: (a: number) => number;
 export const layout_paddingLeft: (a: number) => number;
 export const layout_paddingRight: (a: number) => number;
 export const layout_paddingTop: (a: number) => number;
+export const layout_position: (a: number) => any;
 export const layout_scrollbarHeight: (a: number) => number;
+export const layout_scrollbarSize: (a: number) => any;
 export const layout_scrollbarWidth: (a: number) => number;
+export const layout_size: (a: number) => any;
 export const layout_width: (a: number) => number;
 export const layout_x: (a: number) => number;
 export const layout_y: (a: number) => number;