@conveyorhq/arrow-ds 1.65.2 → 1.65.3

package/package.json

@@ -2,7 +2,7 @@
   "name": "@conveyorhq/arrow-ds",
   "author": "Conveyor",
   "license": "MIT",
-  "version": "1.65.2",
+  "version": "1.65.3",
   "description": "Arrow Design System",
   "repository": "https://github.com/conveyor/arrow-ds",
   "publishConfig": {

package/public/components/Input/Input.d.ts

@@ -1,6 +1,6 @@
-import { InputHTMLAttributes, ForwardRefExoticComponent } from "react";
+import { InputHTMLAttributes, ForwardRefExoticComponent, ComponentProps } from "react";
 import { STATUS_VARIANT, THEME } from "../../types";
-import { SharedFaIconProps, IconType } from "../Icon";
+import { Icon, IconType } from "../Icon";
 export declare enum INPUT_ICON_POSITION {
     LEFT = "left",
     RIGHT = "right"
@@ -12,7 +12,7 @@ export interface InputBaseProps {
     theme?: THEME;
     icon?: IconType;
     iconPosition?: INPUT_ICON_POSITION;
-    iconProps?: SharedFaIconProps;
+    iconProps?: ComponentProps<typeof Icon>;
     wrapperClassName?: string;
 }
 export interface InputProps extends InputBaseProps, InputHTMLAttributes<HTMLInputElement> {

package/public/components/Input/Input.js

@@ -44,10 +44,10 @@ const Input = react_1.forwardRef(({ as: Component = "input", className, wrapperC
     const theme = themeProp || themeContext;
     const inputClasses = classnames_1.default(isTextInput && bem_1.bem(cn), bem_1.bem(cn, { m: variant }), bem_1.bem(cn, { m: theme }), disabled && bem_1.bem(cn, { m: "disabled" }), icon && bem_1.bem(cn, { m: `icon-${iconPosition}` }), className);
     const wrapperClasses = classnames_1.default(bem_1.bem(cn, { e: "wrapper" }), wrapperClassName);
-    const { className: iconClassName, ...iconPropsRest } = iconProps;
+    const { className: iconClassName, color: iconColor = "gray-600", ...iconPropsRest } = iconProps;
     const iconClasses = classnames_1.default(bem_1.bem(cn, { e: "icon" }), bem_1.bem(cn, { e: "icon", m: iconPosition }), iconClassName);
     return isTextInput && icon ? (react_1.default.createElement(Box_1.Box, { className: wrapperClasses },
         react_1.default.createElement(Component, Object.assign({ ref: ref, className: inputClasses, id: id, type: type, disabled: disabled }, rest)),
-        react_1.default.createElement(Icon_1.Icon, Object.assign({ icon: icon, className: iconClasses }, iconPropsRest)))) : (react_1.default.createElement(Component, Object.assign({ ref: ref, className: inputClasses, id: id, type: type, disabled: disabled }, rest)));
+        react_1.default.createElement(Icon_1.Icon, Object.assign({ icon: icon, className: iconClasses, color: iconColor }, iconPropsRest)))) : (react_1.default.createElement(Component, Object.assign({ ref: ref, className: inputClasses, id: id, type: type, disabled: disabled }, rest)));
 });
 exports.Input = Input;

package/public/css/styles.css

@@ -4046,8 +4046,6 @@ override built-in Image component classes */
   top: 0;
   height: 100%;
   align-items: center;
-  --tw-text-opacity: 1;
-  color: rgb(134 163 181 / var(--tw-text-opacity));
 }
 
 .ads-TextInput-icon--left {
@@ -8824,6 +8822,11 @@ override built-in Image component classes */
   color: rgb(222 231 238 / var(--tw-text-opacity));
 }
 
+.text-green-400 {
+  --tw-text-opacity: 1;
+  color: rgb(84 175 104 / var(--tw-text-opacity));
+}
+
 .text-brandGreen-400 {
   --tw-text-opacity: 1;
   color: rgb(51 198 159 / var(--tw-text-opacity));