@wix/editor-react-components 1.2762.0 → 1.2764.0

package/dist/site/components/chunks/a11y.js

@@ -110,10 +110,10 @@ export {
   HAS_CUSTOM_FOCUS_CLASSNAME as H,
   activateBySpaceOrEnterButton as a,
   getAccessibilityAttributes as b,
-  activateBySpaceButton as c,
-  activateByEnterButton as d,
-  getTabIndexAttribute as e,
-  convertA11yKeysToHtmlFormat as f,
+  convertA11yKeysToHtmlFormat as c,
+  activateBySpaceButton as d,
+  activateByEnterButton as e,
+  getTabIndexAttribute as f,
   getAccessibilityAttributesSpread as g,
   getAriaAttributes as h,
   removeAriaPrefix as r

package/dist/site/components/chunks/constants10.js

@@ -1,73 +1,28 @@
-const SharedDisplayNames = {
-  root: {
-    displayName: "Text Effects"
-  },
-  data: {
-    text: "Text",
-    link: "Link",
-    isDecorative: "Decorative",
-    textDirection: "Text Direction",
-    patternScope: "Pattern Scope",
-    a11y: "Accessibility"
-  },
-  cssProperties: {
-    font: "Font",
-    color: "Color",
-    textLineHeight: "Line spacing",
-    letterSpacing: "Letter spacing"
-  },
-  patternCssCustomProperties: {
-    rotationIntensity: "Rotation Intensity",
-    offsetIntensity: "Offset Intensity",
-    patternPreset: "Pattern Preset",
-    isCapitalize: "Capitalize"
-  },
-  textDirection: {
-    inherit: "Inherit",
-    ltr: "Left to Right",
-    rtl: "Right to Left"
-  },
-  patternScope: {
-    none: "None",
-    character: "Character",
-    word: "Word"
-  }
-};
+import { S as SharedDisplayNames } from "./constants9.js";
 const TestIds = {
   viewer: {
-    link: "text-effects-shared-link",
-    visuallyHidden: "text-effects-shared-visually-hidden",
-    patternUnit: "text-effects-shared-pattern-unit"
+    container: "TextEffectsNoisy-container",
+    text: "TextEffectsNoisy-text"
   }
 };
-const DEFAULT_HTML_TAG = "div";
-const DEFAULT_TEXT_DIRECTION = "inherit";
-const dataHooks = {
-  root: "text-effect"
+const noiseIntensityConfig = {
+  start: 1,
+  end: 53,
+  step: 1
+};
+const COMPONENT_ID = "3f9c1e82-a7d6-4b5e-8c2a-9d4f6e3b7a1c";
+const TEXT_TWIST_PANEL_ID = "0bba51ec-ca53-4662-acf6-ea71ffbb4f55";
+const DisplayNames = {
+  ...SharedDisplayNames,
+  cssCustomProperties: {
+    textEffectsColor1: "Color",
+    squigglyLevel: "Noise intensity"
+  }
 };
-const blendModes = [
-  "normal",
-  "color",
-  "color-burn",
-  "color-dodge",
-  "darken",
-  "difference",
-  "exclusion",
-  "hard-light",
-  "hue",
-  "lighten",
-  "luminosity",
-  "multiply",
-  "overlay",
-  "saturation",
-  "screen",
-  "soft-light"
-];
 export {
-  DEFAULT_TEXT_DIRECTION as D,
-  SharedDisplayNames as S,
+  COMPONENT_ID as C,
+  DisplayNames as D,
   TestIds as T,
-  DEFAULT_HTML_TAG as a,
-  blendModes as b,
-  dataHooks as d
+  TEXT_TWIST_PANEL_ID as a,
+  noiseIntensityConfig as n
 };

package/dist/site/components/chunks/constants11.js

@@ -1,28 +1,26 @@
-import { S as SharedDisplayNames } from "./constants10.js";
+import { S as SharedDisplayNames } from "./constants9.js";
 const TestIds = {
   viewer: {
-    container: "TextEffectsNoisy-container",
-    text: "TextEffectsNoisy-text"
+    container: "TextEffectsNeonSign-container",
+    text: "TextEffectsNeonSign-text"
   }
 };
-const noiseIntensityConfig = {
-  start: 1,
-  end: 53,
-  step: 1
-};
-const COMPONENT_ID = "3f9c1e82-a7d6-4b5e-8c2a-9d4f6e3b7a1c";
-const TEXT_TWIST_PANEL_ID = "0bba51ec-ca53-4662-acf6-ea71ffbb4f55";
+const COMPONENT_ID = "8c1f4b9e-d3a7-4e2c-a5b8-7d9f1e6c4a2b";
+const TEXT_TWIST_PANEL_ID = "37855762-0e6d-4818-85ed-73c9a844825f";
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
-    textEffectsColor1: "Color",
-    squigglyLevel: "Noise intensity"
+    textColor: "Color",
+    shadowColor: "Color",
+    shadowOpacity: "Opacity",
+    shadowBlur: "Blur",
+    innerAnimationSpeed: "Speed",
+    disableInnerAnimation: "Animation"
   }
 };
 export {
   COMPONENT_ID as C,
   DisplayNames as D,
   TestIds as T,
-  TEXT_TWIST_PANEL_ID as a,
-  noiseIntensityConfig as n
+  TEXT_TWIST_PANEL_ID as a
 };

package/dist/site/components/chunks/constants12.js

@@ -1,19 +1,19 @@
-import { S as SharedDisplayNames } from "./constants10.js";
+import { S as SharedDisplayNames } from "./constants9.js";
 const TestIds = {
   viewer: {
-    container: "TextEffectsNeonSign-container",
-    text: "TextEffectsNeonSign-text"
+    container: "TextEffectsMatrix-container",
+    text: "TextEffectsMatrix-text"
   }
 };
-const COMPONENT_ID = "8c1f4b9e-d3a7-4e2c-a5b8-7d9f1e6c4a2b";
-const TEXT_TWIST_PANEL_ID = "37855762-0e6d-4818-85ed-73c9a844825f";
+const COMPONENT_ID = "45e26ded-fab2-4208-b6ae-3514ddea4cb0";
+const TEXT_TWIST_PANEL_ID = "ea4f3040-ce0b-44e3-a90b-7fcb74ba1a7b";
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
-    textColor: "Color",
-    shadowColor: "Color",
-    shadowOpacity: "Opacity",
-    shadowBlur: "Blur",
+    textEffectsColor1: "Color",
+    maskPosition: "Position",
+    maskBlur: "Blur",
+    textBlur: "Spread",
     innerAnimationSpeed: "Speed",
     disableInnerAnimation: "Animation"
   }

package/dist/site/components/chunks/constants13.js

@@ -1,21 +1,19 @@
-import { S as SharedDisplayNames } from "./constants10.js";
+import { S as SharedDisplayNames } from "./constants9.js";
 const TestIds = {
   viewer: {
-    container: "TextEffectsMatrix-container",
-    text: "TextEffectsMatrix-text"
+    container: "TextEffectsLetterPress-container",
+    text: "TextEffectsLetterPress-text"
   }
 };
-const COMPONENT_ID = "45e26ded-fab2-4208-b6ae-3514ddea4cb0";
-const TEXT_TWIST_PANEL_ID = "ea4f3040-ce0b-44e3-a90b-7fcb74ba1a7b";
+const COMPONENT_ID = "9d2a5c8f-e4b1-4f6d-b7a3-8e1c9f5d2b4a";
+const TEXT_TWIST_PANEL_ID = "4f36b4fa-893a-4eb2-a1b3-7c82351f063b";
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
+    shadow: "Shadow",
+    layerBlendMode: "Blend mode",
     textEffectsColor1: "Color",
-    maskPosition: "Position",
-    maskBlur: "Blur",
-    textBlur: "Spread",
-    innerAnimationSpeed: "Speed",
-    disableInnerAnimation: "Animation"
+    textEffectsOpacityColor1: "opacity"
   }
 };
 export {

package/dist/site/components/chunks/constants14.js

@@ -1,19 +1,23 @@
-import { S as SharedDisplayNames } from "./constants10.js";
+import { S as SharedDisplayNames } from "./constants9.js";
 const TestIds = {
   viewer: {
-    container: "TextEffectsLetterPress-container",
-    text: "TextEffectsLetterPress-text"
+    container: "TextEffectsGlitch-container",
+    text: "TextEffectsGlitch-text"
   }
 };
-const COMPONENT_ID = "9d2a5c8f-e4b1-4f6d-b7a3-8e1c9f5d2b4a";
-const TEXT_TWIST_PANEL_ID = "4f36b4fa-893a-4eb2-a1b3-7c82351f063b";
+const COMPONENT_ID = "1e3b6d9a-f5c2-4a8e-9c4b-2d7f8a1e5c3b";
+const TEXT_TWIST_PANEL_ID = "dde110d1-a3b1-4ba3-91d1-7c2face79c7b";
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
-    shadow: "Shadow",
-    layerBlendMode: "Blend mode",
-    textEffectsColor1: "Color",
-    textEffectsOpacityColor1: "opacity"
+    textEffectsColor1: "Color 1",
+    textEffectsColor2: "Color 2",
+    textEffectsColor3: "Color 3",
+    layerAngle: "Angle",
+    layerDistance: "Space between layers",
+    shadowBlur: "Blur",
+    disableInnerAnimation: "Animation",
+    innerAnimationSpeed: "Speed"
   }
 };
 export {

package/dist/site/components/chunks/constants15.js

@@ -1,28 +1,31 @@
-import { S as SharedDisplayNames } from "./constants10.js";
+import { S as SharedDisplayNames } from "./constants9.js";
+const COMPONENT_ID = "d578a270-a696-4e0f-a876-bd47dc8c62b3";
+const TEXT_TWIST_PANEL_ID = "279c908d-b75f-4111-bbf1-7745ec173bc0";
 const TestIds = {
   viewer: {
-    container: "TextEffectsGlitch-container",
-    text: "TextEffectsGlitch-text"
+    container: "TextEffectsGlass-container",
+    text: "TextEffectsGlass-text"
   }
 };
-const COMPONENT_ID = "1e3b6d9a-f5c2-4a8e-9c4b-2d7f8a1e5c3b";
-const TEXT_TWIST_PANEL_ID = "dde110d1-a3b1-4ba3-91d1-7c2face79c7b";
+const blurConfig = {
+  start: 2,
+  end: 10,
+  step: 1
+};
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
-    textEffectsColor1: "Color 1",
-    textEffectsColor2: "Color 2",
-    textEffectsColor3: "Color 3",
-    layerAngle: "Angle",
-    layerDistance: "Space between layers",
-    shadowBlur: "Blur",
-    disableInnerAnimation: "Animation",
-    innerAnimationSpeed: "Speed"
+    textColor: "Color",
+    stroke: "Color",
+    strokeWidth: "width",
+    shadowBlur: "Spread",
+    shadowColor: "Color"
   }
 };
 export {
   COMPONENT_ID as C,
   DisplayNames as D,
   TestIds as T,
-  TEXT_TWIST_PANEL_ID as a
+  TEXT_TWIST_PANEL_ID as a,
+  blurConfig as b
 };

package/dist/site/components/chunks/constants16.js

@@ -1,31 +1,26 @@
-import { S as SharedDisplayNames } from "./constants10.js";
-const COMPONENT_ID = "d578a270-a696-4e0f-a876-bd47dc8c62b3";
-const TEXT_TWIST_PANEL_ID = "279c908d-b75f-4111-bbf1-7745ec173bc0";
+import { S as SharedDisplayNames } from "./constants9.js";
 const TestIds = {
   viewer: {
-    container: "TextEffectsGlass-container",
-    text: "TextEffectsGlass-text"
+    container: "TextEffectsBauhaus-container",
+    text: "TextEffectsBauhaus-text"
   }
 };
-const blurConfig = {
-  start: 2,
-  end: 10,
-  step: 1
-};
+const COMPONENT_ID = "8c22adab-12f9-43ee-80c8-6f5dbe19eabe";
+const TEXT_TWIST_PANEL_ID = "cdacc489-4176-4558-97f3-0a23662a15ba";
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
-    textColor: "Color",
-    stroke: "Color",
-    strokeWidth: "width",
-    shadowBlur: "Spread",
-    shadowColor: "Color"
+    bevelAngle: "Angle",
+    textEffectsColor1: "Color 1",
+    textEffectsColor2: "Color 2",
+    textEffectsColor3: "Color 3",
+    shadowDistance: "Distance",
+    layerBlendMode: "Blend mode"
   }
 };
 export {
   COMPONENT_ID as C,
   DisplayNames as D,
   TestIds as T,
-  TEXT_TWIST_PANEL_ID as a,
-  blurConfig as b
+  TEXT_TWIST_PANEL_ID as a
 };

package/dist/site/components/chunks/constants17.js

@@ -1,21 +1,23 @@
-import { S as SharedDisplayNames } from "./constants10.js";
+import { S as SharedDisplayNames } from "./constants9.js";
+const COMPONENT_ID = "90c63713-61c9-4284-8e13-a4a2f1b7559d";
+const TEXT_TWIST_PANEL_ID = "ba438bb1-6b58-427d-9c54-5516cb94840e";
 const TestIds = {
   viewer: {
-    container: "TextEffectsBauhaus-container",
-    text: "TextEffectsBauhaus-text"
+    container: "TextEffects3d-container",
+    text: "TextEffects3d-text"
   }
 };
-const COMPONENT_ID = "8c22adab-12f9-43ee-80c8-6f5dbe19eabe";
-const TEXT_TWIST_PANEL_ID = "cdacc489-4176-4558-97f3-0a23662a15ba";
 const DisplayNames = {
   ...SharedDisplayNames,
   cssCustomProperties: {
-    bevelAngle: "Angle",
-    textEffectsColor1: "Color 1",
-    textEffectsColor2: "Color 2",
-    textEffectsColor3: "Color 3",
-    shadowDistance: "Distance",
-    layerBlendMode: "Blend mode"
+    fillColor: "Color",
+    fillOpacity: "opacity",
+    textStroke: "Width",
+    textStrokeColor: "Color",
+    textStrokeOpacity: "opacity",
+    textShadow1: "Shadow 1",
+    textShadow2: "Shadow 2",
+    textShadow3: "Shadow 3"
   }
 };
 export {

package/dist/site/components/chunks/constants18.js

@@ -1,28 +1,103 @@
-import { S as SharedDisplayNames } from "./constants10.js";
-const COMPONENT_ID = "90c63713-61c9-4284-8e13-a4a2f1b7559d";
-const TEXT_TWIST_PANEL_ID = "ba438bb1-6b58-427d-9c54-5516cb94840e";
-const TestIds = {
-  viewer: {
-    container: "TextEffects3d-container",
-    text: "TextEffects3d-text"
+const DisplayNames = {
+  root: {
+    elementDisplayName: "Text Box",
+    data: {
+      value: "Value",
+      defaultValue: "Default text",
+      label: "Label",
+      tooltip: "Tooltip",
+      placeholder: "Placeholder",
+      required: "Required",
+      readOnly: "Read only",
+      disabled: "Disabled",
+      minLength: "Minimum characters",
+      maxLength: "Maximum characters",
+      description: "Helper text"
+    },
+    cssCustomProperties: {
+      gap: "Space between label and field",
+      labelAlignment: "Label alignment",
+      descriptionSpacing: "Space between field and helper text"
+    }
+  },
+  input: {
+    elementDisplayName: "Input",
+    cssCustomProperties: {
+      placeholderTextColor: "Placeholder text color",
+      borderColor: "Border color",
+      borderWidth: "Border width",
+      resize: "Resize"
+    },
+    options: {
+      resizeOff: "Off",
+      resizeVertical: "Vertical",
+      resizeBoth: "Both"
+    },
+    displayGroups: {
+      borderGroup: "Border"
+    }
+  },
+  label: {
+    elementDisplayName: "Label"
+  },
+  description: {
+    elementDisplayName: "Helper text"
   }
 };
-const DisplayNames = {
-  ...SharedDisplayNames,
-  cssCustomProperties: {
-    fillColor: "Color",
-    fillOpacity: "opacity",
-    textStroke: "Width",
-    textStrokeColor: "Color",
-    textStrokeOpacity: "opacity",
-    textShadow1: "Shadow 1",
-    textShadow2: "Shadow 2",
-    textShadow3: "Shadow 3"
+const DesignStates = {
+  input: {
+    hover: { displayName: "Hover", className: "textbox__input--hover" },
+    focus: { displayName: "Focus", className: "textbox__input--focus" },
+    disabled: {
+      displayName: "Disabled",
+      className: "textbox__input--disabled"
+    },
+    invalid: { displayName: "Error", className: "textbox__input--invalid" }
   }
 };
+const defaultValues = {
+  defaultValue: "",
+  label: "Label",
+  tooltip: "",
+  placeholder: "Enter your text here...",
+  description: "",
+  required: false,
+  readOnly: false,
+  disabled: false
+};
+const VALIDATION_MESSAGES = {
+  valueMissing: "This field is required",
+  tooShort: (minLength) => `Please use at least ${minLength} characters`,
+  tooLong: (maxLength) => `Please use no more than ${maxLength} characters`
+};
+const TestIds = {
+  root: "textbox-root",
+  input: "textbox-input",
+  label: "textbox-label",
+  requiredIndicator: "textbox-required-indicator",
+  tooltipButton: "textbox-tooltip-button",
+  description: "textbox-description",
+  errorMessage: "textbox-error-message"
+};
+const selectors = {
+  root: "textbox",
+  input: "textbox__input",
+  label: "textbox__label",
+  description: "textbox__description"
+};
+const semanticClassNames = {
+  input: "textbox__input",
+  label: "textbox__label",
+  requiredIndicator: "textbox__required-indicator",
+  description: "textbox__description",
+  errorMessage: "textbox__error-message"
+};
 export {
-  COMPONENT_ID as C,
-  DisplayNames as D,
+  DesignStates as D,
   TestIds as T,
-  TEXT_TWIST_PANEL_ID as a
+  VALIDATION_MESSAGES as V,
+  semanticClassNames as a,
+  DisplayNames as b,
+  defaultValues as d,
+  selectors as s
 };

package/dist/site/components/chunks/constants19.js

@@ -1,103 +1,61 @@
+const DEFAULT_ANIMATION_DURATION = 0.2;
+const AnimatedSvgIds = {
+  animatedSvg: "animatedSvg",
+  animatedTagPath: "animatedPath",
+  animateTagForward: "animateForward",
+  animateTagBackward: "animateBackward"
+};
+var AnimationDirection = /* @__PURE__ */ ((AnimationDirection2) => {
+  AnimationDirection2["FORWARD"] = "Forward";
+  AnimationDirection2["BACKWARD"] = "Backward";
+  return AnimationDirection2;
+})(AnimationDirection || {});
+const AnimatedDataAttributes = {
+  [
+    "Forward"
+    /* FORWARD */
+  ]: "data-animated-end-path",
+  [
+    "Backward"
+    /* BACKWARD */
+  ]: "data-animated-start-path"
+};
+const TestIds = {
+  animatedSvg: "animated-svg",
+  animateTagForward: "animate-tag-forward",
+  animateTagBackward: "animate-tag-backward"
+};
+const DesignStates = {
+  root: {
+    hover: { displayName: "Hover", className: "animated-icon--hover" },
+    disabled: { displayName: "Disabled", className: "animated-icon--disabled" },
+    selected: { displayName: "Selected", className: "animated-icon--selected" }
+  }
+};
 const DisplayNames = {
   root: {
-    elementDisplayName: "Text Box",
+    elementDisplayName: "Animated Icon",
+    customActions: {
+      animatedIcon: {
+        displayName: "Icon"
+      }
+    },
     data: {
-      value: "Value",
-      defaultValue: "Default text",
-      label: "Label",
-      tooltip: "Tooltip",
-      placeholder: "Placeholder",
-      required: "Required",
-      readOnly: "Read only",
-      disabled: "Disabled",
-      minLength: "Minimum characters",
-      maxLength: "Maximum characters",
-      description: "Helper text"
+      duration: "Duration"
     },
     cssCustomProperties: {
-      gap: "Space between label and field",
-      labelAlignment: "Label alignment",
-      descriptionSpacing: "Space between field and helper text"
-    }
-  },
-  input: {
-    elementDisplayName: "Input",
-    cssCustomProperties: {
-      placeholderTextColor: "Placeholder text color",
-      borderColor: "Border color",
-      borderWidth: "Border width",
-      resize: "Resize"
-    },
-    options: {
-      resizeOff: "Off",
-      resizeVertical: "Vertical",
-      resizeBoth: "Both"
-    },
-    displayGroups: {
-      borderGroup: "Border"
+      size: "Size",
+      fill: "Color",
+      rotation: "Rotation"
     }
-  },
-  label: {
-    elementDisplayName: "Label"
-  },
-  description: {
-    elementDisplayName: "Helper text"
-  }
-};
-const DesignStates = {
-  input: {
-    hover: { displayName: "Hover", className: "textbox__input--hover" },
-    focus: { displayName: "Focus", className: "textbox__input--focus" },
-    disabled: {
-      displayName: "Disabled",
-      className: "textbox__input--disabled"
-    },
-    invalid: { displayName: "Error", className: "textbox__input--invalid" }
   }
 };
-const defaultValues = {
-  defaultValue: "",
-  label: "Label",
-  tooltip: "",
-  placeholder: "Enter your text here...",
-  description: "",
-  required: false,
-  readOnly: false,
-  disabled: false
-};
-const VALIDATION_MESSAGES = {
-  valueMissing: "This field is required",
-  tooShort: (minLength) => `Please use at least ${minLength} characters`,
-  tooLong: (maxLength) => `Please use no more than ${maxLength} characters`
-};
-const TestIds = {
-  root: "textbox-root",
-  input: "textbox-input",
-  label: "textbox-label",
-  requiredIndicator: "textbox-required-indicator",
-  tooltipButton: "textbox-tooltip-button",
-  description: "textbox-description",
-  errorMessage: "textbox-error-message"
-};
-const selectors = {
-  root: "textbox",
-  input: "textbox__input",
-  label: "textbox__label",
-  description: "textbox__description"
-};
-const semanticClassNames = {
-  input: "textbox__input",
-  label: "textbox__label",
-  requiredIndicator: "textbox__required-indicator",
-  description: "textbox__description",
-  errorMessage: "textbox__error-message"
-};
 export {
-  DesignStates as D,
+  AnimatedSvgIds as A,
+  DEFAULT_ANIMATION_DURATION as D,
   TestIds as T,
-  VALIDATION_MESSAGES as V,
-  semanticClassNames as a,
-  DisplayNames as b,
-  defaultValues as d,
-  selectors as s
+  AnimatedDataAttributes as a,
+  AnimationDirection as b,
+  DesignStates as c,
+  DisplayNames as d
 };