@vectoriox/iox-builder 1.8.0 → 1.9.1

package/fesm2022/vectoriox-iox-builder.mjs

@@ -83,6 +83,10 @@ const ROUTE_ANIMATION_OPTIONS = [
     { value: 'flip', label: 'Flip', description: 'Perspective tilt + fade' },
 ];
 const EASING_OPTIONS$1 = [
+    // Strong symmetric in-out — the default. Slow to leave, quick through the middle, gentle to
+    // settle; this is what makes a long page transition read as smooth rather than sluggish.
+    { label: 'Smooth (default)', value: 'cubic-bezier(0.76, 0, 0.24, 1)' },
+    { label: 'Expo Out', value: 'cubic-bezier(0.16, 1, 0.3, 1)' },
     { label: 'Ease', value: 'ease' },
     { label: 'Ease In', value: 'ease-in' },
     { label: 'Ease Out', value: 'ease-out' },
@@ -112,8 +116,11 @@ function defaultPageSettings() {
         routeAnimation: {
             enter: 'fade',
             leave: 'fade',
-            duration: 400,
-            easing: 'ease',
+            // Defaults mirror DEFAULT_PAGE_TRANSITION* in @vectoriox/iox-ui: the parallax look at a
+            // long duration with the smooth in-out curve.
+            transition: 'parallax-up',
+            duration: 1500,
+            easing: 'cubic-bezier(0.76, 0, 0.24, 1)',
         },
     };
 }
@@ -2232,7 +2239,11 @@ class TypographyGroupStyleConfig extends GroupStyleConfig {
             new TraitConfig('fontSize', 'Font Size', TraitInputType.Scrub, { min: 8, max: 200, step: 1, units: UNITS_ALL }, '16px'),
             new TraitConfig('fontWeight', 'Weight', TraitInputType.Scrub, { min: 100, max: 900, step: 100, units: [''] }, '400'),
             new TraitConfig('color', 'Color', TraitInputType.Color, { allowGradient: false, allowTransparent: false, formats: ['hex', 'rgb', 'hsl'] }, '#000000'),
-            new TraitConfig('lineHeight', 'Line Height', TraitInputType.Scrub, { min: 0.5, max: 5, step: 0.05, units: [''] }, '1.5'),
+            // Unitless on purpose (`units: ['']`): a unitless line-height inherits as a RATIO — each
+            // descendant multiplies it by its OWN font-size — whereas `1.5em`/`24px` inherits a fixed
+            // computed length that ignores the child's font-size. min:0 so a line box can be collapsed
+            // completely (icons/glyph-only elements), which `0.5` used to block.
+            new TraitConfig('lineHeight', 'Line Height', TraitInputType.Scrub, { min: 0, max: 5, step: 0.05, units: [''] }, '1.5'),
             new TraitConfig('letterSpacing', 'Spacing', TraitInputType.Scrub, { min: -5, max: 50, step: 0.5, units: UNITS_FIXED }, '0px'),
             new TraitConfig('textAlign', '', TraitInputType.SelectButton, [
                 { value: 'left', icon: 'ph-thin ph-text-align-left' },
@@ -7484,10 +7495,10 @@ class BuilderIconComponentConfig extends ComponentConfig {
             fontSize: '24px',
             color: '#374151',
             // An icon is a glyph, not a paragraph — the Typography group's default line-height of
-            // 1.5 adds phantom vertical space and misaligns it. Default it to 1 so the box hugs the
-            // glyph. Serialized into styleProps (self-describing node), so the builder AND the SSR
-            // engine both compile `line-height: 1` — no engine-side special-case needed.
-            lineHeight: '1',
+            // 1.5 adds phantom vertical space and misaligns it. Default to 0 so the line box is fully
+            // collapsed and the icon contributes no extra vertical space (spacing comes from
+            // padding/margin instead). Serialized into styleProps (self-describing node).
+            lineHeight: '0',
         });
     }
 }