@vectoriox/iox-ui 4.30.0 → 4.30.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vectoriox/iox-ui",
-  "version": "4.30.0",
+  "version": "4.30.2",
   "peerDependencies": {
     "@angular/common": ">=20.0.0",
     "@angular/core": ">=20.0.0",

package/styles/iox-forms.css

@@ -16,18 +16,27 @@
  * visibility, the author owns everything else about the block.
  */
 
-.iox-form-success,
-.iox-form-error { display: none; }
-
-.iox-form[data-iox-state="success"] .iox-form-success { display: block; }
-.iox-form[data-iox-state="error"]   .iox-form-error   { display: block; }
+/* ⚠️ HIDE-ONLY, AND `!important` IS REQUIRED. Both parts are load-bearing.
+ *
+ * On the BUILDER canvas the author's `display` is applied as an INLINE style on the node host, and no
+ * stylesheet rule — at any specificity — beats an inline style. So the only way one mechanism can
+ * govern visibility in all three renderers is `!important`.
+ *
+ * But it is applied to HIDING only, never to revealing. A rule like
+ * `[data-iox-state="success"] .iox-form-success { display: block !important }` would also override an
+ * author who made their success block a flex container. Expressing the same thing as "hide unless the
+ * state matches" leaves the revealed block's own `display` untouched: the state machine decides
+ * WHETHER a block shows, the author decides HOW it shows.
+ */
+.iox-form:not([data-iox-state="success"]) .iox-form-success { display: none !important; }
+.iox-form:not([data-iox-state="error"])   .iox-form-error   { display: none !important; }
 
 /* A submitted form hides its inputs: the success message REPLACES them, rather than sitting under a
    form the visitor might fill in and send a second time. An error leaves them alone — the visitor
    has to be able to fix and retry. */
 .iox-form[data-iox-state="success"] .iox-field,
 .iox-form[data-iox-state="success"] .iox-field-group,
-.iox-form[data-iox-state="success"] .iox-submit { display: none; }
+.iox-form[data-iox-state="success"] .iox-submit { display: none !important; }
 
 /* Structural base styles, shared by the string-rendered markup and both component paths. */
 .iox-form           { box-sizing: border-box; }