@thecb/components 11.10.4-beta.0 → 11.10.4-beta.1

package/dist/index.esm.js

@@ -25938,7 +25938,8 @@ var FormInput = function FormInput(_ref15) {
     minWidth: "100%"
   }, /*#__PURE__*/React__default.createElement(Cluster, {
     justify: "space-between",
-    align: "center"
+    align: "center",
+    overflow: true
   }, labelDisplayOverride ? labelDisplayOverride : /*#__PURE__*/React__default.createElement(Text$1, {
     as: "label",
     color: themeValues.labelColor,
@@ -25946,22 +25947,16 @@ var FormInput = function FormInput(_ref15) {
     fontWeight: themeValues.fontWeight,
     extraStyles: "word-break: break-word;\n                    font-family: Public Sans;\n                    &::first-letter {\n                      text-transform: uppercase;\n                    }",
     id: createIdFromString(labelTextWhenNoError)
-  }, labelTextWhenNoError), type === "password" && /*#__PURE__*/React__default.createElement(Text$1, {
-    variant: labelTextVariant,
-    color: themeValues.linkColor,
-    weight: themeValues.fontWeight,
-    hoverStyles: themeValues.hoverFocusStyles,
-    extraStyles: "text-decoration: underline; cursor: pointer; &:focus { outline-offset: -2px; }",
-    onClick: function onClick() {
+  }, labelTextWhenNoError), type === "password" && /*#__PURE__*/React__default.createElement(ButtonWithAction, {
+    variant: "smallGhost",
+    text: showPassword ? "Hide" : "Show",
+    action: function action() {
       return setShowPassword(!showPassword);
     },
-    tabIndex: "0",
     "aria-label": showPassword ? "Hide Password" : "Show password",
-    "aria-live": "polite",
-    onKeyPress: function onKeyPress(e) {
-      return e.key === "Enter" && setShowPassword(!showPassword);
-    }
-  }, showPassword ? "Hide" : "Show"), isMobile && decorator && /*#__PURE__*/React__default.createElement(Box, {
+    extraStyles: "margin: 0; min-width: auto;",
+    textExtraStyles: "color: ".concat(themeValues.linkColor, ";")
+  }), isMobile && decorator && /*#__PURE__*/React__default.createElement(Box, {
     padding: "0 0 0 auto"
   }, decorator)))), /*#__PURE__*/React__default.createElement(Box, {
     padding: "0"