@meursyphus/flitter 0.0.4 → 0.0.5

package/index.global.js

@@ -578,6 +578,10 @@
 
   // src/type/_types/_calculable.ts
   var Calculable = class extends data_default {
+    constructor() {
+      super(...arguments);
+      __publicField(this, "isCalculable", true);
+    }
     plus(_other) {
       throw Error("plus is not implemented");
     }
@@ -959,7 +963,7 @@
       if (typeof a === "number") {
         return lerp_default(a, b, t);
       }
-      assert(b instanceof calculable_default);
+      assert(b == null ? void 0 : b.isCalculable, "b is not a Calculable");
       return a.plus(b.minus(a).multiply(t));
     }
   };
@@ -1857,6 +1861,7 @@
   // src/type/_types/_vector4.ts
   var Vector4 = class _Vector4 {
     constructor(arg0, arg1, arg2, arg3) {
+      __publicField(this, "type", "v4");
       __publicField(this, "_v4storage");
       this._v4storage = [arg0, arg1, arg2, arg3];
     }
@@ -7236,6 +7241,7 @@
   // src/type/_types/_vector2.ts
   var Vector2 = class _Vector2 {
     constructor(arg0, arg1) {
+      __publicField(this, "type", "v2");
       __publicField(this, "_v2storage");
       this._v2storage = [arg0, arg1];
     }
@@ -7292,63 +7298,63 @@
       return new _Vector2(this._v2storage[1], this._v2storage[1]);
     }
     get xxx() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[0],
         this._v2storage[0],
         this._v2storage[0]
       );
     }
     get xxy() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[0],
         this._v2storage[0],
         this._v2storage[1]
       );
     }
     get xyx() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[0],
         this._v2storage[1],
         this._v2storage[0]
       );
     }
     get xyy() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[0],
         this._v2storage[1],
         this._v2storage[1]
       );
     }
     get yxx() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[1],
         this._v2storage[0],
         this._v2storage[0]
       );
     }
     get yxy() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[1],
         this._v2storage[0],
         this._v2storage[1]
       );
     }
     get yyx() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[1],
         this._v2storage[1],
         this._v2storage[0]
       );
     }
     get yyy() {
-      return new vector3_default(
+      return new Vector3(
         this._v2storage[1],
         this._v2storage[1],
         this._v2storage[1]
       );
     }
     get xxxx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[0],
         this._v2storage[0],
@@ -7356,7 +7362,7 @@
       );
     }
     get xxxy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[0],
         this._v2storage[0],
@@ -7364,7 +7370,7 @@
       );
     }
     get xxyx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[0],
         this._v2storage[1],
@@ -7372,7 +7378,7 @@
       );
     }
     get xxyy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[0],
         this._v2storage[1],
@@ -7380,7 +7386,7 @@
       );
     }
     get xyxx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[1],
         this._v2storage[0],
@@ -7388,7 +7394,7 @@
       );
     }
     get xyxy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[1],
         this._v2storage[0],
@@ -7396,7 +7402,7 @@
       );
     }
     get xyyx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[1],
         this._v2storage[1],
@@ -7404,7 +7410,7 @@
       );
     }
     get xyyy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[0],
         this._v2storage[1],
         this._v2storage[1],
@@ -7412,7 +7418,7 @@
       );
     }
     get yxxx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[0],
         this._v2storage[0],
@@ -7420,7 +7426,7 @@
       );
     }
     get yxxy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[0],
         this._v2storage[0],
@@ -7428,7 +7434,7 @@
       );
     }
     get yxyx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[0],
         this._v2storage[1],
@@ -7436,7 +7442,7 @@
       );
     }
     get yxyy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[0],
         this._v2storage[1],
@@ -7444,7 +7450,7 @@
       );
     }
     get yyxx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[1],
         this._v2storage[0],
@@ -7452,7 +7458,7 @@
       );
     }
     get yyxy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[1],
         this._v2storage[0],
@@ -7460,7 +7466,7 @@
       );
     }
     get yyyx() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[1],
         this._v2storage[1],
@@ -7468,7 +7474,7 @@
       );
     }
     get yyyy() {
-      return new vector4_default(
+      return new Vector4(
         this._v2storage[1],
         this._v2storage[1],
         this._v2storage[1],
@@ -7667,6 +7673,7 @@
   // src/type/_types/_vector3.ts
   var Vector3 = class _Vector3 {
     constructor(arg0, arg1, arg2) {
+      __publicField(this, "type", "v3");
       __publicField(this, "_v3storage");
       this._v3storage = [arg0, arg1, arg2];
     }
@@ -10344,12 +10351,12 @@
      */
     translate(x, y, z) {
       let tx, ty, tz;
-      const tw = x instanceof vector4_default ? x.w : 1;
-      if (x instanceof vector3_default) {
+      const tw = (x == null ? void 0 : x.type) === "v4" ? x.w : 1;
+      if ((x == null ? void 0 : x.type) === "v3") {
         tx = x.x;
         ty = x.y;
         tz = x.z;
-      } else if (x instanceof vector4_default) {
+      } else if ((x == null ? void 0 : x.type) === "v4") {
         tx = x.x;
         ty = x.y;
         tz = x.z;
@@ -10379,21 +10386,21 @@
      */
     leftTranslate(x, y = 0, z = 0) {
       let tx, ty, tz;
-      const tw = x instanceof vector4_default ? x.w : 1;
-      if (x instanceof vector3_default) {
+      const tw = (x == null ? void 0 : x.type) === "v4" ? x.w : 1;
+      if ((x == null ? void 0 : x.type) === "v3") {
         tx = x.x;
         ty = x.y;
         tz = x.z;
-      } else if (x instanceof vector4_default) {
+      } else if ((x == null ? void 0 : x.type) === "v4") {
         tx = x.x;
         ty = x.y;
         tz = x.z;
       } else if (typeof x === "number") {
         tx = x;
-        ty = y;
-        tz = z;
+        ty = y || 0;
+        tz = z || 0;
       } else {
-        throw new Error("Invalid argument type");
+        throw new Error("Unsupported argument type.");
       }
       this._m4storage[0] += tx * this._m4storage[3];
       this._m4storage[1] += ty * this._m4storage[3];
@@ -10538,12 +10545,12 @@
       let sx;
       let sy;
       let sz;
-      const sw = x instanceof vector4_default ? x.w : 1;
-      if (x instanceof vector3_default) {
+      const sw = (x == null ? void 0 : x.type) === "v4" ? x.w : 1;
+      if (x.type === "v3") {
         sx = x.x;
         sy = x.y;
         sz = x.z;
-      } else if (x instanceof vector4_default) {
+      } else if (x.type === "v4") {
         sx = x.x;
         sy = x.y;
         sz = x.z;
@@ -11910,8 +11917,6 @@
     equals(other) {
       if (this === other)
         return true;
-      if (!(other instanceof _Border))
-        return false;
       return this.top.equals(other.top) && this.right.equals(other.right) && this.bottom.equals(other.bottom) && this.left.equals(other.left);
     }
     /**
@@ -12304,8 +12309,6 @@
     equals(other) {
       if (this === other)
         return true;
-      if (!(other instanceof _BoxDecoration))
-        return false;
       if (!(this.color == null && other.color == null) && (!(this.color != null && other.color != null) || !this.color.equals(other.color))) {
         return false;
       }
@@ -12675,6 +12678,7 @@
   var _domNode, _domOrder, _domOrderChanged;
   var RenderObject = class {
     constructor({ isPainter }) {
+      __publicField(this, "runtimeType", this.constructor.name);
       __publicField(this, "isPainter");
       __publicField(this, "ownerElement");
       __publicField(this, "renderOwner");
@@ -12970,485 +12974,489 @@
   };
   var Widget_default = Widget;
 
-  // src/scheduler/BuildOwner.ts
-  var BuildOwner = class {
-    constructor({ onNeedVisualUpdate }) {
-      __publicField(this, "onNeedVisualUpdate");
-      __publicField(this, "dirtyElements", []);
-      __publicField(this, "globalKeyRegistry", /* @__PURE__ */ new WeakMap());
-      this.onNeedVisualUpdate = () => onNeedVisualUpdate();
-    }
-    scheduleFor(elememt) {
-      this.dirtyElements.push(elememt);
-      this.requestVisualUpdate();
+  // src/element/Element.ts
+  var Element = class {
+    constructor(widget) {
+      __publicField(this, "scheduler");
+      __publicField(this, "renderContext");
+      __publicField(this, "buildOwner");
+      __publicField(this, "widget");
+      __publicField(this, "parent");
+      __publicField(this, "dirty", true);
+      __publicField(this, "depth", 0);
+      __publicField(this, "type", "none");
+      this.widget = widget;
     }
-    requestVisualUpdate() {
-      this.onNeedVisualUpdate();
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    visitChildren(visitor) {
+      throw { message: "not implemented" };
     }
-    flushBuild() {
-      const dirtyElements = this.dirtyElements;
-      this.dirtyElements = [];
-      dirtyElements.sort((a, b) => a.depth - b.depth).forEach((elememt) => {
-        if (!elememt.dirty)
-          return;
-        elememt.rebuild();
+    get renderObject() {
+      let result = null;
+      this.visitChildren((child) => {
+        result = child.renderObject;
       });
+      if (result == null)
+        throw { message: "can not find render object" };
+      return result;
     }
-    registerGlobalKey(key, elememt) {
-      key.buildOwner = this;
-      this.globalKeyRegistry.set(key, elememt);
+    //There are 5 case
+    // 1. child is not null, but widget is null
+    // in this case, child must be unmounted
+    // 2. child is null, widget is null
+    // nothing happend
+    // 3. child is null, widget is not null
+    // newWidget would be inflated,
+    // 4. child is not null, widget is not null, and widget can be update
+    // in this case, just update widget configruation
+    // 5. it is similar to 4 but widget can not be update,
+    // in this case, child must be unmounted and newWidget would be inflated
+    updateChild(child, newWidget) {
+      if (child != null && newWidget == null) {
+        child.unmount();
+        return null;
+      } else if (child == null && newWidget == null) {
+      } else if (child == null && newWidget != null) {
+        return this.inflateWidget(newWidget);
+      } else if (child != null && newWidget != null && Widget_default.canUpdate(child.widget, newWidget)) {
+        child.update(newWidget);
+        return child;
+      } else {
+        child.unmount();
+        return this.inflateWidget(newWidget);
+      }
     }
-    findByGlobalKey(key) {
-      const result = this.globalKeyRegistry.get(key);
-      return result;
+    unmount() {
+      this.parent = void 0;
     }
-  };
-  var BuildOwner_default = BuildOwner;
-
-  // src/scheduler/RenderOwner.ts
-  var RenderOwner = class {
-    constructor({
-      onNeedVisualUpdate,
-      paintContext
-    }) {
-      __publicField(this, "paintContext");
-      __publicField(this, "onNeedVisualUpdate");
-      __publicField(this, "needsPaintRenderObjects", []);
-      __publicField(this, "needsLayoutRenderObjects", []);
-      /*
-       this will be set by RenderView
-      */
-      __publicField(this, "renderView");
-      __publicField(this, "domOrderChanged", true);
-      this.onNeedVisualUpdate = onNeedVisualUpdate;
-      this.paintContext = paintContext;
+    mount(newParent) {
+      var _a;
+      if (newParent) {
+        this.renderContext = newParent.renderContext;
+        this.buildOwner = newParent.buildOwner;
+        this.depth = newParent.depth + 1;
+        this.scheduler = newParent.scheduler;
+      }
+      this.parent = newParent;
+      if ((_a = this.widget.key) == null ? void 0 : _a.isGlobalKey) {
+        this.buildOwner.registerGlobalKey(this.widget.key, this);
+      }
     }
-    requestVisualUpdate() {
-      this.onNeedVisualUpdate();
+    update(newWidget) {
+      this.widget = newWidget;
     }
-    drawFrame() {
-      this.flushLayout();
-      this.rearrangeDomOrder();
-      this.flushPaint();
+    inflateWidget(childWidget) {
+      const newChild = childWidget.createElement();
+      newChild.mount(this);
+      return newChild;
     }
-    rearrangeDomOrder() {
-      if (!this.domOrderChanged)
+    rebuild({ force = false } = {}) {
+      if (!this.dirty && !force)
         return;
-      this.domOrderChanged = false;
-      const domOrderVisitor = new DomOrderVisitor();
-      this.renderView.accept(domOrderVisitor);
-      const painterRenderObjects = domOrderVisitor.getRenderObjectsByDomOrder();
-      for (let i = painterRenderObjects.length - 1; i >= 0; i--) {
-        const renderObject = painterRenderObjects[i];
-        renderObject.domOrder = i;
-        renderObject.rearrangeDomOrder();
-      }
-    }
-    didDomOrderChange() {
-      this.domOrderChanged = true;
+      this.dirty = false;
+      this.performRebuild();
     }
-    flushLayout() {
-      const dirties = this.needsLayoutRenderObjects;
-      this.needsLayoutRenderObjects = [];
-      dirties.sort((a, b) => a.depth - b.depth).forEach((renderObject) => {
-        if (!renderObject.needsLayout)
-          return;
-        renderObject.layoutWithoutResize();
-      });
+    performRebuild() {
+      throw new Error("not implemented performRebuild");
     }
-    flushPaint() {
-      const dirties = this.needsPaintRenderObjects;
-      this.needsPaintRenderObjects = [];
-      dirties.sort((a, b) => a.depth - b.depth).forEach((renderObject) => {
-        if (!renderObject.needsPaint)
-          return;
-        renderObject.paintWithoutLayout(this.paintContext);
-      });
+    markNeedsBuild() {
+      this.dirty = true;
+      this.buildOwner.scheduleFor(this);
     }
   };
-  var DomOrderVisitor = class {
-    constructor() {
-      __publicField(this, "collectedRenderObjects", []);
-      __publicField(this, "currentVisitedOrder", 0);
-      __publicField(this, "currentStackingContext", []);
+  var Element_default = Element;
+
+  // src/element/RenderObjectElement.ts
+  var RenderObjectElement = class extends Element_default {
+    constructor(widget) {
+      super(widget);
+      __publicField(this, "children");
+      __publicField(this, "_renderObject");
+      __publicField(this, "type", "render");
+      __publicField(this, "ancestorRenderObjectElement");
     }
-    visit(renderObject, { willCollect }) {
-      if (willCollect) {
-        this.collectedRenderObjects.push({
-          renderObject,
-          contexts: this.currentStackingContext,
-          visitedOrder: this.currentVisitedOrder++
-        });
-      }
-      renderObject.visitChildren((child) => {
-        child.accept(this);
-      });
+    createRenderObject() {
+      const renderObject = this.widget.createRenderObject();
+      return renderObject;
     }
-    visitGeneral(renderObject) {
-      this.visit(renderObject, { willCollect: renderObject.isPainter });
+    get renderObject() {
+      return this._renderObject;
     }
-    visitZIndex(renderObject) {
-      this.currentStackingContext = [...this.currentStackingContext];
-      this.currentStackingContext.push({
-        visitedOrder: this.currentVisitedOrder,
-        zIndex: renderObject.zIndex
+    unmount() {
+      super.unmount();
+      this.renderObject.dispose(this.renderContext.paintContext);
+      this.children.forEach((child) => {
+        child.unmount();
       });
-      this.visit(renderObject, { willCollect: false });
-      this.currentStackingContext = [...this.currentStackingContext];
-      this.currentStackingContext.pop();
+      this._renderObject.markNeedsParentLayout();
     }
-    getRenderObjectsByDomOrder() {
-      const sorted = this.collectedRenderObjects.sort((a, b) => {
-        var _a, _b;
-        const limit = Math.min(a.contexts.length, b.contexts.length);
-        for (let i = 0; i < limit; i++) {
-          const aContext = a.contexts[i];
-          const bContext = b.contexts[i];
-          if (aContext.zIndex !== bContext.zIndex) {
-            return aContext.zIndex - bContext.zIndex;
-          } else if (aContext.visitedOrder !== bContext.visitedOrder) {
-            return aContext.visitedOrder - bContext.visitedOrder;
-          }
-        }
-        if (limit > 0) {
-          const lastContext = a.contexts[limit - 1];
-          if (lastContext.visitedOrder === a.visitedOrder || lastContext.visitedOrder === b.visitedOrder) {
-            return a.visitedOrder - b.visitedOrder;
-          }
-        }
-        if (a.contexts.length !== b.contexts.length) {
-          const aContext = (_a = a.contexts[limit]) != null ? _a : {
-            visitedOrder: a.visitedOrder,
-            zIndex: 0
-          };
-          const bContext = (_b = b.contexts[limit]) != null ? _b : {
-            visitedOrder: b.visitedOrder,
-            zIndex: 0
-          };
-          if (aContext.zIndex !== bContext.zIndex) {
-            return aContext.zIndex - bContext.zIndex;
-          } else if (aContext.visitedOrder !== bContext.visitedOrder) {
-            return aContext.visitedOrder - bContext.visitedOrder;
-          }
-        }
-        return a.visitedOrder - b.visitedOrder;
-      });
-      return sorted.map(({ renderObject }) => renderObject);
-    }
-  };
-  var RenderOwner_default = RenderOwner;
-
-  // src/scheduler/Scheduler.ts
-  var Scheduler = class {
-    constructor() {
-      __publicField(this, "phase");
-      __publicField(this, "persistenceCallbacks");
-      __publicField(this, "postFrameCallbacks");
-      this.phase = 0 /* idle */;
-      this.persistenceCallbacks = [];
-      this.postFrameCallbacks = [];
-    }
-    schedule() {
-      switch (this.phase) {
-        case 0 /* idle */:
-        case 2 /* postFrameCallbacks */:
-          this.performSchedule();
-          break;
-        case 1 /* persistenceCallbacks */:
-          break;
+    mount(newParent) {
+      var _a;
+      super.mount(newParent);
+      this._renderObject = this.createRenderObject();
+      this.ancestorRenderObjectElement = this.findAncestorRenderObjectElement();
+      const ancestorRenderObject = (_a = this.ancestorRenderObjectElement) == null ? void 0 : _a.renderObject;
+      if (ancestorRenderObject) {
+        this.renderObject.parent = ancestorRenderObject;
+        this.renderObject.renderOwner = ancestorRenderObject.renderOwner;
       }
+      this.children = this.widget.children.map(
+        (childWidget) => this.inflateWidget(childWidget)
+      );
+      this._renderObject.attach(this);
+      this._renderObject.markNeedsParentLayout();
     }
-    performSchedule() {
-      this.phase = 1 /* persistenceCallbacks */;
-      this.persistenceCallbacks.forEach((callback) => {
-        callback();
+    update(newWidget) {
+      super.update(newWidget);
+      this.rebuild({ force: true });
+    }
+    updateChildren(newWidgets) {
+      const updatedChildIndexes = [];
+      const oldChildren = this.children;
+      const newChildren = newWidgets.map((newWidget) => {
+        const matchedChildIndex = oldChildren.findIndex(
+          (oldChild, oldChildIndex) => !updatedChildIndexes.includes(oldChildIndex) && Widget_default.canUpdate(newWidget, oldChild.widget)
+        );
+        let matchedChild;
+        if (matchedChildIndex === -1) {
+          matchedChild = null;
+        } else {
+          matchedChild = oldChildren[matchedChildIndex];
+          updatedChildIndexes.push(matchedChildIndex);
+        }
+        return this.updateChild(matchedChild, newWidget);
       });
-      this.phase = 2 /* postFrameCallbacks */;
-      this.postFrameCallbacks.forEach((callback) => {
-        callback();
+      oldChildren.forEach((oldChild, i) => {
+        if (updatedChildIndexes.includes(i))
+          return;
+        this.updateChild(oldChild, null);
       });
-      this.postFrameCallbacks = [];
-      this.phase = 0 /* idle */;
+      this.children = newChildren;
     }
-    addPersistenceCallbacks(callback) {
-      this.persistenceCallbacks.push(() => callback());
+    performRebuild() {
+      this.widget.updateRenderObject(this._renderObject);
+      const newChildWidgets = this.widget.children;
+      this.updateChildren(newChildWidgets);
     }
-    addPostFrameCallbacks(callback) {
-      this.postFrameCallbacks.push(() => callback());
+    visitChildren(visitor) {
+      this.children.forEach((child) => visitor(child));
+    }
+    findAncestorRenderObjectElement() {
+      let ancestor = this.parent;
+      while (ancestor != null && !(ancestor.type === "render")) {
+        ancestor = ancestor.parent;
+      }
+      return ancestor;
     }
   };
-  var Scheduler_default = Scheduler;
+  var RenderObjectElement_default = RenderObjectElement;
 
-  // src/scheduler/RenderFrameDispatcher.ts
-  var RenderFrameDispatcher = class {
-    constructor({ onFrame } = {}) {
-      __publicField(this, "onFrame");
-      this.onFrame = onFrame;
+  // src/widget/RenderObjectWidget.ts
+  var RenderObjectWidget = class extends Widget_default {
+    constructor({ children = [], key }) {
+      super(key);
+      __publicField(this, "children");
+      this.children = children;
     }
-    setOnFrame(callback) {
-      this.onFrame = () => callback();
+    createElement() {
+      return new RenderObjectElement_default(this);
     }
-    // Actually we dont need to invoke browser to render because browser automatically render its own state periodically
-    // so Here we just call onFrame callback.
-    dispatch() {
-      if (typeof window === "undefined") {
-        setTimeout(() => {
-          var _a;
-          (_a = this.onFrame) == null ? void 0 : _a.call(this);
-        }, 0);
-      } else {
-        window.requestAnimationFrame(() => {
-          var _a;
-          (_a = this.onFrame) == null ? void 0 : _a.call(this);
-        });
-      }
+    createRenderObject() {
+      throw { message: "not implemented createRenderObject" };
+    }
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    updateRenderObject(renderObject) {
+      throw { message: "not implemented updatedRenderObject" };
     }
   };
-  var RenderFrameDispatcher_default = RenderFrameDispatcher;
+  var RenderObjectWidget_default = RenderObjectWidget;
 
-  // src/scheduler/Globalkey.ts
-  var GlobalKey = class {
-    constructor() {
+  // src/widget/RenderObjectToWidgetAdapter.ts
+  var RenderObjectToWidgetAdapter = class extends RenderObjectWidget_default {
+    constructor({
+      app,
+      renderOwner,
+      buildOwner,
+      renderContext,
+      scheduler
+    }) {
+      super({ children: [app] });
+      __publicField(this, "renderOwner");
       __publicField(this, "buildOwner");
+      __publicField(this, "renderContext");
+      __publicField(this, "scheduler");
+      this.renderOwner = renderOwner;
+      this.buildOwner = buildOwner;
+      this.renderContext = renderContext;
+      this.scheduler = scheduler;
     }
-    get currentContext() {
-      assert(
-        this.buildOwner != null,
-        "buildOwner is null, currentContext must be called after initState"
-      );
-      return this.buildOwner.findByGlobalKey(this);
+    createElement() {
+      const el = super.createElement();
+      el.renderContext = this.renderContext;
+      el.buildOwner = this.buildOwner;
+      el.scheduler = this.scheduler;
+      return el;
+    }
+    createRenderObject() {
+      return new RenderView_default({ renderOwner: this.renderOwner });
+    }
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    updateRenderObject(renderObject) {
     }
   };
-  var Globalkey_default = GlobalKey;
+  var RenderObjectToWidgetAdapter_default = RenderObjectToWidgetAdapter;
 
-  // src/element/Element.ts
-  var Element = class {
-    constructor(widget) {
-      __publicField(this, "scheduler");
-      __publicField(this, "renderContext");
-      __publicField(this, "buildOwner");
-      __publicField(this, "widget");
-      __publicField(this, "parent");
-      __publicField(this, "dirty", true);
-      __publicField(this, "depth", 0);
-      this.widget = widget;
+  // src/scheduler/BuildOwner.ts
+  var BuildOwner = class {
+    constructor({ onNeedVisualUpdate }) {
+      __publicField(this, "onNeedVisualUpdate");
+      __publicField(this, "dirtyElements", []);
+      __publicField(this, "globalKeyRegistry", /* @__PURE__ */ new WeakMap());
+      this.onNeedVisualUpdate = () => onNeedVisualUpdate();
     }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    visitChildren(visitor) {
-      throw { message: "not implemented" };
+    scheduleFor(elememt) {
+      this.dirtyElements.push(elememt);
+      this.requestVisualUpdate();
     }
-    get renderObject() {
-      let result = null;
-      this.visitChildren((child) => {
-        result = child.renderObject;
+    requestVisualUpdate() {
+      this.onNeedVisualUpdate();
+    }
+    flushBuild() {
+      const dirtyElements = this.dirtyElements;
+      this.dirtyElements = [];
+      dirtyElements.sort((a, b) => a.depth - b.depth).forEach((elememt) => {
+        if (!elememt.dirty)
+          return;
+        elememt.rebuild();
       });
-      if (result == null)
-        throw { message: "can not find render object" };
+    }
+    registerGlobalKey(key, elememt) {
+      key.buildOwner = this;
+      this.globalKeyRegistry.set(key, elememt);
+    }
+    findByGlobalKey(key) {
+      const result = this.globalKeyRegistry.get(key);
       return result;
     }
-    //There are 5 case
-    // 1. child is not null, but widget is null
-    // in this case, child must be unmounted
-    // 2. child is null, widget is null
-    // nothing happend
-    // 3. child is null, widget is not null
-    // newWidget would be inflated,
-    // 4. child is not null, widget is not null, and widget can be update
-    // in this case, just update widget configruation
-    // 5. it is similar to 4 but widget can not be update,
-    // in this case, child must be unmounted and newWidget would be inflated
-    updateChild(child, newWidget) {
-      if (child != null && newWidget == null) {
-        child.unmount();
-        return null;
-      } else if (child == null && newWidget == null) {
-      } else if (child == null && newWidget != null) {
-        return this.inflateWidget(newWidget);
-      } else if (child != null && newWidget != null && Widget_default.canUpdate(child.widget, newWidget)) {
-        child.update(newWidget);
-        return child;
-      } else {
-        child.unmount();
-        return this.inflateWidget(newWidget);
-      }
+  };
+  var BuildOwner_default = BuildOwner;
+
+  // src/scheduler/RenderOwner.ts
+  var RenderOwner = class {
+    constructor({
+      onNeedVisualUpdate,
+      paintContext
+    }) {
+      __publicField(this, "paintContext");
+      __publicField(this, "onNeedVisualUpdate");
+      __publicField(this, "needsPaintRenderObjects", []);
+      __publicField(this, "needsLayoutRenderObjects", []);
+      /*
+       this will be set by RenderView
+      */
+      __publicField(this, "renderView");
+      __publicField(this, "domOrderChanged", true);
+      this.onNeedVisualUpdate = onNeedVisualUpdate;
+      this.paintContext = paintContext;
     }
-    unmount() {
-      this.parent = void 0;
+    requestVisualUpdate() {
+      this.onNeedVisualUpdate();
     }
-    mount(newParent) {
-      if (newParent) {
-        this.renderContext = newParent.renderContext;
-        this.buildOwner = newParent.buildOwner;
-        this.depth = newParent.depth + 1;
-        this.scheduler = newParent.scheduler;
-      }
-      this.parent = newParent;
-      if (this.widget.key instanceof Globalkey_default) {
-        this.buildOwner.registerGlobalKey(this.widget.key, this);
+    drawFrame() {
+      this.flushLayout();
+      this.rearrangeDomOrder();
+      this.flushPaint();
+    }
+    rearrangeDomOrder() {
+      if (!this.domOrderChanged)
+        return;
+      this.domOrderChanged = false;
+      const domOrderVisitor = new DomOrderVisitor();
+      this.renderView.accept(domOrderVisitor);
+      const painterRenderObjects = domOrderVisitor.getRenderObjectsByDomOrder();
+      for (let i = painterRenderObjects.length - 1; i >= 0; i--) {
+        const renderObject = painterRenderObjects[i];
+        renderObject.domOrder = i;
+        renderObject.rearrangeDomOrder();
       }
     }
-    update(newWidget) {
-      this.widget = newWidget;
+    didDomOrderChange() {
+      this.domOrderChanged = true;
     }
-    inflateWidget(childWidget) {
-      const newChild = childWidget.createElement();
-      newChild.mount(this);
-      return newChild;
+    flushLayout() {
+      const dirties = this.needsLayoutRenderObjects;
+      this.needsLayoutRenderObjects = [];
+      dirties.sort((a, b) => a.depth - b.depth).forEach((renderObject) => {
+        if (!renderObject.needsLayout)
+          return;
+        renderObject.layoutWithoutResize();
+      });
     }
-    rebuild({ force = false } = {}) {
-      if (!this.dirty && !force)
-        return;
-      this.dirty = false;
-      this.performRebuild();
+    flushPaint() {
+      const dirties = this.needsPaintRenderObjects;
+      this.needsPaintRenderObjects = [];
+      dirties.sort((a, b) => a.depth - b.depth).forEach((renderObject) => {
+        if (!renderObject.needsPaint)
+          return;
+        renderObject.paintWithoutLayout(this.paintContext);
+      });
     }
-    performRebuild() {
-      throw new Error("not implemented performRebuild");
+  };
+  var DomOrderVisitor = class {
+    constructor() {
+      __publicField(this, "collectedRenderObjects", []);
+      __publicField(this, "currentVisitedOrder", 0);
+      __publicField(this, "currentStackingContext", []);
     }
-    markNeedsBuild() {
-      this.dirty = true;
-      this.buildOwner.scheduleFor(this);
+    visit(renderObject, { willCollect }) {
+      if (willCollect) {
+        this.collectedRenderObjects.push({
+          renderObject,
+          contexts: this.currentStackingContext,
+          visitedOrder: this.currentVisitedOrder++
+        });
+      }
+      renderObject.visitChildren((child) => {
+        child.accept(this);
+      });
+    }
+    visitGeneral(renderObject) {
+      this.visit(renderObject, { willCollect: renderObject.isPainter });
+    }
+    visitZIndex(renderObject) {
+      this.currentStackingContext = [...this.currentStackingContext];
+      this.currentStackingContext.push({
+        visitedOrder: this.currentVisitedOrder,
+        zIndex: renderObject.zIndex
+      });
+      this.visit(renderObject, { willCollect: false });
+      this.currentStackingContext = [...this.currentStackingContext];
+      this.currentStackingContext.pop();
+    }
+    getRenderObjectsByDomOrder() {
+      const sorted = this.collectedRenderObjects.sort((a, b) => {
+        var _a, _b;
+        const limit = Math.min(a.contexts.length, b.contexts.length);
+        for (let i = 0; i < limit; i++) {
+          const aContext = a.contexts[i];
+          const bContext = b.contexts[i];
+          if (aContext.zIndex !== bContext.zIndex) {
+            return aContext.zIndex - bContext.zIndex;
+          } else if (aContext.visitedOrder !== bContext.visitedOrder) {
+            return aContext.visitedOrder - bContext.visitedOrder;
+          }
+        }
+        if (limit > 0) {
+          const lastContext = a.contexts[limit - 1];
+          if (lastContext.visitedOrder === a.visitedOrder || lastContext.visitedOrder === b.visitedOrder) {
+            return a.visitedOrder - b.visitedOrder;
+          }
+        }
+        if (a.contexts.length !== b.contexts.length) {
+          const aContext = (_a = a.contexts[limit]) != null ? _a : {
+            visitedOrder: a.visitedOrder,
+            zIndex: 0
+          };
+          const bContext = (_b = b.contexts[limit]) != null ? _b : {
+            visitedOrder: b.visitedOrder,
+            zIndex: 0
+          };
+          if (aContext.zIndex !== bContext.zIndex) {
+            return aContext.zIndex - bContext.zIndex;
+          } else if (aContext.visitedOrder !== bContext.visitedOrder) {
+            return aContext.visitedOrder - bContext.visitedOrder;
+          }
+        }
+        return a.visitedOrder - b.visitedOrder;
+      });
+      return sorted.map(({ renderObject }) => renderObject);
     }
   };
-  var Element_default = Element;
+  var RenderOwner_default = RenderOwner;
 
-  // src/element/RenderObjectElement.ts
-  var RenderObjectElement = class _RenderObjectElement extends Element_default {
-    constructor(widget) {
-      super(widget);
-      __publicField(this, "children");
-      __publicField(this, "_renderObject");
-      __publicField(this, "ancestorRenderObjectElement");
-    }
-    createRenderObject() {
-      const renderObject = this.widget.createRenderObject();
-      return renderObject;
-    }
-    get renderObject() {
-      return this._renderObject;
-    }
-    unmount() {
-      super.unmount();
-      this.renderObject.dispose(this.renderContext.paintContext);
-      this.children.forEach((child) => {
-        child.unmount();
-      });
-      this._renderObject.markNeedsParentLayout();
+  // src/scheduler/Scheduler.ts
+  var Scheduler = class {
+    constructor() {
+      __publicField(this, "phase");
+      __publicField(this, "persistenceCallbacks");
+      __publicField(this, "postFrameCallbacks");
+      this.phase = 0 /* idle */;
+      this.persistenceCallbacks = [];
+      this.postFrameCallbacks = [];
     }
-    mount(newParent) {
-      var _a;
-      super.mount(newParent);
-      this._renderObject = this.createRenderObject();
-      this.ancestorRenderObjectElement = this.findAncestorRenderObjectElement();
-      const ancestorRenderObject = (_a = this.ancestorRenderObjectElement) == null ? void 0 : _a.renderObject;
-      if (ancestorRenderObject) {
-        this.renderObject.parent = ancestorRenderObject;
-        this.renderObject.renderOwner = ancestorRenderObject.renderOwner;
+    schedule() {
+      switch (this.phase) {
+        case 0 /* idle */:
+        case 2 /* postFrameCallbacks */:
+          this.performSchedule();
+          break;
+        case 1 /* persistenceCallbacks */:
+          break;
       }
-      this.children = this.widget.children.map(
-        (childWidget) => this.inflateWidget(childWidget)
-      );
-      this._renderObject.attach(this);
-      this._renderObject.markNeedsParentLayout();
-    }
-    update(newWidget) {
-      super.update(newWidget);
-      this.rebuild({ force: true });
     }
-    updateChildren(newWidgets) {
-      const updatedChildIndexes = [];
-      const oldChildren = this.children;
-      const newChildren = newWidgets.map((newWidget) => {
-        const matchedChildIndex = oldChildren.findIndex(
-          (oldChild, oldChildIndex) => !updatedChildIndexes.includes(oldChildIndex) && Widget_default.canUpdate(newWidget, oldChild.widget)
-        );
-        let matchedChild;
-        if (matchedChildIndex === -1) {
-          matchedChild = null;
-        } else {
-          matchedChild = oldChildren[matchedChildIndex];
-          updatedChildIndexes.push(matchedChildIndex);
-        }
-        return this.updateChild(matchedChild, newWidget);
+    performSchedule() {
+      this.phase = 1 /* persistenceCallbacks */;
+      this.persistenceCallbacks.forEach((callback) => {
+        callback();
       });
-      oldChildren.forEach((oldChild, i) => {
-        if (updatedChildIndexes.includes(i))
-          return;
-        this.updateChild(oldChild, null);
+      this.phase = 2 /* postFrameCallbacks */;
+      this.postFrameCallbacks.forEach((callback) => {
+        callback();
       });
-      this.children = newChildren;
-    }
-    performRebuild() {
-      this.widget.updateRenderObject(this._renderObject);
-      const newChildWidgets = this.widget.children;
-      this.updateChildren(newChildWidgets);
+      this.postFrameCallbacks = [];
+      this.phase = 0 /* idle */;
     }
-    visitChildren(visitor) {
-      this.children.forEach((child) => visitor(child));
+    addPersistenceCallbacks(callback) {
+      this.persistenceCallbacks.push(() => callback());
     }
-    findAncestorRenderObjectElement() {
-      let ancestor = this.parent;
-      while (ancestor != null && !(ancestor instanceof _RenderObjectElement)) {
-        ancestor = ancestor.parent;
-      }
-      return ancestor;
+    addPostFrameCallbacks(callback) {
+      this.postFrameCallbacks.push(() => callback());
     }
   };
-  var RenderObjectElement_default = RenderObjectElement;
+  var Scheduler_default = Scheduler;
 
-  // src/widget/RenderObjectWidget.ts
-  var RenderObjectWidget = class extends Widget_default {
-    constructor({ children = [], key }) {
-      super(key);
-      __publicField(this, "children");
-      this.children = children;
-    }
-    createElement() {
-      return new RenderObjectElement_default(this);
+  // src/scheduler/RenderFrameDispatcher.ts
+  var RenderFrameDispatcher = class {
+    constructor({ onFrame } = {}) {
+      __publicField(this, "onFrame");
+      this.onFrame = onFrame;
     }
-    createRenderObject() {
-      throw { message: "not implemented createRenderObject" };
+    setOnFrame(callback) {
+      this.onFrame = () => callback();
     }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    updateRenderObject(renderObject) {
-      throw { message: "not implemented updatedRenderObject" };
+    // Actually we dont need to invoke browser to render because browser automatically render its own state periodically
+    // so Here we just call onFrame callback.
+    dispatch() {
+      if (typeof window === "undefined") {
+        setTimeout(() => {
+          var _a;
+          (_a = this.onFrame) == null ? void 0 : _a.call(this);
+        }, 0);
+      } else {
+        window.requestAnimationFrame(() => {
+          var _a;
+          (_a = this.onFrame) == null ? void 0 : _a.call(this);
+        });
+      }
     }
   };
-  var RenderObjectWidget_default = RenderObjectWidget;
+  var RenderFrameDispatcher_default = RenderFrameDispatcher;
 
-  // src/widget/RenderObjectToWidgetAdapter.ts
-  var RenderObjectToWidgetAdapter = class extends RenderObjectWidget_default {
-    constructor({
-      app,
-      renderOwner,
-      buildOwner,
-      renderContext,
-      scheduler
-    }) {
-      super({ children: [app] });
-      __publicField(this, "renderOwner");
+  // src/scheduler/Globalkey.ts
+  var GlobalKey = class {
+    constructor() {
+      __publicField(this, "isGlobalKey", true);
       __publicField(this, "buildOwner");
-      __publicField(this, "renderContext");
-      __publicField(this, "scheduler");
-      this.renderOwner = renderOwner;
-      this.buildOwner = buildOwner;
-      this.renderContext = renderContext;
-      this.scheduler = scheduler;
-    }
-    createElement() {
-      const el = super.createElement();
-      el.renderContext = this.renderContext;
-      el.buildOwner = this.buildOwner;
-      el.scheduler = this.scheduler;
-      return el;
-    }
-    createRenderObject() {
-      return new RenderView_default({ renderOwner: this.renderOwner });
     }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    updateRenderObject(renderObject) {
+    get currentContext() {
+      assert(
+        this.buildOwner != null,
+        "buildOwner is null, currentContext must be called after initState"
+      );
+      return this.buildOwner.findByGlobalKey(this);
     }
   };
-  var RenderObjectToWidgetAdapter_default = RenderObjectToWidgetAdapter;
+  var Globalkey_default = GlobalKey;
 
   // src/runApp.ts
   var AppRunner = class {
@@ -13730,7 +13738,7 @@
       while (parent != null) {
         const current = parent;
         parent = current.parent;
-        if (!(current instanceof ProviderElement))
+        if (!(current.type === "provider"))
           continue;
         if (current.providerKey !== key)
           continue;
@@ -13742,10 +13750,11 @@
       return new ProviderElement(this);
     }
   };
-  var ProviderElement = class extends Element_default {
+  var _ProviderElement = class _ProviderElement extends Element_default {
     constructor(widget) {
       super(widget);
       __publicField(this, "child");
+      __publicField(this, "type", _ProviderElement.type);
       this.widget = widget;
     }
     get providerKey() {
@@ -13769,6 +13778,8 @@
       this.child = this.updateChild(this.child, this.child.widget);
     }
   };
+  __publicField(_ProviderElement, "type", "provider");
+  var ProviderElement = _ProviderElement;
   function ProviderFn(props) {
     return new Provider(props);
   }
@@ -13883,7 +13894,7 @@
   };
   var StatefulWidget_default = StatefulWidget;
 
-  // ../../node_modules/tslib/tslib.es6.js
+  // ../../node_modules/popmotion/node_modules/tslib/tslib.es6.js
   function __rest(s, e) {
     var t = {};
     for (var p in s)
@@ -15411,75 +15422,22 @@
       return new BaseClipPath_default({ child: this.child, clipper: this.clipper });
     }
   };
-  var ClipPath_default = classToFunction_default(ClipPath);
-
-  // src/component/ClipRect.ts
-  function ClipRect({
-    child,
-    clipper,
-    clipped = true,
-    key
-  }) {
-    return ClipPath_default({
-      child,
-      clipped,
-      key,
-      clipper: (size) => new path_default().addRect(clipper(size))
-    });
-  }
-
-  // src/component/base/BaseFlexible.ts
-  var Flexible = class extends SingleChildRenderObjectWidget_default {
-    constructor({
-      flex = 1,
-      child,
-      fit = "loose",
-      key
-    } = {}) {
-      super({ child, key });
-      __publicField(this, "flex");
-      __publicField(this, "fit");
-      if (flex < 0)
-        throw { message: "flex must not be under zero" };
-      this.flex = flex;
-      this.fit = fit;
-    }
-    createRenderObject() {
-      return new RenderFlexible({ flex: this.flex, fit: this.fit });
-    }
-    updateRenderObject(renderObject) {
-      renderObject.flex = this.flex;
-      renderObject.fit = this.fit;
-    }
-  };
-  var RenderFlexible = class extends SingleChildRenderObject_default {
-    constructor({ flex, fit }) {
-      super({ isPainter: false });
-      __publicField(this, "_flex");
-      __publicField(this, "_fit");
-      this._flex = flex;
-      this._fit = fit;
-    }
-    get flex() {
-      return this._flex;
-    }
-    set flex(newFlex) {
-      if (this._flex === newFlex)
-        return;
-      this._flex = newFlex;
-      this.markNeedsLayout();
-    }
-    get fit() {
-      return this._fit;
-    }
-    set fit(newFit) {
-      if (this._fit === newFit)
-        return;
-      this._fit = newFit;
-      this.markNeedsLayout();
-    }
-  };
-  var BaseFlexible_default = Flexible;
+  var ClipPath_default = classToFunction_default(ClipPath);
+
+  // src/component/ClipRect.ts
+  function ClipRect({
+    child,
+    clipper,
+    clipped = true,
+    key
+  }) {
+    return ClipPath_default({
+      child,
+      clipped,
+      key,
+      clipper: (size) => new path_default().addRect(clipper(size))
+    });
+  }
 
   // src/component/base/BaseFlex.ts
   var Flex = class extends MultiChildRenderObjectWidget_default {
@@ -15609,7 +15567,7 @@
       const sortedChildren = this.verticalDirection === "down" ? this.children : [...this.children].reverse();
       sortedChildren.forEach((child) => {
         child.layout(this.constraints.loosen());
-        const flex = child instanceof RenderFlexible ? child.flex : 0;
+        const flex = (child == null ? void 0 : child.isRenderFlexible) ? child.flex : 0;
         totalFlex += flex;
         if (flex === 0) {
           childIntrinsicMainAxisValue += child.size[this.mainAxisSizeName];
@@ -15619,14 +15577,15 @@
       const flexUnitSize = (this.constraints.getMax(this.mainAxisSizeName) - childIntrinsicMainAxisValue) / totalFlex;
       sortedChildren.forEach((child) => {
         let childConstraint;
-        if (!(child instanceof RenderFlexible)) {
+        if (!child.isRenderFlexible) {
           childConstraint = this.getNonFlexItemConstraint(crossAxisValue);
         } else {
-          const flex = child.flex;
+          const flexible = child;
+          const flex = flexible.flex;
           const childMainAxisValue = flex * flexUnitSize;
           childConstraint = this.getFlexItemConstraint(
             childMainAxisValue,
-            child.fit
+            flexible.fit
           );
         }
         child.layout(childConstraint.enforce(this.constraints.loosen()));
@@ -16487,6 +16446,61 @@
     }
   };
 
+  // src/component/base/BaseFlexible.ts
+  var Flexible = class extends SingleChildRenderObjectWidget_default {
+    constructor({
+      flex = 1,
+      child,
+      fit = "loose",
+      key
+    } = {}) {
+      super({ child, key });
+      __publicField(this, "isFlexible", true);
+      __publicField(this, "flex");
+      __publicField(this, "fit");
+      if (flex < 0)
+        throw { message: "flex must not be under zero" };
+      this.flex = flex;
+      this.fit = fit;
+    }
+    createRenderObject() {
+      return new RenderFlexible({ flex: this.flex, fit: this.fit });
+    }
+    updateRenderObject(renderObject) {
+      renderObject.flex = this.flex;
+      renderObject.fit = this.fit;
+    }
+  };
+  var RenderFlexible = class extends SingleChildRenderObject_default {
+    constructor({ flex, fit }) {
+      super({ isPainter: false });
+      __publicField(this, "isRenderFlexible", true);
+      __publicField(this, "_flex");
+      __publicField(this, "_fit");
+      this._flex = flex;
+      this._fit = fit;
+    }
+    get flex() {
+      return this._flex;
+    }
+    set flex(newFlex) {
+      if (this._flex === newFlex)
+        return;
+      this._flex = newFlex;
+      this.markNeedsLayout();
+    }
+    get fit() {
+      return this._fit;
+    }
+    set fit(newFit) {
+      if (this._fit === newFit)
+        return;
+      this._fit = newFit;
+      this.markNeedsLayout();
+    }
+  };
+  var BaseFlexible_default = Flexible;
+
   // src/component/Flexible.ts
   var Flexible_default = classToFunction_default(BaseFlexible_default);
 
@@ -16883,6 +16897,8 @@
     }) {
       super({ child, key });
       __publicField(this, "padding");
+      if ((child == null ? void 0 : child.isFlexible) && child.fit === "tight")
+        throw { message: "Padding must not have a Expanded Widget" };
       this.padding = padding;
     }
     createRenderObject() {
@@ -16938,8 +16954,6 @@
     child,
     key
   }) {
-    if (child instanceof Expanded_default)
-      throw { message: "Padding must not have a Expanded Widget" };
     return new Padding({ padding, child, key });
   }
 
@@ -17527,239 +17541,103 @@
         let result = 0;
         if (type === "fr") {
           result = value * frUnitOnWidth;
-        } else {
-          result = fixedColumnWidths[i];
-        }
-        return result;
-      });
-      const totalFrOnHeight = this.rows.filter(({ type }) => type === "fr").map(({ value }) => value).reduce(sum, 0);
-      const totalFixedHeight = fixedRowHeights.reduce(sum, 0);
-      const frUnitOnHeight = (this.size.height - totalFixedHeight) / totalFrOnHeight;
-      const heights = this.rows.map(({ type, value }, i) => {
-        let result = 0;
-        if (type === "fr") {
-          result = value * frUnitOnHeight;
-        } else {
-          result = fixedRowHeights[i];
-        }
-        return result;
-      });
-      this.childrenByRow.forEach((columnChildren, rowIndex) => {
-        columnChildren.forEach((child, columnIndex) => {
-          const childConstraint = new constraints_default(__spreadProps(__spreadValues({}, this.constraints), {
-            maxHeight: heights[rowIndex],
-            maxWidth: widths[columnIndex]
-          }));
-          child.layout(childConstraint);
-          child.offset = new offset_default({
-            x: widths.slice(0, columnIndex).reduce(sum, 0),
-            y: heights.slice(0, rowIndex).reduce(sum, 0)
-          });
-        });
-      });
-    }
-    getIntrinsicWidth(height) {
-      return this.childrenByRow.map(
-        (row) => row.map((child) => child.getIntrinsicWidth(height)).reduce(Utils.sumReducer)
-      ).reduce(Utils.maxReducer);
-    }
-    getIntrinsicHeight(width) {
-      return this.childrenByRow.map(
-        (row) => row.map((child) => child.getIntrinsicHeight(width)).reduce(Utils.maxReducer)
-      ).reduce(Utils.sumReducer);
-    }
-  };
-  var GridTemplate = class _GridTemplate {
-    constructor({
-      type,
-      value
-    }) {
-      __publicField(this, "type");
-      __publicField(this, "value");
-      this.type = type;
-      this.value = value;
-    }
-    static equals(target, other) {
-      if (target.length !== other.length)
-        return false;
-      return target.every((value, i) => value.equals(other[i]));
-    }
-    equals(other) {
-      if (this === other)
-        return true;
-      return this.type === other.type && this.value === other.value;
-    }
-    static Fr(value) {
-      return new _GridTemplate({ value, type: "fr" });
-    }
-    static Px(value) {
-      return new _GridTemplate({ value, type: "px" });
-    }
-    static ContentFit() {
-      return new _GridTemplate({ value: 0, type: "content-fit" });
-    }
-    // 0 ~ 100
-    static Percent(value) {
-      return new _GridTemplate({ value, type: "percent" });
-    }
-    repeat(count) {
-      return Array.from({ length: count }, () => this);
-    }
-  };
-  var BaseGrid_default = BaseGrid;
-
-  // src/component/Grid.ts
-  function Grid(_a) {
-    var _b = _a, {
-      childrenByRow,
-      key
-    } = _b, props = __objRest(_b, [
-      "childrenByRow",
-      "key"
-    ]);
-    return new BaseGrid_default(__spreadValues({ childrenByRow, key }, props));
-  }
-  Grid.Fr = GridTemplate.Fr;
-  Grid.ContentFit = GridTemplate.ContentFit;
-  Grid.Percent = GridTemplate.Percent;
-  Grid.Px = GridTemplate.Px;
-  var Grid_default = Grid;
-
-  // src/component/base/BasePositioned.ts
-  var BasePositioned = class extends SingleChildRenderObjectWidget_default {
-    constructor({
-      top,
-      bottom,
-      left,
-      right,
-      width,
-      height,
-      child,
-      key
-    }) {
-      super({ child, key });
-      __publicField(this, "top");
-      __publicField(this, "bottom");
-      __publicField(this, "right");
-      __publicField(this, "left");
-      __publicField(this, "width");
-      __publicField(this, "height");
-      this.top = top;
-      this.bottom = bottom;
-      this.left = left;
-      this.right = right;
-      this.width = width;
-      this.height = height;
-    }
-    createRenderObject() {
-      return new RenderPositioned({
-        top: this.top,
-        left: this.left,
-        right: this.right,
-        bottom: this.bottom,
-        width: this.width,
-        height: this.height
-      });
-    }
-    updateRenderObject(renderObject) {
-      renderObject.top = this.top;
-      renderObject.left = this.left;
-      renderObject.bottom = this.bottom;
-      renderObject.right = this.right;
-      renderObject.width = this.width;
-      renderObject.height = this.height;
-    }
-  };
-  var RenderPositioned = class extends SingleChildRenderObject_default {
-    constructor({
-      top,
-      bottom,
-      left,
-      right,
-      width,
-      height
-    }) {
-      super({ isPainter: false });
-      __publicField(this, "_top");
-      __publicField(this, "_bottom");
-      __publicField(this, "_right");
-      __publicField(this, "_left");
-      __publicField(this, "_width");
-      __publicField(this, "_height");
-      this._top = top;
-      this._bottom = bottom;
-      this._left = left;
-      this._right = right;
-      this._width = width;
-      this._height = height;
-    }
-    get top() {
-      return this._top;
-    }
-    set top(newTop) {
-      if (this._top === newTop)
-        return;
-      this._top = newTop;
-      this.markNeedsLayout();
-    }
-    get bottom() {
-      return this._bottom;
-    }
-    set bottom(newBottom) {
-      if (this._bottom === newBottom)
-        return;
-      this._bottom = newBottom;
-      this.markNeedsLayout();
-    }
-    get right() {
-      return this._right;
+        } else {
+          result = fixedColumnWidths[i];
+        }
+        return result;
+      });
+      const totalFrOnHeight = this.rows.filter(({ type }) => type === "fr").map(({ value }) => value).reduce(sum, 0);
+      const totalFixedHeight = fixedRowHeights.reduce(sum, 0);
+      const frUnitOnHeight = (this.size.height - totalFixedHeight) / totalFrOnHeight;
+      const heights = this.rows.map(({ type, value }, i) => {
+        let result = 0;
+        if (type === "fr") {
+          result = value * frUnitOnHeight;
+        } else {
+          result = fixedRowHeights[i];
+        }
+        return result;
+      });
+      this.childrenByRow.forEach((columnChildren, rowIndex) => {
+        columnChildren.forEach((child, columnIndex) => {
+          const childConstraint = new constraints_default(__spreadProps(__spreadValues({}, this.constraints), {
+            maxHeight: heights[rowIndex],
+            maxWidth: widths[columnIndex]
+          }));
+          child.layout(childConstraint);
+          child.offset = new offset_default({
+            x: widths.slice(0, columnIndex).reduce(sum, 0),
+            y: heights.slice(0, rowIndex).reduce(sum, 0)
+          });
+        });
+      });
     }
-    set right(newRight) {
-      if (this._right === newRight)
-        return;
-      this._right = newRight;
-      this.markNeedsLayout();
+    getIntrinsicWidth(height) {
+      return this.childrenByRow.map(
+        (row) => row.map((child) => child.getIntrinsicWidth(height)).reduce(Utils.sumReducer)
+      ).reduce(Utils.maxReducer);
     }
-    get left() {
-      return this._left;
+    getIntrinsicHeight(width) {
+      return this.childrenByRow.map(
+        (row) => row.map((child) => child.getIntrinsicHeight(width)).reduce(Utils.maxReducer)
+      ).reduce(Utils.sumReducer);
     }
-    set left(newLeft) {
-      if (this._left === newLeft)
-        return;
-      this._left = newLeft;
-      this.markNeedsLayout();
+  };
+  var GridTemplate = class _GridTemplate {
+    constructor({
+      type,
+      value
+    }) {
+      __publicField(this, "type");
+      __publicField(this, "value");
+      this.type = type;
+      this.value = value;
     }
-    get width() {
-      return this._width;
+    static equals(target, other) {
+      if (target.length !== other.length)
+        return false;
+      return target.every((value, i) => value.equals(other[i]));
     }
-    set width(newWidth) {
-      if (this._width === newWidth)
-        return;
-      this._width = newWidth;
-      this.markNeedsLayout();
+    equals(other) {
+      if (this === other)
+        return true;
+      return this.type === other.type && this.value === other.value;
     }
-    get height() {
-      return this._height;
+    static Fr(value) {
+      return new _GridTemplate({ value, type: "fr" });
     }
-    set height(newHeight) {
-      if (this._height === newHeight)
-        return;
-      this._height = newHeight;
-      this.markNeedsLayout();
+    static Px(value) {
+      return new _GridTemplate({ value, type: "px" });
     }
-    get isPositioned() {
-      return this.top != null || this.bottom != null || this.left != null || this.right != null || this.width != null || this.height != null;
+    static ContentFit() {
+      return new _GridTemplate({ value: 0, type: "content-fit" });
     }
-    getIntrinsicWidth(height) {
-      var _a;
-      return ((_a = this.child) == null ? void 0 : _a.getIntrinsicWidth(height)) || 0;
+    // 0 ~ 100
+    static Percent(value) {
+      return new _GridTemplate({ value, type: "percent" });
     }
-    getIntrinsicHeight(width) {
-      var _a;
-      return ((_a = this.child) == null ? void 0 : _a.getIntrinsicHeight(width)) || 0;
+    repeat(count) {
+      return Array.from({ length: count }, () => this);
     }
   };
-  var BasePositioned_default = BasePositioned;
+  var BaseGrid_default = BaseGrid;
+
+  // src/component/Grid.ts
+  function Grid(_a) {
+    var _b = _a, {
+      childrenByRow,
+      key
+    } = _b, props = __objRest(_b, [
+      "childrenByRow",
+      "key"
+    ]);
+    return new BaseGrid_default(__spreadValues({ childrenByRow, key }, props));
+  }
+  Grid.Fr = GridTemplate.Fr;
+  Grid.ContentFit = GridTemplate.ContentFit;
+  Grid.Percent = GridTemplate.Percent;
+  Grid.Px = GridTemplate.Px;
+  var Grid_default = Grid;
 
   // src/component/base/BaseStack.ts
   var BaseStack = class extends MultiChildRenderObjectWidget_default {
@@ -17849,7 +17727,7 @@
           break;
       }
       this.children.forEach((child) => {
-        if (child instanceof RenderPositioned && child.isPositioned)
+        if (child.isRenderPositioned && child.isPositioned)
           return;
         hasNonPositionedChildren = true;
         child.layout(nonPositionedConstraints);
@@ -17915,7 +17793,7 @@
         constraints: this.constraints
       });
       this.children.forEach((child) => {
-        if (!(child instanceof RenderPositioned && child.isPositioned)) {
+        if (!(child.isRenderPositioned && child.isPositioned)) {
           child.offset = this.resolvedAlignment.alongOffset(
             this.size.minus(child.size)
           );
@@ -17957,6 +17835,143 @@
     });
   }
 
+  // src/component/base/BasePositioned.ts
+  var BasePositioned = class extends SingleChildRenderObjectWidget_default {
+    constructor({
+      top,
+      bottom,
+      left,
+      right,
+      width,
+      height,
+      child,
+      key
+    }) {
+      super({ child, key });
+      __publicField(this, "top");
+      __publicField(this, "bottom");
+      __publicField(this, "right");
+      __publicField(this, "left");
+      __publicField(this, "width");
+      __publicField(this, "height");
+      this.top = top;
+      this.bottom = bottom;
+      this.left = left;
+      this.right = right;
+      this.width = width;
+      this.height = height;
+    }
+    createRenderObject() {
+      return new RenderPositioned({
+        top: this.top,
+        left: this.left,
+        right: this.right,
+        bottom: this.bottom,
+        width: this.width,
+        height: this.height
+      });
+    }
+    updateRenderObject(renderObject) {
+      renderObject.top = this.top;
+      renderObject.left = this.left;
+      renderObject.bottom = this.bottom;
+      renderObject.right = this.right;
+      renderObject.width = this.width;
+      renderObject.height = this.height;
+    }
+  };
+  var RenderPositioned = class extends SingleChildRenderObject_default {
+    constructor({
+      top,
+      bottom,
+      left,
+      right,
+      width,
+      height
+    }) {
+      super({ isPainter: false });
+      __publicField(this, "isRenderPositioned", true);
+      __publicField(this, "_top");
+      __publicField(this, "_bottom");
+      __publicField(this, "_right");
+      __publicField(this, "_left");
+      __publicField(this, "_width");
+      __publicField(this, "_height");
+      this._top = top;
+      this._bottom = bottom;
+      this._left = left;
+      this._right = right;
+      this._width = width;
+      this._height = height;
+    }
+    get top() {
+      return this._top;
+    }
+    set top(newTop) {
+      if (this._top === newTop)
+        return;
+      this._top = newTop;
+      this.markNeedsLayout();
+    }
+    get bottom() {
+      return this._bottom;
+    }
+    set bottom(newBottom) {
+      if (this._bottom === newBottom)
+        return;
+      this._bottom = newBottom;
+      this.markNeedsLayout();
+    }
+    get right() {
+      return this._right;
+    }
+    set right(newRight) {
+      if (this._right === newRight)
+        return;
+      this._right = newRight;
+      this.markNeedsLayout();
+    }
+    get left() {
+      return this._left;
+    }
+    set left(newLeft) {
+      if (this._left === newLeft)
+        return;
+      this._left = newLeft;
+      this.markNeedsLayout();
+    }
+    get width() {
+      return this._width;
+    }
+    set width(newWidth) {
+      if (this._width === newWidth)
+        return;
+      this._width = newWidth;
+      this.markNeedsLayout();
+    }
+    get height() {
+      return this._height;
+    }
+    set height(newHeight) {
+      if (this._height === newHeight)
+        return;
+      this._height = newHeight;
+      this.markNeedsLayout();
+    }
+    get isPositioned() {
+      return this.top != null || this.bottom != null || this.left != null || this.right != null || this.width != null || this.height != null;
+    }
+    getIntrinsicWidth(height) {
+      var _a;
+      return ((_a = this.child) == null ? void 0 : _a.getIntrinsicWidth(height)) || 0;
+    }
+    getIntrinsicHeight(width) {
+      var _a;
+      return ((_a = this.child) == null ? void 0 : _a.getIntrinsicHeight(width)) || 0;
+    }
+  };
+  var BasePositioned_default = BasePositioned;
+
   // src/component/Positioned.ts
   var Positioned = classToFunction_default(
     BasePositioned_default
@@ -18908,7 +18923,7 @@
       renderObject.onWheel = this.onWheel;
     }
   };
-  var RenderGestureDetector = class _RenderGestureDetector extends SingleChildRenderObject_default {
+  var RenderGestureDetector = class extends SingleChildRenderObject_default {
     constructor({
       onClick,
       onMouseDown,
@@ -18925,6 +18940,7 @@
       onWheel
     }) {
       super({ isPainter: true });
+      __publicField(this, "isRenderGestureDetector", true);
       __publicField(this, "id", createUniqueId());
       __publicField(this, "_bubble");
       __publicField(this, "_cursor");
@@ -19139,7 +19155,7 @@
     dispatchParent(e) {
       let parent = this.parent;
       while (parent != null) {
-        if (parent instanceof _RenderGestureDetector) {
+        if (parent == null ? void 0 : parent.isRenderGestureDetector) {
           parent.dispatch(e);
           break;
         }