@platformatic/ui-components 0.1.139 → 0.1.140

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@platformatic/ui-components",
   "description": "Platformatic UI Components",
-  "version": "0.1.139",
+  "version": "0.1.140",
   "type": "module",
   "license": "Apache-2.0",
   "repository": {

package/src/components/forms/Input.module.css

@@ -14,7 +14,8 @@
 }
 .afterInputIcon,
 .beforeInputIcon {
-  @apply absolute top-[50%] translate-y-[-50%] z-20;
+  @apply absolute top-[50%] z-20;
+  transform: translateY(-50%);
 }
 .beforeInputIcon {
   @apply left-0 ml-2

package/src/components/forms/Password.module.css

@@ -8,7 +8,8 @@
   @apply border border-solid box-border rounded-md px-2 py-2.5;
 }
 .afterInputIcon {
-  @apply absolute top-[50%] translate-y-[-50%] z-10 ;
+  @apply absolute top-[50%] z-10 ;
+  transform: translateY(-50%);
 }
 .afterInputIcon {
   @apply right-0 mr-2

package/src/components/forms/Select.jsx

@@ -112,7 +112,7 @@ function Select ({
         }}
       >
         <div className={styles.liContent}>
-          {option.iconName && <PlatformaticIcon iconName={option.iconName} color={mainColor} size={SMALL} onClick={null} />}
+          {option.iconName && <PlatformaticIcon iconName={option.iconName} color={option.iconColor || mainColor} size={option.iconSize ?? SMALL} onClick={null} />}
           <span className={optionSpanClassName}>{option.label}</span>
         </div>
         {option.descriptionValue && <span className={`${optionSpanClassName} ${styles.descriptionValue}`}>{option.descriptionValue}</span>}
@@ -212,7 +212,9 @@ Select.propTypes = {
       PropTypes.string,
       PropTypes.number
     ]),
-    icon: PropTypes.string,
+    iconName: PropTypes.string,
+    iconSize: PropTypes.string,
+    iconColor: PropTypes.string,
     notSelectable: PropTypes.bool,
     notFilterable: PropTypes.bool,
     onClick: PropTypes.func,