@vectoriox/iox-builder 4.6.0 → 4.7.0

package/fesm2022/vectoriox-iox-builder.mjs

@@ -320,7 +320,7 @@ class LayoutGroupStyleConfig extends GroupStyleConfig {
                 { value: 'flex-start', label: 'Start', icon: 'ph-thin ph-align-left' },
                 { value: 'center', label: 'Center', icon: 'ph-thin ph-align-center-horizontal' },
                 { value: 'flex-end', label: 'End', icon: 'ph-thin ph-align-right' },
-                { value: 'space-between', label: 'Space Between', icon: 'ph-thin ph-distribute-horizontal' },
+                { value: 'space-between', label: 'Space Between', icon: 'ph-thin ph-arrows-out-line-horizontal' },
                 { value: 'space-around', label: 'Space Around', icon: 'ph-thin ph-dots-three' },
                 { value: 'space-evenly', label: 'Space Evenly', icon: 'ph-thin ph-dots-six' },
             ], 'flex-start', false, { trait: 'display', values: ['flex', 'grid'] }),
@@ -344,7 +344,7 @@ class LayoutGroupStyleConfig extends GroupStyleConfig {
                 { value: 'start', label: 'Start', icon: 'ph-thin ph-align-top' },
                 { value: 'center', label: 'Center', icon: 'ph-thin ph-align-center-vertical' },
                 { value: 'end', label: 'End', icon: 'ph-thin ph-align-bottom' },
-                { value: 'space-between', label: 'Space Between', icon: 'ph-thin ph-distribute-vertical' },
+                { value: 'space-between', label: 'Space Between', icon: 'ph-thin ph-arrows-out-line-vertical' },
                 { value: 'space-around', label: 'Space Around', icon: 'ph-thin ph-dots-three' },
                 { value: 'stretch', label: 'Stretch', icon: 'ph-thin ph-arrows-vertical' },
             ], 'stretch', false, { trait: 'display', values: 'grid' }),
@@ -9153,8 +9153,18 @@ class CardComponentConfig extends ComponentConfig {
             new TraitConfig('description', 'Description', TraitInputType.Text, undefined, 'This is a default card description.')
         ];
         this.styleTraits = buildFullStyleTraits();
+        // DEPRECATED — removed from the Components panel (2026-09-22). A Card is a Container with a
+        // border, a radius and a background: every one of those is a style group on Container, so the
+        // component earned no place in the palette. It stays REGISTERED and renderable because saved
+        // pages may contain Card nodes — dropping the type would render those pages blank. Remove the
+        // type entirely only behind a migration that rewrites Card nodes to Container.
+        this.hidden = true;
         this.applyStyleDefaults({
-            width: '200px',
+            // Fluid up to the design width: a fixed 200px card overflows a narrow column and is
+            // the single most common `fixed-width` audit finding. Capping keeps the desktop look
+            // identical (parent wider than 200px → still 200px) while shrinking on a phone.
+            width: '100%',
+            maxWidth: '200px',
             height: 'auto',
             padding: '16px 16px 16px 16px',
             borderWidth: '1px 1px 1px 1px',
@@ -9292,7 +9302,10 @@ class BuilderImageComponentConfig extends ComponentConfig {
         ];
         this.styleTraits = buildFullStyleTraits();
         this.applyStyleDefaults({
-            width: '300px',
+            // Same reasoning as Card: 300px alone overflows a 320px viewport once the page has any
+            // side padding. Capped-fluid renders identically wherever there is room.
+            width: '100%',
+            maxWidth: '300px',
             aspectRatio: '1/1',
         });
     }