@tachui/core 0.7.0-alpha1

package/dist/components/ScrollView.js

@@ -0,0 +1,363 @@
+import "../reactive/cleanup.js";
+import "../reactive/unified-scheduler.js";
+import { createEffect as g } from "../reactive/effect.js";
+import { createSignal as S, isSignal as d } from "../reactive/signal.js";
+import "../reactive/scheduler.js";
+import "../reactive/theme.js";
+import "../runtime/component.js";
+import "../runtime/context.js";
+import "../runtime/dev-tools.js";
+import "../runtime/dom-bridge.js";
+import "../runtime/error-boundary.js";
+import "../runtime/error-reporting.js";
+import "../runtime/performance.js";
+import { h as v } from "../runtime/renderer.js";
+import "../runtime/element-override.js";
+import "../runtime/semantic-role-manager.js";
+import "../runtime/development-warnings.js";
+import { withModifiers as T } from "./wrapper.js";
+var w = Object.defineProperty, C = (i, t, e) => t in i ? w(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e, l = (i, t, e) => C(i, typeof t != "symbol" ? t + "" : t, e);
+class b {
+  constructor(t) {
+    this.props = t, l(this, "type", "component"), l(this, "id"), l(this, "mounted", !1), l(this, "cleanup", []), l(this, "scrollElement", null), l(this, "contentOffsetSignal"), l(this, "setContentOffset"), l(this, "contentSizeSignal"), l(this, "setContentSize"), l(this, "setIsScrolling"), l(this, "pullToRefreshStateSignal"), l(this, "setPullToRefreshState"), l(this, "scrollEventThrottle"), l(this, "lastScrollTime", 0), l(this, "scrollVelocity", { x: 0, y: 0 }), l(this, "lastScrollOffset", { x: 0, y: 0 }), l(this, "pullStartY", 0), l(this, "isPulling", !1), l(this, "handleScroll", (o) => {
+      if (!this.scrollElement) return;
+      const c = performance.now(), h = c - this.lastScrollTime;
+      if (h < this.scrollEventThrottle) return;
+      const f = {
+        x: this.scrollElement.scrollLeft,
+        y: this.scrollElement.scrollTop
+      };
+      this.scrollVelocity = this.calculateVelocity(f, h), this.setContentOffset(f), this.setContentSize({
+        width: this.scrollElement.scrollWidth,
+        height: this.scrollElement.scrollHeight
+      });
+      const u = this.detectScrollEdges(), E = {
+        offset: f,
+        velocity: this.scrollVelocity,
+        contentSize: {
+          width: this.scrollElement.scrollWidth,
+          height: this.scrollElement.scrollHeight
+        },
+        containerSize: {
+          width: this.scrollElement.clientWidth,
+          height: this.scrollElement.clientHeight
+        },
+        edges: u
+      };
+      this.props.onScroll && this.props.onScroll(E), u.top && this.props.onReachTop && this.props.onReachTop(), u.bottom && this.props.onReachBottom && this.props.onReachBottom(), u.left && this.props.onReachLeft && this.props.onReachLeft(), u.right && this.props.onReachRight && this.props.onReachRight(), this.lastScrollOffset = f, this.lastScrollTime = c;
+    }), l(this, "handleScrollStart", () => {
+      this.setIsScrolling(!0), this.props.onScrollBegin && this.props.onScrollBegin();
+    }), l(this, "handleScrollEnd", () => {
+      this.setIsScrolling(!1), this.props.onScrollEnd && this.props.onScrollEnd();
+    }), l(this, "handleTouchStart", (o) => {
+      this.props.refreshControl?.enabled && (this.pullStartY = o.touches[0].clientY, this.isPulling = !1);
+    }), l(this, "handleTouchMove", (o) => {
+      if (!this.props.refreshControl?.enabled || !this.scrollElement) return;
+      const h = o.touches[0].clientY - this.pullStartY, f = this.props.refreshControl.threshold || 80;
+      this.scrollElement.scrollTop <= 0 && h > 0 && (this.isPulling = !0, h > f ? this.setPullToRefreshState("ready") : this.setPullToRefreshState("pulling"));
+    }), l(this, "handleTouchEnd", async () => {
+      if (!this.props.refreshControl?.enabled || !this.isPulling) return;
+      if (this.pullToRefreshStateSignal() === "ready") {
+        this.setPullToRefreshState("refreshing");
+        try {
+          await this.props.refreshControl.onRefresh();
+        } catch (c) {
+          console.error("Pull to refresh error:", c);
+        } finally {
+          this.setPullToRefreshState("idle");
+        }
+      } else
+        this.setPullToRefreshState("idle");
+      this.isPulling = !1;
+    }), this.id = `scrollview-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, this.scrollEventThrottle = t.scrollEventThrottle || 16;
+    const [e, s] = S({ x: 0, y: 0 });
+    this.contentOffsetSignal = e, this.setContentOffset = s;
+    const [r, n] = S({ width: 0, height: 0 });
+    this.contentSizeSignal = r, this.setContentSize = n;
+    const [, a] = S(!1);
+    this.setIsScrolling = a;
+    const [m, p] = S("idle");
+    if (this.pullToRefreshStateSignal = m, this.setPullToRefreshState = p, t.contentOffset && d(t.contentOffset)) {
+      this.setContentOffset(t.contentOffset());
+      const o = g(() => {
+        t.contentOffset && d(t.contentOffset) && this.setContentOffset(t.contentOffset());
+      });
+      this.cleanup.push(() => o.dispose());
+    }
+    if (t.contentSize && d(t.contentSize)) {
+      this.setContentSize(t.contentSize());
+      const o = g(() => {
+        t.contentSize && d(t.contentSize) && this.setContentSize(t.contentSize());
+      });
+      this.cleanup.push(() => o.dispose());
+    }
+  }
+  /**
+   * Calculate scroll velocity
+   */
+  calculateVelocity(t, e) {
+    const s = t.x - this.lastScrollOffset.x, r = t.y - this.lastScrollOffset.y;
+    return {
+      x: e > 0 ? s / e : 0,
+      y: e > 0 ? r / e : 0
+    };
+  }
+  /**
+   * Detect scroll edges
+   */
+  detectScrollEdges() {
+    if (!this.scrollElement)
+      return { top: !1, bottom: !1, left: !1, right: !1 };
+    const { scrollTop: t, scrollLeft: e, scrollHeight: s, scrollWidth: r, clientHeight: n, clientWidth: a } = this.scrollElement;
+    return {
+      top: t <= 0,
+      bottom: t + n >= s - 1,
+      left: e <= 0,
+      right: e + a >= r - 1
+    };
+  }
+  /**
+   * Set up scroll event handlers
+   */
+  setupScrollHandlers(t) {
+    let e;
+    const s = () => {
+      clearTimeout(e), this.handleScrollStart();
+    }, r = () => {
+      clearTimeout(e), e = setTimeout(() => {
+        this.handleScrollEnd();
+      }, 150);
+    }, n = (a) => {
+      s(), this.handleScroll(a), r();
+    };
+    t.addEventListener("scroll", n, { passive: !0 }), t.addEventListener("touchstart", this.handleTouchStart, { passive: !0 }), t.addEventListener("touchmove", this.handleTouchMove, { passive: !1 }), t.addEventListener("touchend", this.handleTouchEnd, { passive: !0 }), this.cleanup.push(() => {
+      t.removeEventListener("scroll", n), t.removeEventListener("touchstart", this.handleTouchStart), t.removeEventListener("touchmove", this.handleTouchMove), t.removeEventListener("touchend", this.handleTouchEnd), clearTimeout(e);
+    });
+  }
+  /**
+   * Get overflow styles based on direction
+   */
+  getOverflowStyles(t) {
+    switch (t) {
+      case "vertical":
+        return {
+          overflowX: "hidden",
+          overflowY: "auto"
+        };
+      case "horizontal":
+        return {
+          overflowX: "auto",
+          overflowY: "hidden"
+        };
+      case "both":
+        return {
+          overflow: "auto"
+        };
+      default:
+        return {
+          overflowX: "hidden",
+          overflowY: "auto"
+        };
+    }
+  }
+  /**
+   * Apply additional scroll view styling (position and overflow already set in initial render)
+   */
+  applyScrollViewStyles(t) {
+    const { showsScrollIndicator: e = !0, bounces: s = !0 } = this.props;
+    if (!e) {
+      t.style.scrollbarWidth = "none", t.style.msOverflowStyle = "none";
+      const r = document.createElement("style");
+      r.textContent = `
+        #${t.id}::-webkit-scrollbar {
+          display: none;
+        }
+      `, document.head.appendChild(r), this.cleanup.push(() => {
+        document.head.removeChild(r);
+      });
+    }
+    s ? t.style.webkitOverflowScrolling = "touch" : t.style.overscrollBehavior = "none", t.style.scrollBehavior = "smooth";
+  }
+  /**
+   * Apply content insets
+   */
+  applyContentInsets(t) {
+    const { contentInset: e } = this.props;
+    if (e) {
+      const { top: s = 0, bottom: r = 0, left: n = 0, right: a = 0 } = e;
+      t.style.padding = `${s}px ${a}px ${r}px ${n}px`;
+    }
+  }
+  /**
+   * Create pull to refresh indicator
+   */
+  createPullToRefreshIndicator() {
+    if (!this.props.refreshControl?.enabled) return null;
+    const t = this.pullToRefreshStateSignal(), e = this.props.refreshControl.tintColor || "#007AFF";
+    let s = "";
+    switch (t) {
+      case "pulling":
+        s = "↓ Pull to refresh";
+        break;
+      case "ready":
+        s = "↑ Release to refresh";
+        break;
+      case "refreshing":
+        s = "⟳ Refreshing...";
+        break;
+      default:
+        s = "";
+    }
+    return s ? {
+      type: "component",
+      id: `${this.id}-refresh`,
+      mounted: !1,
+      cleanup: [],
+      props: {},
+      render: () => [
+        v(
+          "div",
+          {
+            style: {
+              position: "absolute",
+              top: "-60px",
+              left: "50%",
+              transform: "translateX(-50%)",
+              padding: "10px 20px",
+              backgroundColor: "#f8f9fa",
+              borderRadius: "20px",
+              color: e,
+              fontSize: "14px",
+              fontWeight: "500",
+              textAlign: "center",
+              zIndex: 1e3,
+              transition: "all 0.3s ease",
+              opacity: t === "idle" ? 0 : 1
+            }
+          },
+          s
+        )
+      ]
+    } : null;
+  }
+  /**
+   * Scroll to specific position
+   */
+  scrollTo(t, e = "smooth") {
+    if (!this.scrollElement) return;
+    const s = { behavior: e };
+    t.x !== void 0 && (s.left = t.x), t.y !== void 0 && (s.top = t.y), this.scrollElement.scrollTo(s);
+  }
+  /**
+   * Scroll to top
+   */
+  scrollToTop(t = "smooth") {
+    this.scrollTo({ x: 0, y: 0 }, t);
+  }
+  /**
+   * Scroll to bottom
+   */
+  scrollToBottom(t = "smooth") {
+    this.scrollElement && this.scrollTo(
+      {
+        x: 0,
+        y: this.scrollElement.scrollHeight - this.scrollElement.clientHeight
+      },
+      t
+    );
+  }
+  /**
+   * Render the scroll view component
+   */
+  render() {
+    const { children: t = [], scrollEnabled: e = !0 } = this.props, s = v(
+      "div",
+      {
+        class: "tachui-scrollview-content",
+        style: {
+          minHeight: "100%",
+          minWidth: "100%"
+        }
+      },
+      ...t.flatMap((o) => o.render())
+    ), r = this.createPullToRefreshIndicator(), n = [];
+    if (r) {
+      const o = r.render(), c = Array.isArray(o) ? o : [o];
+      n.push(...c.filter((h) => h));
+    }
+    n.push(s);
+    const { direction: a = "vertical" } = this.props, m = this.getOverflowStyles(a), p = v(
+      "div",
+      {
+        id: this.id,
+        class: "tachui-scrollview",
+        style: {
+          height: "100%",
+          width: "100%",
+          position: "relative",
+          ...m
+        }
+      },
+      ...n
+    );
+    if (p.element) {
+      const o = p.element;
+      this.scrollElement = o, this.applyScrollViewStyles(o), this.setupScrollHandlers(o), s.element && this.applyContentInsets(s.element);
+      const c = () => {
+        const h = d(e) ? e() : e;
+        o.style.overflow = h ? "auto" : "hidden", o.style.pointerEvents = h ? "auto" : "none";
+      };
+      if (d(e)) {
+        const h = g(c);
+        this.cleanup.push(() => h.dispose());
+      } else
+        c();
+    }
+    return [p];
+  }
+}
+function y(i = {}) {
+  const t = new b(i);
+  return T(t);
+}
+const k = {
+  /**
+   * Create a scroll view with pull to refresh
+   */
+  withRefresh(i, t, e = {}) {
+    return y({
+      children: i,
+      refreshControl: {
+        enabled: !0,
+        onRefresh: t,
+        ...e
+      }
+    });
+  },
+  /**
+   * Create a horizontal scroll view
+   */
+  horizontal(i, t = {}) {
+    return y({
+      ...t,
+      children: i,
+      direction: "horizontal"
+    });
+  },
+  /**
+   * Create a paged scroll view
+   */
+  paged(i, t = {}) {
+    return y({
+      ...t,
+      children: i,
+      pagingEnabled: !0
+    });
+  }
+};
+export {
+  b as EnhancedScrollView,
+  y as ScrollView,
+  k as ScrollViewUtils
+};
+//# sourceMappingURL=ScrollView.js.map

package/dist/components/ScrollView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollView.js","sources":["../../src/components/ScrollView.ts"],"sourcesContent":["/**\n * Enhanced ScrollView Component (Phase 5.5)\n *\n * SwiftUI-inspired ScrollView component with performance optimization,\n * smooth scrolling, pull-to-refresh, and advanced scroll handling.\n */\n\nimport type { ModifiableComponent, ModifierBuilder } from '../modifiers/types'\nimport { createEffect, createSignal, isSignal } from '../reactive'\nimport type { Signal } from '../reactive/types'\nimport { h } from '../runtime'\nimport type { ComponentInstance, ComponentProps } from '../runtime/types'\nimport { withModifiers } from './wrapper'\n\n/**\n * Scroll direction\n */\nexport type ScrollDirection = 'vertical' | 'horizontal' | 'both'\n\n/**\n * Scroll behavior for programmatic scrolling\n */\nexport type ScrollBehavior = 'auto' | 'smooth' | 'instant'\n\n/**\n * Content offset position\n */\nexport interface ContentOffset {\n  x: number\n  y: number\n}\n\n/**\n * Scroll edge detection\n */\nexport interface ScrollEdges {\n  top: boolean\n  bottom: boolean\n  left: boolean\n  right: boolean\n}\n\n/**\n * Pull-to-refresh state\n */\nexport type PullToRefreshState = 'idle' | 'pulling' | 'ready' | 'refreshing'\n\n/**\n * Scroll event information\n */\nexport interface ScrollEventInfo {\n  offset: ContentOffset\n  velocity: ContentOffset\n  contentSize: { width: number; height: number }\n  containerSize: { width: number; height: number }\n  edges: ScrollEdges\n}\n\n/**\n * ScrollView component properties\n */\nexport interface ScrollViewProps extends ComponentProps {\n  // Content\n  children?: ComponentInstance[]\n\n  // Scroll behavior\n  direction?: ScrollDirection\n  showsScrollIndicator?: boolean\n  bounces?: boolean\n  scrollEnabled?: boolean | Signal<boolean>\n\n  // Content sizing\n  contentOffset?: Signal<ContentOffset>\n  contentSize?: Signal<{ width: number; height: number }>\n\n  // Pull to refresh\n  refreshControl?: {\n    enabled: boolean\n    onRefresh: () => Promise<void>\n    refreshing?: Signal<boolean>\n    threshold?: number\n    tintColor?: string\n  }\n\n  // Scroll events\n  onScroll?: (info: ScrollEventInfo) => void\n  onScrollBegin?: () => void\n  onScrollEnd?: () => void\n  onReachTop?: () => void\n  onReachBottom?: () => void\n  onReachLeft?: () => void\n  onReachRight?: () => void\n\n  // Performance\n  scrollEventThrottle?: number\n  decelerationRate?: 'normal' | 'fast' | number\n\n  // Content insets\n  contentInset?: {\n    top?: number\n    bottom?: number\n    left?: number\n    right?: number\n  }\n\n  // Snap behavior\n  pagingEnabled?: boolean\n  snapToAlignment?: 'start' | 'center' | 'end'\n  snapToInterval?: number\n\n  // Keyboard behavior\n  keyboardDismissMode?: 'none' | 'on-drag' | 'interactive'\n\n  // Accessibility\n  accessibilityLabel?: string\n  accessibilityRole?: string\n}\n\n/**\n * Enhanced ScrollView component class\n */\nexport class EnhancedScrollView implements ComponentInstance<ScrollViewProps> {\n  public readonly type = 'component' as const\n  public readonly id: string\n  public mounted = false\n  public cleanup: (() => void)[] = []\n\n  private scrollElement: HTMLElement | null = null\n  public contentOffsetSignal: () => ContentOffset\n  private setContentOffset: (offset: ContentOffset) => void\n  public contentSizeSignal: () => { width: number; height: number }\n  private setContentSize: (size: { width: number; height: number }) => void\n  private setIsScrolling: (scrolling: boolean) => void\n  private pullToRefreshStateSignal: () => PullToRefreshState\n  private setPullToRefreshState: (state: PullToRefreshState) => void\n\n  // Performance tracking\n  private scrollEventThrottle: number\n  private lastScrollTime = 0\n  private scrollVelocity: ContentOffset = { x: 0, y: 0 }\n  private lastScrollOffset: ContentOffset = { x: 0, y: 0 }\n\n  // Pull to refresh tracking\n  private pullStartY = 0\n  private isPulling = false\n\n  constructor(public props: ScrollViewProps) {\n    this.id = `scrollview-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`\n    this.scrollEventThrottle = props.scrollEventThrottle || 16 // 60fps default\n\n    // Create reactive signals\n    const [contentOffsetSignal, setContentOffset] = createSignal<ContentOffset>({ x: 0, y: 0 })\n    this.contentOffsetSignal = contentOffsetSignal\n    this.setContentOffset = setContentOffset\n\n    const [contentSizeSignal, setContentSize] = createSignal({ width: 0, height: 0 })\n    this.contentSizeSignal = contentSizeSignal\n    this.setContentSize = setContentSize\n\n    const [, setIsScrolling] = createSignal(false)\n    this.setIsScrolling = setIsScrolling\n\n    const [pullToRefreshStateSignal, setPullToRefreshState] =\n      createSignal<PullToRefreshState>('idle')\n    this.pullToRefreshStateSignal = pullToRefreshStateSignal\n    this.setPullToRefreshState = setPullToRefreshState\n\n    // Connect external content offset signal\n    if (props.contentOffset && isSignal(props.contentOffset)) {\n      // Set initial value\n      this.setContentOffset(props.contentOffset())\n\n      const effect = createEffect(() => {\n        if (props.contentOffset && isSignal(props.contentOffset)) {\n          this.setContentOffset(props.contentOffset())\n        }\n      })\n      this.cleanup.push(() => effect.dispose())\n    }\n\n    // Connect external content size signal\n    if (props.contentSize && isSignal(props.contentSize)) {\n      // Set initial value\n      this.setContentSize(props.contentSize())\n\n      const effect = createEffect(() => {\n        if (props.contentSize && isSignal(props.contentSize)) {\n          this.setContentSize(props.contentSize())\n        }\n      })\n      this.cleanup.push(() => effect.dispose())\n    }\n  }\n\n  /**\n   * Calculate scroll velocity\n   */\n  private calculateVelocity(currentOffset: ContentOffset, deltaTime: number): ContentOffset {\n    const deltaX = currentOffset.x - this.lastScrollOffset.x\n    const deltaY = currentOffset.y - this.lastScrollOffset.y\n\n    return {\n      x: deltaTime > 0 ? deltaX / deltaTime : 0,\n      y: deltaTime > 0 ? deltaY / deltaTime : 0,\n    }\n  }\n\n  /**\n   * Detect scroll edges\n   */\n  private detectScrollEdges(): ScrollEdges {\n    if (!this.scrollElement) {\n      return { top: false, bottom: false, left: false, right: false }\n    }\n\n    const { scrollTop, scrollLeft, scrollHeight, scrollWidth, clientHeight, clientWidth } =\n      this.scrollElement\n\n    return {\n      top: scrollTop <= 0,\n      bottom: scrollTop + clientHeight >= scrollHeight - 1,\n      left: scrollLeft <= 0,\n      right: scrollLeft + clientWidth >= scrollWidth - 1,\n    }\n  }\n\n  /**\n   * Handle scroll events\n   */\n  private handleScroll = (_event: Event) => {\n    if (!this.scrollElement) return\n\n    const now = performance.now()\n    const deltaTime = now - this.lastScrollTime\n\n    // Throttle scroll events for performance\n    if (deltaTime < this.scrollEventThrottle) return\n\n    const currentOffset: ContentOffset = {\n      x: this.scrollElement.scrollLeft,\n      y: this.scrollElement.scrollTop,\n    }\n\n    // Calculate velocity\n    this.scrollVelocity = this.calculateVelocity(currentOffset, deltaTime)\n\n    // Update signals\n    this.setContentOffset(currentOffset)\n    this.setContentSize({\n      width: this.scrollElement.scrollWidth,\n      height: this.scrollElement.scrollHeight,\n    })\n\n    // Detect edges\n    const edges = this.detectScrollEdges()\n\n    // Create scroll event info\n    const scrollInfo: ScrollEventInfo = {\n      offset: currentOffset,\n      velocity: this.scrollVelocity,\n      contentSize: {\n        width: this.scrollElement.scrollWidth,\n        height: this.scrollElement.scrollHeight,\n      },\n      containerSize: {\n        width: this.scrollElement.clientWidth,\n        height: this.scrollElement.clientHeight,\n      },\n      edges,\n    }\n\n    // Call scroll callbacks\n    if (this.props.onScroll) {\n      this.props.onScroll(scrollInfo)\n    }\n\n    // Edge callbacks\n    if (edges.top && this.props.onReachTop) this.props.onReachTop()\n    if (edges.bottom && this.props.onReachBottom) this.props.onReachBottom()\n    if (edges.left && this.props.onReachLeft) this.props.onReachLeft()\n    if (edges.right && this.props.onReachRight) this.props.onReachRight()\n\n    // Update tracking variables\n    this.lastScrollOffset = currentOffset\n    this.lastScrollTime = now\n  }\n\n  /**\n   * Handle scroll start\n   */\n  private handleScrollStart = () => {\n    this.setIsScrolling(true)\n    if (this.props.onScrollBegin) {\n      this.props.onScrollBegin()\n    }\n  }\n\n  /**\n   * Handle scroll end\n   */\n  private handleScrollEnd = () => {\n    this.setIsScrolling(false)\n    if (this.props.onScrollEnd) {\n      this.props.onScrollEnd()\n    }\n  }\n\n  /**\n   * Handle touch start for pull to refresh\n   */\n  private handleTouchStart = (event: TouchEvent) => {\n    if (!this.props.refreshControl?.enabled) return\n\n    this.pullStartY = event.touches[0].clientY\n    this.isPulling = false\n  }\n\n  /**\n   * Handle touch move for pull to refresh\n   */\n  private handleTouchMove = (event: TouchEvent) => {\n    if (!this.props.refreshControl?.enabled || !this.scrollElement) return\n\n    const currentY = event.touches[0].clientY\n    const deltaY = currentY - this.pullStartY\n    const threshold = this.props.refreshControl.threshold || 80\n\n    // Only trigger pull to refresh at the top\n    if (this.scrollElement.scrollTop <= 0 && deltaY > 0) {\n      this.isPulling = true\n\n      if (deltaY > threshold) {\n        this.setPullToRefreshState('ready')\n      } else {\n        this.setPullToRefreshState('pulling')\n      }\n    }\n  }\n\n  /**\n   * Handle touch end for pull to refresh\n   */\n  private handleTouchEnd = async () => {\n    if (!this.props.refreshControl?.enabled || !this.isPulling) return\n\n    const state = this.pullToRefreshStateSignal()\n\n    if (state === 'ready') {\n      this.setPullToRefreshState('refreshing')\n\n      try {\n        await this.props.refreshControl.onRefresh()\n      } catch (error) {\n        console.error('Pull to refresh error:', error)\n      } finally {\n        this.setPullToRefreshState('idle')\n      }\n    } else {\n      this.setPullToRefreshState('idle')\n    }\n\n    this.isPulling = false\n  }\n\n  /**\n   * Set up scroll event handlers\n   */\n  private setupScrollHandlers(element: HTMLElement): void {\n    let scrollTimer: NodeJS.Timeout\n\n    const throttledScrollStart = () => {\n      clearTimeout(scrollTimer)\n      this.handleScrollStart()\n    }\n\n    const throttledScrollEnd = () => {\n      clearTimeout(scrollTimer)\n      scrollTimer = setTimeout(() => {\n        this.handleScrollEnd()\n      }, 150) // 150ms after scroll stops\n    }\n\n    const scrollHandler = (event: Event) => {\n      throttledScrollStart()\n      this.handleScroll(event)\n      throttledScrollEnd()\n    }\n\n    element.addEventListener('scroll', scrollHandler, { passive: true })\n    element.addEventListener('touchstart', this.handleTouchStart, { passive: true })\n    element.addEventListener('touchmove', this.handleTouchMove, { passive: false })\n    element.addEventListener('touchend', this.handleTouchEnd, { passive: true })\n\n    this.cleanup.push(() => {\n      element.removeEventListener('scroll', scrollHandler)\n      element.removeEventListener('touchstart', this.handleTouchStart)\n      element.removeEventListener('touchmove', this.handleTouchMove)\n      element.removeEventListener('touchend', this.handleTouchEnd)\n      clearTimeout(scrollTimer)\n    })\n  }\n\n  /**\n   * Get overflow styles based on direction\n   */\n  private getOverflowStyles(direction: ScrollDirection): Record<string, string> {\n    switch (direction) {\n      case 'vertical':\n        return {\n          overflowX: 'hidden',\n          overflowY: 'auto',\n        }\n      case 'horizontal':\n        return {\n          overflowX: 'auto',\n          overflowY: 'hidden',\n        }\n      case 'both':\n        return {\n          overflow: 'auto',\n        }\n      default:\n        return {\n          overflowX: 'hidden',\n          overflowY: 'auto',\n        }\n    }\n  }\n\n  /**\n   * Apply additional scroll view styling (position and overflow already set in initial render)\n   */\n  private applyScrollViewStyles(element: HTMLElement): void {\n    const { showsScrollIndicator = true, bounces = true } = this.props\n\n    // Scroll indicator visibility\n    if (!showsScrollIndicator) {\n      element.style.scrollbarWidth = 'none' // Firefox\n      ;(element.style as any).msOverflowStyle = 'none' // IE/Edge\n\n      // Webkit browsers\n      const style = document.createElement('style')\n      style.textContent = `\n        #${element.id}::-webkit-scrollbar {\n          display: none;\n        }\n      `\n      document.head.appendChild(style)\n\n      this.cleanup.push(() => {\n        document.head.removeChild(style)\n      })\n    }\n\n    // Bounce behavior (webkit-specific)\n    if (bounces) {\n      ;(element.style as any).webkitOverflowScrolling = 'touch'\n    } else {\n      element.style.overscrollBehavior = 'none'\n    }\n\n    // Smooth scrolling\n    element.style.scrollBehavior = 'smooth'\n  }\n\n  /**\n   * Apply content insets\n   */\n  private applyContentInsets(contentElement: HTMLElement): void {\n    const { contentInset } = this.props\n\n    if (contentInset) {\n      const { top = 0, bottom = 0, left = 0, right = 0 } = contentInset\n      contentElement.style.padding = `${top}px ${right}px ${bottom}px ${left}px`\n    }\n  }\n\n  /**\n   * Create pull to refresh indicator\n   */\n  private createPullToRefreshIndicator(): ComponentInstance | null {\n    if (!this.props.refreshControl?.enabled) return null\n\n    const state = this.pullToRefreshStateSignal()\n    const tintColor = this.props.refreshControl.tintColor || '#007AFF'\n\n    let content = ''\n    switch (state) {\n      case 'pulling':\n        content = '↓ Pull to refresh'\n        break\n      case 'ready':\n        content = '↑ Release to refresh'\n        break\n      case 'refreshing':\n        content = '⟳ Refreshing...'\n        break\n      default:\n        content = ''\n    }\n\n    if (!content) return null\n\n    return {\n      type: 'component',\n      id: `${this.id}-refresh`,\n      mounted: false,\n      cleanup: [],\n      props: {},\n      render: () => [\n        h(\n          'div',\n          {\n            style: {\n              position: 'absolute',\n              top: '-60px',\n              left: '50%',\n              transform: 'translateX(-50%)',\n              padding: '10px 20px',\n              backgroundColor: '#f8f9fa',\n              borderRadius: '20px',\n              color: tintColor,\n              fontSize: '14px',\n              fontWeight: '500',\n              textAlign: 'center',\n              zIndex: 1000,\n              transition: 'all 0.3s ease',\n              opacity: state === 'idle' ? 0 : 1,\n            },\n          },\n          content\n        ),\n      ],\n    }\n  }\n\n  /**\n   * Scroll to specific position\n   */\n  public scrollTo(offset: Partial<ContentOffset>, behavior: ScrollBehavior = 'smooth'): void {\n    if (!this.scrollElement) return\n\n    const scrollOptions: ScrollToOptions = { behavior }\n    if (offset.x !== undefined) scrollOptions.left = offset.x\n    if (offset.y !== undefined) scrollOptions.top = offset.y\n\n    this.scrollElement.scrollTo(scrollOptions)\n  }\n\n  /**\n   * Scroll to top\n   */\n  public scrollToTop(behavior: ScrollBehavior = 'smooth'): void {\n    this.scrollTo({ x: 0, y: 0 }, behavior)\n  }\n\n  /**\n   * Scroll to bottom\n   */\n  public scrollToBottom(behavior: ScrollBehavior = 'smooth'): void {\n    if (!this.scrollElement) return\n\n    this.scrollTo(\n      {\n        x: 0,\n        y: this.scrollElement.scrollHeight - this.scrollElement.clientHeight,\n      },\n      behavior\n    )\n  }\n\n  /**\n   * Render the scroll view component\n   */\n  render() {\n    const { children = [], scrollEnabled = true } = this.props\n\n    // Create content container\n    const contentContainer = h(\n      'div',\n      {\n        class: 'tachui-scrollview-content',\n        style: {\n          minHeight: '100%',\n          minWidth: '100%',\n        },\n      },\n      ...children.flatMap((child) => child.render())\n    )\n\n    // Create pull to refresh indicator\n    const refreshIndicator = this.createPullToRefreshIndicator()\n\n    // Create scroll container children\n    const scrollChildren: any[] = []\n\n    // Add refresh indicator if present\n    if (refreshIndicator) {\n      const result = refreshIndicator.render()\n      const arr = Array.isArray(result) ? result : [result]\n      scrollChildren.push(...arr.filter((x: any) => x))\n    }\n\n    // Add content container\n    scrollChildren.push(contentContainer)\n\n    // Create scroll container with default overflow styles\n    const { direction = 'vertical' } = this.props\n    \n    // Determine overflow styles based on direction\n    const overflowStyles = this.getOverflowStyles(direction)\n    \n    const scrollContainer = h(\n      'div',\n      {\n        id: this.id,\n        class: 'tachui-scrollview',\n        style: {\n          height: '100%',\n          width: '100%',\n          position: 'relative',\n          ...overflowStyles,\n        },\n      },\n      ...scrollChildren\n    )\n\n    // Apply styles and event handlers when element is created\n    if (scrollContainer.element) {\n      const element = scrollContainer.element as HTMLElement\n      this.scrollElement = element\n\n      this.applyScrollViewStyles(element)\n      this.setupScrollHandlers(element)\n\n      // Apply content insets to content container\n      if (contentContainer.element) {\n        this.applyContentInsets(contentContainer.element as HTMLElement)\n      }\n\n      // Handle scroll enabled state\n      const updateScrollEnabled = () => {\n        const enabled = isSignal(scrollEnabled) ? scrollEnabled() : scrollEnabled\n        element.style.overflow = enabled ? 'auto' : 'hidden'\n        element.style.pointerEvents = enabled ? 'auto' : 'none'\n      }\n\n      if (isSignal(scrollEnabled)) {\n        const effect = createEffect(updateScrollEnabled)\n        this.cleanup.push(() => effect.dispose())\n      } else {\n        updateScrollEnabled()\n      }\n    }\n\n    return [scrollContainer]\n  }\n}\n\n/**\n * Create enhanced ScrollView component with modifier support\n */\nexport function ScrollView(props: ScrollViewProps = {}): ModifiableComponent<ScrollViewProps> & {\n  modifier: ModifierBuilder<ModifiableComponent<ScrollViewProps>>\n} {\n  const component = new EnhancedScrollView(props)\n  return withModifiers(component)\n}\n\n/**\n * ScrollView utility functions\n */\nexport const ScrollViewUtils = {\n  /**\n   * Create a scroll view with pull to refresh\n   */\n  withRefresh(\n    children: ComponentInstance[],\n    onRefresh: () => Promise<void>,\n    options: Partial<ScrollViewProps['refreshControl']> = {}\n  ): ModifiableComponent<ScrollViewProps> & {\n    modifier: ModifierBuilder<ModifiableComponent<ScrollViewProps>>\n  } {\n    return ScrollView({\n      children,\n      refreshControl: {\n        enabled: true,\n        onRefresh,\n        ...options,\n      },\n    })\n  },\n\n  /**\n   * Create a horizontal scroll view\n   */\n  horizontal(\n    children: ComponentInstance[],\n    props: Omit<ScrollViewProps, 'children' | 'direction'> = {}\n  ): ModifiableComponent<ScrollViewProps> & {\n    modifier: ModifierBuilder<ModifiableComponent<ScrollViewProps>>\n  } {\n    return ScrollView({\n      ...props,\n      children,\n      direction: 'horizontal',\n    })\n  },\n\n  /**\n   * Create a paged scroll view\n   */\n  paged(\n    children: ComponentInstance[],\n    props: Omit<ScrollViewProps, 'children' | 'pagingEnabled'> = {}\n  ): ModifiableComponent<ScrollViewProps> & {\n    modifier: ModifierBuilder<ModifiableComponent<ScrollViewProps>>\n  } {\n    return ScrollView({\n      ...props,\n      children,\n      pagingEnabled: true,\n    })\n  },\n}\n"],"names":["EnhancedScrollView","props","__publicField","_event","now","deltaTime","currentOffset","edges","scrollInfo","event","deltaY","threshold","error","contentOffsetSignal","setContentOffset","createSignal","contentSizeSignal","setContentSize","setIsScrolling","pullToRefreshStateSignal","setPullToRefreshState","isSignal","effect","createEffect","deltaX","scrollTop","scrollLeft","scrollHeight","scrollWidth","clientHeight","clientWidth","element","scrollTimer","throttledScrollStart","throttledScrollEnd","scrollHandler","direction","showsScrollIndicator","bounces","style","contentElement","contentInset","top","bottom","left","right","state","tintColor","content","h","offset","behavior","scrollOptions","children","scrollEnabled","contentContainer","child","refreshIndicator","scrollChildren","result","arr","x","overflowStyles","scrollContainer","updateScrollEnabled","enabled","ScrollView","component","withModifiers","ScrollViewUtils","onRefresh","options"],"mappings":"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"}

package/dist/components/Section.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../reactive/cleanup.cjs");require("../reactive/unified-scheduler.cjs");const a=require("../reactive/signal.cjs");require("../reactive/scheduler.cjs");require("../reactive/theme.cjs");require("../runtime/component.cjs");require("../runtime/context.cjs");require("../runtime/dev-tools.cjs");require("../runtime/dom-bridge.cjs");require("../runtime/error-boundary.cjs");require("../runtime/error-reporting.cjs");require("../runtime/performance.cjs");const n=require("../runtime/renderer.cjs");require("../runtime/element-override.cjs");require("../runtime/semantic-role-manager.cjs");require("../runtime/development-warnings.cjs");const p=require("./wrapper.cjs");var d=Object.defineProperty,u=(t,e,r)=>e in t?d(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,s=(t,e,r)=>u(t,typeof e!="symbol"?e+"":e,r);class l{constructor(e){this.props=e,s(this,"type","component"),s(this,"id"),s(this,"mounted",!1),s(this,"cleanup",[]),s(this,"handleToggle",()=>{this.props.onToggle&&this.props.onToggle(!this.isCollapsed())}),this.id=`section-${Date.now()}-${Math.random().toString(36).substr(2,9)}`}resolveContent(e){return e?typeof e=="string"?e:typeof e=="function"||a.isSignal(e)?e():e:null}isCollapsed(){const{collapsed:e}=this.props;return typeof e=="boolean"?e:a.isSignal(e)?e():!1}renderComponentContent(e){const r=e.render();return Array.isArray(r)?r:[r]}getSectionStyles(){const{style:e="automatic"}=this.props,r={marginBottom:"20px"};switch(e){case"grouped":return{...r,backgroundColor:"#ffffff",border:"1px solid #e0e0e0",borderRadius:"12px",overflow:"hidden"};case"inset":return{...r,backgroundColor:"#f8f9fa",border:"1px solid #e9ecef",borderRadius:"8px",margin:"0 16px 20px 16px"};case"sidebar":return{...r,borderLeft:"3px solid #007AFF",paddingLeft:"16px",backgroundColor:"#f8f9fa",borderRadius:"0 8px 8px 0"};case"plain":return r;default:return{...r,backgroundColor:"#ffffff",border:"1px solid #f0f0f0",borderRadius:"8px"}}}getHeaderStyles(){const{style:e="automatic"}=this.props,r={fontSize:"16px",fontWeight:"600",color:"#1a1a1a",margin:"0 0 12px 0"};switch(e){case"grouped":case"inset":return{...r,padding:"12px 16px 0 16px",backgroundColor:"#f8f9fa",borderBottom:"1px solid #e9ecef"};case"sidebar":return{...r,fontSize:"14px",textTransform:"uppercase",letterSpacing:"0.5px",color:"#666",marginBottom:"8px"};default:return{...r,padding:"0 0 8px 0"}}}getContentStyles(){const{style:e="automatic",spacing:r=12}=this.props,o={display:"flex",flexDirection:"column",gap:`${r}px`};switch(e){case"grouped":case"inset":return{...o,padding:"16px"};case"sidebar":return{...o,padding:"8px 0"};default:return{...o,padding:"12px"}}}getFooterStyles(){const{style:e="automatic"}=this.props,r={fontSize:"14px",color:"#666",margin:"8px 0 0 0"};switch(e){case"grouped":case"inset":return{...r,padding:"0 16px 12px 16px",backgroundColor:"#f8f9fa",borderTop:"1px solid #e9ecef"};default:return{...r,padding:"0 0 4px 0"}}}renderHeader(){const e=this.resolveContent(this.props.header);if(!e)return null;const r=this.getHeaderStyles();if(this.props.collapsible){const o=this.isCollapsed()?"▶":"▼";return n.h("div",{style:{...r,cursor:"pointer",display:"flex",alignItems:"center",gap:"8px"},onClick:this.handleToggle},n.h("span",{style:{fontSize:"12px",color:"#666"}},n.text(o)),...typeof e=="string"?[n.text(e)]:this.renderComponentContent(e))}return n.h("div",{style:r},...typeof e=="string"?[n.text(e)]:this.renderComponentContent(e))}renderContent(){const{children:e=[]}=this.props;return this.props.collapsible&&this.isCollapsed()||e.length===0?null:n.h("div",{style:this.getContentStyles()},...e.flatMap(r=>{const o=r.render();return Array.isArray(o)?o:[o]}))}renderFooter(){const e=this.resolveContent(this.props.footer);return e?n.h("div",{style:this.getFooterStyles()},...typeof e=="string"?[n.text(e)]:this.renderComponentContent(e)):null}render(){const{accessibilityLabel:e,accessibilityRole:r="group"}=this.props;return n.h("div",{style:this.getSectionStyles(),"aria-label":e,role:r},...[this.renderHeader(),this.renderContent(),this.renderFooter()].filter(o=>o!==null))}}function i(t,e={}){console.warn("Section from @tachui/core is deprecated. Use FormSection from @tachui/forms for form contexts, or VStack for general layout grouping.");const r={...e,children:t},o=new l(r);return p.withModifiers(o)}function c(t,e,r={}){return i(e,{...r,header:t})}function f(t,e,r,o={}){return i(r,{...o,header:t,footer:e})}const h={Automatic(t,e={}){return i(t,{...e,style:"automatic"})},Grouped(t,e={}){return i(t,{...e,style:"grouped"})},Inset(t,e={}){return i(t,{...e,style:"inset"})},Sidebar(t,e={}){return i(t,{...e,style:"sidebar"})},Plain(t,e={}){return i(t,{...e,style:"plain"})},Collapsible(t,e,r=!1,o={}){return i(e,{...o,header:t,collapsible:!0,collapsed:r})}};exports.EnhancedSection=l;exports.Section=i;exports.SectionStyles=h;exports.SectionWithHeader=c;exports.SectionWithHeaderFooter=f;
+//# sourceMappingURL=Section.cjs.map

package/dist/components/Section.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Section.cjs","sources":["../../src/components/Section.ts"],"sourcesContent":["/**\n * Enhanced Section Component (Phase 6.4.2)\n *\n * @deprecated This component has been superseded by FormSection from @tachui/forms \n * for form contexts, which provides the same features with better semantic HTML.\n * For general layout grouping, use VStack or HStack with styling instead.\n *\n * Migration Guide:\n * - For forms: Replace with FormSection from @tachui/forms\n * - For general grouping: Use VStack with styling modifiers\n * - All props are compatible between Section and FormSection\n *\n * SwiftUI-inspired Section component for grouping form content\n * with headers, footers, and automatic styling.\n */\n\nimport type { ModifiableComponent, ModifierBuilder } from '../modifiers/types'\nimport { isSignal } from '../reactive'\nimport type { Signal } from '../reactive/types'\nimport { h, text } from '../runtime'\nimport type { ComponentInstance, ComponentProps, DOMNode } from '../runtime/types'\nimport { withModifiers } from './wrapper'\n\n/**\n * Section component properties\n */\nexport interface SectionProps extends ComponentProps {\n  children?: ComponentInstance[]\n\n  // Content\n  header?: string | (() => string) | Signal<string> | ComponentInstance\n  footer?: string | (() => string) | Signal<string> | ComponentInstance\n\n  // Styling\n  style?: 'automatic' | 'grouped' | 'inset' | 'plain' | 'sidebar'\n  spacing?: number\n\n  // Behavior\n  collapsible?: boolean\n  collapsed?: boolean | Signal<boolean>\n  onToggle?: (collapsed: boolean) => void\n\n  // Accessibility\n  accessibilityLabel?: string\n  accessibilityRole?: string\n}\n\n/**\n * Enhanced Section component class\n */\nexport class EnhancedSection implements ComponentInstance<SectionProps> {\n  public readonly type = 'component' as const\n  public readonly id: string\n  public mounted = false\n  public cleanup: (() => void)[] = []\n\n  constructor(public props: SectionProps) {\n    this.id = `section-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`\n  }\n\n  /**\n   * Resolve dynamic content\n   */\n  private resolveContent(\n    content: string | (() => string) | Signal<string> | ComponentInstance | undefined\n  ): string | ComponentInstance | null {\n    if (!content) return null\n\n    if (typeof content === 'string') {\n      return content\n    } else if (typeof content === 'function') {\n      return content()\n    } else if (isSignal(content)) {\n      return (content as () => string)()\n    } else {\n      return content as ComponentInstance\n    }\n  }\n\n  /**\n   * Check if section is collapsed\n   */\n  private isCollapsed(): boolean {\n    const { collapsed } = this.props\n    if (typeof collapsed === 'boolean') return collapsed\n    if (isSignal(collapsed)) return (collapsed as () => boolean)()\n    return false\n  }\n\n  /**\n   * Handle toggle action\n   */\n  private handleToggle = () => {\n    if (this.props.onToggle) {\n      this.props.onToggle(!this.isCollapsed())\n    }\n  }\n\n  /**\n   * Helper to render component content safely\n   */\n  private renderComponentContent(content: ComponentInstance): DOMNode[] {\n    const rendered = content.render()\n    return Array.isArray(rendered) ? rendered : [rendered]\n  }\n\n  /**\n   * Get section styles based on style prop\n   */\n  private getSectionStyles() {\n    const { style = 'automatic' } = this.props\n\n    const baseStyles = {\n      marginBottom: '20px',\n    }\n\n    switch (style) {\n      case 'grouped':\n        return {\n          ...baseStyles,\n          backgroundColor: '#ffffff',\n          border: '1px solid #e0e0e0',\n          borderRadius: '12px',\n          overflow: 'hidden' as const,\n        }\n\n      case 'inset':\n        return {\n          ...baseStyles,\n          backgroundColor: '#f8f9fa',\n          border: '1px solid #e9ecef',\n          borderRadius: '8px',\n          margin: '0 16px 20px 16px',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          borderLeft: '3px solid #007AFF',\n          paddingLeft: '16px',\n          backgroundColor: '#f8f9fa',\n          borderRadius: '0 8px 8px 0',\n        }\n\n      case 'plain':\n        return baseStyles\n      default:\n        return {\n          ...baseStyles,\n          backgroundColor: '#ffffff',\n          border: '1px solid #f0f0f0',\n          borderRadius: '8px',\n        }\n    }\n  }\n\n  /**\n   * Get header styles\n   */\n  private getHeaderStyles() {\n    const { style = 'automatic' } = this.props\n\n    const baseStyles = {\n      fontSize: '16px',\n      fontWeight: '600' as const,\n      color: '#1a1a1a',\n      margin: '0 0 12px 0',\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '12px 16px 0 16px',\n          backgroundColor: '#f8f9fa',\n          borderBottom: '1px solid #e9ecef',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          fontSize: '14px',\n          textTransform: 'uppercase' as const,\n          letterSpacing: '0.5px',\n          color: '#666',\n          marginBottom: '8px',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '0 0 8px 0',\n        }\n    }\n  }\n\n  /**\n   * Get content styles\n   */\n  private getContentStyles() {\n    const { style = 'automatic', spacing = 12 } = this.props\n\n    const baseStyles = {\n      display: 'flex',\n      flexDirection: 'column' as const,\n      gap: `${spacing}px`,\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '16px',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          padding: '8px 0',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '12px',\n        }\n    }\n  }\n\n  /**\n   * Get footer styles\n   */\n  private getFooterStyles() {\n    const { style = 'automatic' } = this.props\n\n    const baseStyles = {\n      fontSize: '14px',\n      color: '#666',\n      margin: '8px 0 0 0',\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '0 16px 12px 16px',\n          backgroundColor: '#f8f9fa',\n          borderTop: '1px solid #e9ecef',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '0 0 4px 0',\n        }\n    }\n  }\n\n  /**\n   * Render header content\n   */\n  private renderHeader() {\n    const headerContent = this.resolveContent(this.props.header)\n    if (!headerContent) return null\n\n    const headerStyles = this.getHeaderStyles()\n\n    // Add collapse toggle if collapsible\n    if (this.props.collapsible) {\n      const toggleIcon = this.isCollapsed() ? '▶' : '▼'\n\n      return h(\n        'div',\n        {\n          style: {\n            ...headerStyles,\n            cursor: 'pointer',\n            display: 'flex',\n            alignItems: 'center',\n            gap: '8px',\n          },\n          onClick: this.handleToggle,\n        },\n        h(\n          'span',\n          {\n            style: {\n              fontSize: '12px',\n              color: '#666',\n            },\n          },\n          text(toggleIcon)\n        ),\n\n        ...(typeof headerContent === 'string'\n          ? [text(headerContent)]\n          : this.renderComponentContent(headerContent as ComponentInstance))\n      )\n    }\n\n    return h(\n      'div',\n      { style: headerStyles },\n      ...(typeof headerContent === 'string'\n        ? [text(headerContent)]\n        : this.renderComponentContent(headerContent as ComponentInstance))\n    )\n  }\n\n  /**\n   * Render content\n   */\n  private renderContent() {\n    const { children = [] } = this.props\n\n    // Don't render content if collapsed\n    if (this.props.collapsible && this.isCollapsed()) {\n      return null\n    }\n\n    if (children.length === 0) return null\n\n    return h(\n      'div',\n      {\n        style: this.getContentStyles(),\n      },\n      ...children.flatMap((child) => {\n        const rendered = child.render()\n        return Array.isArray(rendered) ? rendered : [rendered]\n      })\n    )\n  }\n\n  /**\n   * Render footer content\n   */\n  private renderFooter() {\n    const footerContent = this.resolveContent(this.props.footer)\n    if (!footerContent) return null\n\n    return h(\n      'div',\n      {\n        style: this.getFooterStyles(),\n      },\n      ...(typeof footerContent === 'string'\n        ? [text(footerContent)]\n        : this.renderComponentContent(footerContent as ComponentInstance))\n    )\n  }\n\n  render() {\n    const { accessibilityLabel, accessibilityRole = 'group' } = this.props\n\n    return h(\n      'div',\n      {\n        style: this.getSectionStyles(),\n        'aria-label': accessibilityLabel,\n        role: accessibilityRole,\n      },\n      ...[this.renderHeader(), this.renderContent(), this.renderFooter()].filter(\n        (item): item is DOMNode => item !== null\n      )\n    )\n  }\n}\n\n/**\n * Section component function\n * @deprecated Use FormSection from @tachui/forms for form contexts, or VStack for general grouping\n */\nexport function Section(\n  children: ComponentInstance[],\n  props: Omit<SectionProps, 'children'> = {}\n): ModifiableComponent<SectionProps> & {\n  modifier: ModifierBuilder<ModifiableComponent<SectionProps>>\n} {\n  console.warn(\n    'Section from @tachui/core is deprecated. Use FormSection from @tachui/forms for form contexts, or VStack for general layout grouping.'\n  )\n  const sectionProps: SectionProps = { ...props, children }\n  const component = new EnhancedSection(sectionProps)\n  return withModifiers(component)\n}\n\n/**\n * Section with header\n * @deprecated Use FormSection from @tachui/forms\n */\nexport function SectionWithHeader(\n  header: string | (() => string) | Signal<string> | ComponentInstance,\n  children: ComponentInstance[],\n  props: Omit<SectionProps, 'children' | 'header'> = {}\n) {\n  return Section(children, { ...props, header })\n}\n\n/**\n * Section with header and footer\n * @deprecated Use FormSection from @tachui/forms\n */\nexport function SectionWithHeaderFooter(\n  header: string | (() => string) | Signal<string> | ComponentInstance,\n  footer: string | (() => string) | Signal<string> | ComponentInstance,\n  children: ComponentInstance[],\n  props: Omit<SectionProps, 'children' | 'header' | 'footer'> = {}\n) {\n  return Section(children, { ...props, header, footer })\n}\n\n/**\n * Section style variants\n * @deprecated Use FormSection from @tachui/forms with style prop\n */\nexport const SectionStyles = {\n  /**\n   * Automatic section styling (default)\n   */\n  Automatic(children: ComponentInstance[], props: Omit<SectionProps, 'children' | 'style'> = {}) {\n    return Section(children, { ...props, style: 'automatic' })\n  },\n\n  /**\n   * Grouped section with container styling\n   */\n  Grouped(children: ComponentInstance[], props: Omit<SectionProps, 'children' | 'style'> = {}) {\n    return Section(children, { ...props, style: 'grouped' })\n  },\n\n  /**\n   * Inset section styling\n   */\n  Inset(children: ComponentInstance[], props: Omit<SectionProps, 'children' | 'style'> = {}) {\n    return Section(children, { ...props, style: 'inset' })\n  },\n\n  /**\n   * Sidebar-style section\n   */\n  Sidebar(children: ComponentInstance[], props: Omit<SectionProps, 'children' | 'style'> = {}) {\n    return Section(children, { ...props, style: 'sidebar' })\n  },\n\n  /**\n   * Plain section without styling\n   */\n  Plain(children: ComponentInstance[], props: Omit<SectionProps, 'children' | 'style'> = {}) {\n    return Section(children, { ...props, style: 'plain' })\n  },\n\n  /**\n   * Collapsible section\n   */\n  Collapsible(\n    header: string | (() => string) | Signal<string> | ComponentInstance,\n    children: ComponentInstance[],\n    collapsed: boolean | Signal<boolean> = false,\n    props: Omit<SectionProps, 'children' | 'header' | 'collapsible' | 'collapsed'> = {}\n  ) {\n    return Section(children, {\n      ...props,\n      header,\n      collapsible: true,\n      collapsed,\n    })\n  },\n}\n"],"names":["EnhancedSection","props","__publicField","content","isSignal","collapsed","rendered","style","baseStyles","spacing","headerContent","headerStyles","toggleIcon","h","text","children","child","footerContent","accessibilityLabel","accessibilityRole","item","Section","sectionProps","component","withModifiers","SectionWithHeader","header","SectionWithHeaderFooter","footer","SectionStyles"],"mappings":"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"}

package/dist/components/Section.d.ts

@@ -0,0 +1,153 @@
+/**
+ * Enhanced Section Component (Phase 6.4.2)
+ *
+ * @deprecated This component has been superseded by FormSection from @tachui/forms
+ * for form contexts, which provides the same features with better semantic HTML.
+ * For general layout grouping, use VStack or HStack with styling instead.
+ *
+ * Migration Guide:
+ * - For forms: Replace with FormSection from @tachui/forms
+ * - For general grouping: Use VStack with styling modifiers
+ * - All props are compatible between Section and FormSection
+ *
+ * SwiftUI-inspired Section component for grouping form content
+ * with headers, footers, and automatic styling.
+ */
+import type { ModifiableComponent, ModifierBuilder } from '../modifiers/types';
+import type { Signal } from '../reactive/types';
+import type { ComponentInstance, ComponentProps, DOMNode } from '../runtime/types';
+/**
+ * Section component properties
+ */
+export interface SectionProps extends ComponentProps {
+    children?: ComponentInstance[];
+    header?: string | (() => string) | Signal<string> | ComponentInstance;
+    footer?: string | (() => string) | Signal<string> | ComponentInstance;
+    style?: 'automatic' | 'grouped' | 'inset' | 'plain' | 'sidebar';
+    spacing?: number;
+    collapsible?: boolean;
+    collapsed?: boolean | Signal<boolean>;
+    onToggle?: (collapsed: boolean) => void;
+    accessibilityLabel?: string;
+    accessibilityRole?: string;
+}
+/**
+ * Enhanced Section component class
+ */
+export declare class EnhancedSection implements ComponentInstance<SectionProps> {
+    props: SectionProps;
+    readonly type: "component";
+    readonly id: string;
+    mounted: boolean;
+    cleanup: (() => void)[];
+    constructor(props: SectionProps);
+    /**
+     * Resolve dynamic content
+     */
+    private resolveContent;
+    /**
+     * Check if section is collapsed
+     */
+    private isCollapsed;
+    /**
+     * Handle toggle action
+     */
+    private handleToggle;
+    /**
+     * Helper to render component content safely
+     */
+    private renderComponentContent;
+    /**
+     * Get section styles based on style prop
+     */
+    private getSectionStyles;
+    /**
+     * Get header styles
+     */
+    private getHeaderStyles;
+    /**
+     * Get content styles
+     */
+    private getContentStyles;
+    /**
+     * Get footer styles
+     */
+    private getFooterStyles;
+    /**
+     * Render header content
+     */
+    private renderHeader;
+    /**
+     * Render content
+     */
+    private renderContent;
+    /**
+     * Render footer content
+     */
+    private renderFooter;
+    render(): DOMNode;
+}
+/**
+ * Section component function
+ * @deprecated Use FormSection from @tachui/forms for form contexts, or VStack for general grouping
+ */
+export declare function Section(children: ComponentInstance[], props?: Omit<SectionProps, 'children'>): ModifiableComponent<SectionProps> & {
+    modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+};
+/**
+ * Section with header
+ * @deprecated Use FormSection from @tachui/forms
+ */
+export declare function SectionWithHeader(header: string | (() => string) | Signal<string> | ComponentInstance, children: ComponentInstance[], props?: Omit<SectionProps, 'children' | 'header'>): ModifiableComponent<SectionProps> & {
+    modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+};
+/**
+ * Section with header and footer
+ * @deprecated Use FormSection from @tachui/forms
+ */
+export declare function SectionWithHeaderFooter(header: string | (() => string) | Signal<string> | ComponentInstance, footer: string | (() => string) | Signal<string> | ComponentInstance, children: ComponentInstance[], props?: Omit<SectionProps, 'children' | 'header' | 'footer'>): ModifiableComponent<SectionProps> & {
+    modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+};
+/**
+ * Section style variants
+ * @deprecated Use FormSection from @tachui/forms with style prop
+ */
+export declare const SectionStyles: {
+    /**
+     * Automatic section styling (default)
+     */
+    Automatic(children: ComponentInstance[], props?: Omit<SectionProps, "children" | "style">): ModifiableComponent<SectionProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+    };
+    /**
+     * Grouped section with container styling
+     */
+    Grouped(children: ComponentInstance[], props?: Omit<SectionProps, "children" | "style">): ModifiableComponent<SectionProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+    };
+    /**
+     * Inset section styling
+     */
+    Inset(children: ComponentInstance[], props?: Omit<SectionProps, "children" | "style">): ModifiableComponent<SectionProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+    };
+    /**
+     * Sidebar-style section
+     */
+    Sidebar(children: ComponentInstance[], props?: Omit<SectionProps, "children" | "style">): ModifiableComponent<SectionProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+    };
+    /**
+     * Plain section without styling
+     */
+    Plain(children: ComponentInstance[], props?: Omit<SectionProps, "children" | "style">): ModifiableComponent<SectionProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+    };
+    /**
+     * Collapsible section
+     */
+    Collapsible(header: string | (() => string) | Signal<string> | ComponentInstance, children: ComponentInstance[], collapsed?: boolean | Signal<boolean>, props?: Omit<SectionProps, "children" | "header" | "collapsible" | "collapsed">): ModifiableComponent<SectionProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<SectionProps>>;
+    };
+};
+//# sourceMappingURL=Section.d.ts.map

package/dist/components/Section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../../src/components/Section.ts"],"names":[],"mappings":"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"}