Architecture

pub const VNode = struct {
    id: u32,                          // Unique identifier
    node_type: VNodeType,             // element, text, component, fragment
    tag: ElementTag,                  // div, button, input, etc.
    key: [32]u8,                      // Reconciliation key
    text: [128]u8,                    // Text content
    props: VNodeProps,                // Properties and handlers
    children: [16]u32,                // Child node IDs
    dom_id: u32,                      // Platform DOM reference
};

pub const VTree = struct {
    nodes: [256]VNode,                // Node storage
    count: u32,                       // Active node count
    root_id: u32,                     // Root node ID
};

pub const Reconciler = struct {
    current_tree: VTree,              // Currently rendered tree
    next_tree: VTree,                 // Tree being built
    differ: Differ,                   // Diff algorithm instance
};

pub const PatchType = enum(u8) {
    create,        // Create new node
    remove,        // Remove existing node
    replace,       // Replace with different type
    update_props,  // Update properties
    update_text,   // Update text content
    insert_child,  // Insert child at index
    remove_child,  // Remove child at index
    reorder,       // Reorder children
};

pub fn Store(comptime T: type) type {
    return struct {
        current: T,      // Current state
        previous: T,     // Previous state (for diff)
        version: u64,    // Monotonically increasing version
        dirty: bool,     // Has uncommitted changes
    };
}

pub fn Diff(comptime T: type) type {
    return struct {
        changed: bool,
        version: u64,
        fields_changed: u32,

        pub fn calculate(old: *const T, new: *const T, version: u64) Self {
            // Byte-level comparison for change detection
            if (!std.mem.eql(u8, asBytes(old), asBytes(new))) {
                return .{ .changed = true, .version = version };
            }
            return .{ .changed = false, .version = version };
        }
    };
}

pub const Component = struct {
    id: u32,
    component_type: ComponentType,    // container, button, input, etc.
    props: ComponentProps,            // All configurable properties
    state: ComponentState,            // Interactive state (hover, focus)
    handlers: [8]EventHandler,        // Event callbacks
    children: [MAX_CHILDREN]u32,      // Child component IDs
};

pub const Event = union(enum) {
    // No payload
    counter_increment,
    counter_reset,

    // With payload
    todo_add: []const u8,
    todo_toggle: u32,
    navigate: Screen,
};

pub fn Arena(comptime SIZE: usize) type {
    return struct {
        buffer: [SIZE]u8,
        offset: usize,

        pub fn alloc(self: *Self, comptime T: type) ?*T {
            const size = @sizeOf(T);
            const aligned = alignUp(self.offset, @alignOf(T));

            if (aligned + size > SIZE) return null;

            const ptr = @ptrCast(*T, self.buffer[aligned..]);
            self.offset = aligned + size;
            return ptr;
        }

        pub fn reset(self: *Self) void {
            self.offset = 0;
        }
    };
}

pub const LayoutNode = struct {
    // Input constraints
    width: ?f32,
    height: ?f32,
    min_width: f32,
    max_width: f32,

    // Flex properties
    flex_direction: FlexDirection,
    justify_content: JustifyContent,
    align_items: AlignItems,
    flex_grow: f32,
    flex_shrink: f32,

    // Computed output
    computed_x: f32,
    computed_y: f32,
    computed_width: f32,
    computed_height: f32,
};

pub const Style = struct {
    // Box model
    width: Dimension,
    height: Dimension,
    padding: Edges,
    margin: Edges,
    border: BorderStyle,

    // Visual
    background_color: Color,
    color: Color,
    opacity: f32,

    // Text
    font_size: f32,
    font_weight: FontWeight,
    text_align: TextAlign,

    // Flexbox
    display: Display,
    flex_direction: FlexDirection,
    justify_content: JustifyContent,
    align_items: AlignItems,
};

// Cascading: component → class → inline
pub fn resolveStyle(component: *Component) Style {
    var style = Style.default();

    // Apply class styles
    if (component.props.class_name_len > 0) {
        const class_style = stylesheet.get(component.props.getClassName());
        style.merge(class_style);
    }

    // Apply inline styles
    if (component.props.style_id != 0) {
        const inline_style = styles.get(component.props.style_id);
        style.merge(inline_style);
    }

    return style;
}

pub const Scheduler = struct {
    high_priority: Queue(Task),    // User interactions
    normal_priority: Queue(Task),  // State updates
    low_priority: Queue(Task),     // Background work
    idle_callbacks: Queue(Task),   // When idle

    pub fn scheduleUpdate(self: *Self) void {
        self.normal_priority.push(.{ .type = .render });
    }

    pub fn processQueue(self: *Self, deadline: i64) void {
        // Process high priority first
        while (self.high_priority.pop()) |task| {
            task.execute();
        }

        // Then normal, respecting deadline
        while (std.time.milliTimestamp() < deadline) {
            if (self.normal_priority.pop()) |task| {
                task.execute();
            } else break;
        }
    }
};

// Lifecycle
export fn zylix_init() c_int;
export fn zylix_deinit() c_int;

// State
export fn zylix_get_state() ?*const State;
export fn zylix_get_version() u64;

// Events
export fn zylix_dispatch(event_type: u32, payload: ?*anyopaque, len: usize) c_int;

// Rendering
export fn zylix_render() c_int;
export fn zylix_get_patches() ?*const DiffResult;
export fn zylix_get_patch_count() u32;

// Memory
export fn zylix_alloc(len: usize) ?[*]u8;
export fn zylix_free(ptr: [*]u8, len: usize) void;

// JavaScript interop
extern fn js_log(ptr: [*]const u8, len: usize) void;
extern fn js_create_element(tag: u32, parent: u32) u32;
extern fn js_set_text(element: u32, ptr: [*]const u8, len: usize) void;
extern fn js_add_event_listener(element: u32, event: u32, callback: u32) void;

// WASM exports
export fn wasm_alloc(len: usize) ?[*]u8 {
    return allocator.alloc(u8, len) catch null;
}

export fn wasm_render() void {
    const patches = reconciler.commit();
    for (patches.patches[0..patches.count]) |patch| {
        applyPatch(patch);
    }
}