@ornikar/kitt-universal 18.0.2 → 19.0.0

package/dist/index-node-18.18.es.web.mjs

@@ -540,14 +540,6 @@ const button = {
       activeColor: colors.hover
     }
   },
-  white: {
-    default: {
-      backgroundColor: 'rgba(255, 255, 255, 0.05)',
-      pressedBackgroundColor: 'rgba(255, 255, 255, 0.1)',
-      hoverBackgroundColor: 'rgba(255, 255, 255, 0.1)',
-      focusBorderColor: 'rgba(255, 255, 255, 0.1)'
-    }
-  },
   danger: {
     default: {
       backgroundColor: lateOceanColorPalette.warmEmbraceLight1,
@@ -1187,8 +1179,8 @@ const iconButton = {
   default: {
     pressedBackgroundColor: button.default.default.pressedBackgroundColor
   },
-  white: {
-    pressedBackgroundColor: button.white.default.hoverBackgroundColor
+  ghost: {
+    pressedBackgroundColor: button.default.ghost.pressedBackgroundColor
   },
   primary: {
     pressedBackgroundColor: lateOceanColorPalette.moonPurpleLight1
@@ -2092,13 +2084,11 @@ function TypographyIcon({
   });
 }
 
-const getTextColorByType = (type, variant, isHovered, isPressed) => {
+const getButtonTextColorByType = (type, variant, isHovered, isPressed) => {
   const isButtonInteractedWith = isHovered || isPressed;
   switch (type) {
     case 'primary':
       return variant === 'ghost' ? 'primary' : 'white';
-    case 'white':
-      return 'white';
     case 'danger':
       return 'danger';
     case 'subtle':
@@ -2192,7 +2182,7 @@ function ButtonContent({
   isFocused,
   ...props
 }) {
-  const color = isDisabled ? 'black-light' : getTextColorByType(type, variant, isHovered, isPressed);
+  const color = isDisabled ? 'black-light' : getButtonTextColorByType(type, variant, isHovered, isPressed);
   return /*#__PURE__*/jsx(View, {
     _web: {
       // Make the multilines case work properly on web
@@ -5769,8 +5759,8 @@ function getBackgroundColor$1(color, isDisabled) {
   switch (color) {
     case 'primary':
       return 'kitt.iconButton.primary.pressed.backgroundColor';
-    case 'white':
-      return 'kitt.iconButton.white.pressed.backgroundColor';
+    case 'ghost':
+      return 'kitt.iconButton.ghost.pressed.backgroundColor';
     case 'black':
     default:
       return 'kitt.iconButton.black.pressed.backgroundColor';
@@ -5883,6 +5873,18 @@ function useNativeAnimation() {
   };
 }
 
+const getIconButtonTextColorByColor = (color, disabled) => {
+  if (disabled) {
+    return 'black-light';
+  }
+  switch (color) {
+    case 'ghost':
+      return 'white';
+    default:
+      return color;
+  }
+};
+
 function IconButton({
   icon,
   color = 'black',
@@ -5945,7 +5947,7 @@ function IconButton({
           alignItems: "center",
           justifyContent: "center",
           children: /*#__PURE__*/jsx(TypographyIcon, {
-            color: disabled ? 'black-light' : color,
+            color: getIconButtonTextColorByColor(color, disabled),
             icon: icon
           })
         })]
@@ -6328,7 +6330,7 @@ const getIconButtonColor = messageType => {
   switch (messageType) {
     case 'success':
     case 'danger':
-      return 'white';
+      return 'ghost';
     case 'warning':
     default:
       return 'black';
@@ -6554,7 +6556,6 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
           default: theme.button.default,
           primary: theme.button.primary,
           danger: theme.button.danger,
-          white: theme.button.white,
           subtle: theme.button.subtle,
           'subtle-dark': theme.button['subtle-dark'],
           disabled: theme.button.disabled
@@ -6757,9 +6758,9 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
               backgroundColor: theme.iconButton.default.pressedBackgroundColor
             }
           },
-          white: {
+          ghost: {
             pressed: {
-              backgroundColor: theme.iconButton.white.pressedBackgroundColor
+              backgroundColor: theme.iconButton.ghost.pressedBackgroundColor
             }
           },
           primary: {