@wix/editor-react-components 1.2489.0 → 1.2490.0

package/dist/site/components/TestComp/TestComp.d.ts

@@ -23,9 +23,13 @@ type TestCompProps = {
             alt?: string;
             className?: string;
         };
+        errorText?: {
+            text?: string;
+        };
     };
     a11y?: A11y;
     isEnabled?: boolean;
+    isError?: boolean;
     label?: string;
     count?: number;
     variant?: string;

package/dist/site/components/TestComp/component.js

@@ -38,7 +38,7 @@ const styles = {
   functionBtn
 };
 const TestComp = (props) => {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c, _d, _e, _f, _g;
   const {
     id,
     className,
@@ -47,6 +47,7 @@ const TestComp = (props) => {
     elementProps = {},
     a11y = {},
     isEnabled,
+    isError,
     label,
     count,
     variant,
@@ -107,7 +108,8 @@ const TestComp = (props) => {
         className,
         styles.root,
         formatClassNames(semanticClassNames.root, ...customClassNames),
-        "test-comp-card"
+        "test-comp-card",
+        isError && "test-comp-card--error"
       ),
       ...a11y,
       dir: direction,
@@ -140,13 +142,14 @@ const TestComp = (props) => {
             children: ((_d = elementProps.description) == null ? void 0 : _d.text) || "Edit the settings to see values change"
           }
         ),
-        ((_e = elementProps.image) == null ? void 0 : _e.src) && /* @__PURE__ */ jsx(
+        isError && /* @__PURE__ */ jsx("p", { className: "card-error-text", children: ((_e = elementProps.errorText) == null ? void 0 : _e.text) || "Something went wrong" }),
+        ((_f = elementProps.image) == null ? void 0 : _f.src) && /* @__PURE__ */ jsx(
           "div",
           {
             className: clsx(
               styles.imageWrapper,
               "card-image",
-              (_f = elementProps.image) == null ? void 0 : _f.className
+              (_g = elementProps.image) == null ? void 0 : _g.className
             ),
             children: /* @__PURE__ */ jsx(
               "img",
@@ -161,6 +164,7 @@ const TestComp = (props) => {
         /* @__PURE__ */ jsxs("div", { className: styles.settingsSection, children: [
           /* @__PURE__ */ jsx("h4", { className: styles.sectionTitle, children: "Settings Panel Values" }),
           /* @__PURE__ */ jsx(ValueRow, { label: "isEnabled (boolean)", value: String(isEnabled) }),
+          /* @__PURE__ */ jsx(ValueRow, { label: "isError (boolean)", value: String(isError) }),
           /* @__PURE__ */ jsx(ValueRow, { label: "label (text)", value: label }),
           /* @__PURE__ */ jsx(ValueRow, { label: "count (number)", value: count }),
           /* @__PURE__ */ jsx(ValueRow, { label: "variant (textEnum)", value: variant }),

package/dist/site/components/TestComp/constants.d.ts

@@ -16,5 +16,9 @@ export declare const DesignStates: {
             readonly displayName: "Featured";
             readonly className: "test-comp-card--featured";
         };
+        readonly error: {
+            readonly displayName: "Error";
+            readonly className: "test-comp-card--error";
+        };
     };
 };

package/dist/site/components/TestComp/manifest.js

@@ -11,6 +11,10 @@ const DesignStates = {
     featured: {
       displayName: "Featured",
       className: "test-comp-card--featured"
+    },
+    error: {
+      displayName: "Error",
+      className: "test-comp-card--error"
     }
   }
 };
@@ -73,6 +77,13 @@ const manifest = {
         displayName: "Is Enabled",
         defaultValue: true
       },
+      // Functional state prop — drives error state styling + conditional element rendering.
+      // Exposed as booleanValue so Velo/context can bind to it.
+      isError: {
+        dataType: DATA.DATA_TYPE.booleanValue,
+        displayName: "Is Error",
+        defaultValue: false
+      },
       // Settings panel: text
       label: {
         dataType: DATA.DATA_TYPE.text,
@@ -427,6 +438,7 @@ const manifest = {
         data: {
           items: [
             "isEnabled",
+            "isError",
             "label",
             "count",
             "variant",
@@ -513,6 +525,24 @@ const manifest = {
             borderRadius: {}
           }
         }
+      },
+      // Inner element that only renders when isError is true.
+      // Allows separate design (font/color) for the error message text.
+      errorText: {
+        elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
+        inlineElement: {
+          selector: ".card-error-text",
+          displayName: "Error Message",
+          data: {
+            text: {
+              dataType: DATA.DATA_TYPE.text
+            }
+          },
+          cssProperties: {
+            font: {},
+            color: {}
+          }
+        }
       }
     },
     states: {
@@ -545,6 +575,15 @@ const manifest = {
         props: {
           variant: "primary"
         }
+      },
+      // Functional state: pins isError=true so the designer sees the error
+      // styling + the errorText element while designing this state.
+      error: {
+        displayName: DesignStates.testCompCard.error.displayName,
+        className: DesignStates.testCompCard.error.className,
+        props: {
+          isError: true
+        }
       }
     },
     presets: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/editor-react-components",
-  "version": "1.2489.0",
+  "version": "1.2490.0",
   "description": "React components for the Wix Editor",
   "license": "MIT",
   "type": "module",
@@ -197,5 +197,5 @@
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
-  "falconPackageHash": "f3112664140b717e04c796a7265fc4964d4d0101048e79cae4bfcb32"
+  "falconPackageHash": "098b76ad796b7d15b8fde7637c3dc352e868923dec13088927a6ad44"
 }