biggerui 1.0.3 → 1.0.5

package/dist/biggerui.css

@@ -1,3 +1,69 @@
+:root {
+  /* Colors */
+  --primary-color: #4338ca;
+  --primary-color-hover: #3d33b8;
+  --primary-color-alpha: rgba(67, 56, 202, 0.4);
+
+  --destructive-color: #991b1b;
+  --destructive-color-hover: #8a1919;
+  --destructive-color-alpha: rgba(153, 27, 27, 0.4);
+
+  --text-color: #fafafa;
+  --text-color-secondary: #d4d4d4;
+  --text-color-placeholder: #737373;
+  --text-color-error: #fecaca;
+
+  --background-color-white: #fff;
+  --background-color-silver: #f5f5f5;
+  --background-color: #171717;
+  --background-color-light: rgba(250, 250, 250, 0.05);
+  --background-color-light-hover: rgba(250, 250, 250, 0.08);
+  --background-color-overlay: rgba(0, 0, 0, 0.5);
+
+  --border-color: rgba(250, 250, 250, 0.15);
+  --border-color-silver: #f5f5f5;
+  --border-color-white: #fff;
+  --border-color-dark: #404040;
+  --border-color-black: #171717;;
+
+  --shadow-color-light:  rgba(115, 115, 115, 0.45);
+  --shadow-color: rgba(10, 10, 10, 0.05);
+  --shadow-color-dark: rgba(10, 10, 10, 0.1);
+
+  /* Spacing */
+  --spacing-xs: 4px;
+  --spacing-sm: 8px;
+  --spacing-md: 16px;
+  --spacing-lg: 24px;
+  --spacing-xl: 32px;
+
+  /* Typography */
+  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  --font-size-xs: 12px;
+  --font-size-sm: 14px;
+  --font-size-md: 16px;
+  --font-size-lg: 18px;
+  --font-size-xl: 20px;
+  --font-weight-regular: 400;
+  --font-weight-medium: 500;
+  --font-weight-bold: 700;
+
+  /* Border radius */
+  --border-radius-sm: 4px;
+  --border-radius-md: 8px;
+  --border-radius-lg: 12px;
+  --border-radius-full: 9999px;
+
+  /* Shadows */
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
+  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
+  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
+
+  /* Transitions */
+  --transition-fast: 150ms;
+  --transition-normal: 250ms;
+  --transition-slow: 350ms;
+}
 ._button_1cxsm_1 {
     display: inline-flex;
     align-items: center;

package/dist/biggerui.es.js

@@ -8710,7 +8710,6 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
              */
             this.eventHandlers = new Map();
             this.hasTreeAnimated = false;
-            this.layoutVersion = 0;
             // Note: Currently only running on root node
             this.updateScheduled = false;
             this.scheduleUpdate = () => this.update();
@@ -8737,7 +8736,6 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
              * Frame calculations
              */
             this.resolvedRelativeTargetAt = 0.0;
-            this.linkedParentVersion = 0;
             this.hasProjected = false;
             this.isVisible = true;
             this.animationProgress = 0;
@@ -9091,7 +9089,6 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
             }
             const prevLayout = this.layout;
             this.layout = this.measure(false);
-            this.layoutVersion++;
             this.layoutCorrected = createBox();
             this.isLayoutDirty = false;
             this.projectionDelta = undefined;
@@ -9311,23 +9308,25 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
             if (!this.layout || !(layout || layoutId))
                 return;
             this.resolvedRelativeTargetAt = frameData.timestamp;
-            const relativeParent = this.getClosestProjectingParent();
-            if (relativeParent &&
-                this.linkedParentVersion !== relativeParent.layoutVersion &&
-                !relativeParent.options.layoutRoot) {
-                this.removeRelativeTarget();
-            }
             /**
              * If we don't have a targetDelta but do have a layout, we can attempt to resolve
              * a relativeParent. This will allow a component to perform scale correction
              * even if no animation has started.
              */
             if (!this.targetDelta && !this.relativeTarget) {
-                if (relativeParent && relativeParent.layout) {
-                    this.createRelativeTarget(relativeParent, this.layout.layoutBox, relativeParent.layout.layoutBox);
+                const relativeParent = this.getClosestProjectingParent();
+                if (relativeParent &&
+                    relativeParent.layout &&
+                    this.animationProgress !== 1) {
+                    this.relativeParent = relativeParent;
+                    this.forceRelativeParentToResolveTarget();
+                    this.relativeTarget = createBox();
+                    this.relativeTargetOrigin = createBox();
+                    calcRelativePosition(this.relativeTargetOrigin, this.layout.layoutBox, relativeParent.layout.layoutBox);
+                    copyBoxInto(this.relativeTarget, this.relativeTargetOrigin);
                 }
                 else {
-                    this.removeRelativeTarget();
+                    this.relativeParent = this.relativeTarget = undefined;
                 }
             }
             /**
@@ -9377,13 +9376,19 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
              */
             if (this.attemptToResolveRelativeTarget) {
                 this.attemptToResolveRelativeTarget = false;
+                const relativeParent = this.getClosestProjectingParent();
                 if (relativeParent &&
                     Boolean(relativeParent.resumingFrom) ===
                         Boolean(this.resumingFrom) &&
                     !relativeParent.options.layoutScroll &&
                     relativeParent.target &&
                     this.animationProgress !== 1) {
-                    this.createRelativeTarget(relativeParent, this.target, relativeParent.target);
+                    this.relativeParent = relativeParent;
+                    this.forceRelativeParentToResolveTarget();
+                    this.relativeTarget = createBox();
+                    this.relativeTargetOrigin = createBox();
+                    calcRelativePosition(this.relativeTargetOrigin, this.target, relativeParent.target);
+                    copyBoxInto(this.relativeTarget, this.relativeTargetOrigin);
                 }
                 else {
                     this.relativeParent = this.relativeTarget = undefined;
@@ -9409,18 +9414,6 @@ function createProjectionNode({ attachResizeListener, defaultParent, measureScro
                 this.options.layoutRoot) &&
                 this.layout);
         }
-        createRelativeTarget(relativeParent, layout, parentLayout) {
-            this.relativeParent = relativeParent;
-            this.linkedParentVersion = relativeParent.layoutVersion;
-            this.forceRelativeParentToResolveTarget();
-            this.relativeTarget = createBox();
-            this.relativeTargetOrigin = createBox();
-            calcRelativePosition(this.relativeTargetOrigin, layout, parentLayout);
-            copyBoxInto(this.relativeTarget, this.relativeTargetOrigin);
-        }
-        removeRelativeTarget() {
-            this.relativeParent = this.relativeTarget = undefined;
-        }
         calcProjection() {
             const lead = this.getLead();
             const isShared = Boolean(this.resumingFrom) || this !== lead;