@ornikar/kitt-universal 27.5.1-canary.4d3ec9b2bbb3371c254ae88141f81bb445a59f73.0 → 27.6.0

package/dist/linaria-themes.es.js

@@ -1867,43 +1867,8 @@ var highlight = {
   }
 };
 
-var getIconSizeFromFontSize = function (fontSize) {
-  if (fontSize <= 14) return 16;
-  if (fontSize <= 16) return 20;
-  return 24;
-};
-var createTypographyIconSizeConfig = function (baseAndSmallFontSize, mediumAndWideFontSize) {
-  var baseAndSmallIconSize = getIconSizeFromFontSize(baseAndSmallFontSize);
-  var mediumAndWideIconSize = getIconSizeFromFontSize(mediumAndWideFontSize);
-  return {
-    baseAndSmall: {
-      iconSize: baseAndSmallIconSize
-    },
-    mediumAndWide: {
-      iconSize: mediumAndWideIconSize
-    }
-  };
-};
 var icon = {
-  defaultSize: 20,
-  // Note: this is based on typography updated sizes, not current https://github.com/ornikar/kitt/pull/2130
-  typographySize: {
-    // also known as xxlarge
-    header1: createTypographyIconSizeConfig(40, 56),
-    // also known as xlarge
-    header2: createTypographyIconSizeConfig(32, 48),
-    // also known as medium
-    header3: createTypographyIconSizeConfig(24, 40),
-    // also known as xsmall
-    header4: createTypographyIconSizeConfig(18, 24),
-    // also known as xxsmall
-    header5: createTypographyIconSizeConfig(18, 18),
-    'body-large': createTypographyIconSizeConfig(18, 24),
-    'body-medium': createTypographyIconSizeConfig(18, 18),
-    body: createTypographyIconSizeConfig(16, 16),
-    'body-small': createTypographyIconSizeConfig(14, 14),
-    'body-xsmall': createTypographyIconSizeConfig(12, 12)
-  }
+  defaultSize: 20
 };
 
 var iconButton = {
@@ -2330,6 +2295,183 @@ var skeleton = {
   }
 };
 
+var tabBar = {
+  underline: {
+    "default": {
+      active: {
+        color: {
+          "default": deepPurpleColorPalette['deepPurple.8'],
+          focused: deepPurpleColorPalette['deepPurple.8'],
+          hovered: deepPurpleColorPalette['deepPurple.8'],
+          pressed: deepPurpleColorPalette['deepPurple.8']
+        },
+        indicator: {
+          backgroundColor: deepPurpleColorPalette['deepPurple.8']
+        }
+      },
+      inactive: {
+        color: {
+          "default": deepPurpleColorPalette['grey.5'],
+          focused: deepPurpleColorPalette['grey.5'],
+          hovered: deepPurpleColorPalette['deepPurple.8'],
+          pressed: deepPurpleColorPalette['deepPurple.8']
+        },
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      disabled: {
+        color: {
+          "default": deepPurpleColorPalette['grey.3'],
+          focused: deepPurpleColorPalette['grey.3'],
+          hovered: deepPurpleColorPalette['grey.3'],
+          pressed: deepPurpleColorPalette['grey.3']
+        },
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      borderBottomColor: deepPurpleColorPalette['beige.3']
+    },
+    revert: {
+      active: {
+        color: {
+          "default": deepPurpleColorPalette['grey.0'],
+          focused: deepPurpleColorPalette['grey.0'],
+          hovered: deepPurpleColorPalette['grey.0'],
+          pressed: deepPurpleColorPalette['grey.0']
+        },
+        indicator: {
+          backgroundColor: deepPurpleColorPalette['grey.0']
+        }
+      },
+      inactive: {
+        color: {
+          "default": deepPurpleColorPalette['white-alpha.80'],
+          focused: deepPurpleColorPalette['white-alpha.80'],
+          hovered: deepPurpleColorPalette['grey.0'],
+          pressed: deepPurpleColorPalette['grey.0']
+        },
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      disabled: {
+        color: {
+          "default": deepPurpleColorPalette['white-alpha.20'],
+          focused: deepPurpleColorPalette['white-alpha.20'],
+          hovered: deepPurpleColorPalette['white-alpha.20'],
+          pressed: deepPurpleColorPalette['white-alpha.20']
+        },
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      borderBottomColor: deepPurpleColorPalette['white-alpha.20']
+    }
+  },
+  solid: {
+    "default": {
+      active: {
+        color: {
+          "default": deepPurpleColorPalette['grey.0'],
+          focused: deepPurpleColorPalette['grey.0'],
+          hovered: deepPurpleColorPalette['grey.0'],
+          pressed: deepPurpleColorPalette['grey.0']
+        },
+        backgroundColor: {
+          "default": deepPurpleColorPalette['deepPurple.8'],
+          focused: deepPurpleColorPalette['deepPurple.8'],
+          hovered: deepPurpleColorPalette['deepPurple.8'],
+          pressed: deepPurpleColorPalette['deepPurple.8']
+        },
+        borderRadius: 4,
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      inactive: {
+        color: {
+          "default": deepPurpleColorPalette['grey.5'],
+          focused: deepPurpleColorPalette['grey.5'],
+          hovered: deepPurpleColorPalette['grey.5'],
+          pressed: deepPurpleColorPalette['grey.5']
+        },
+        backgroundColor: {
+          "default": undefined,
+          focused: undefined,
+          hovered: deepPurpleColorPalette['beige.1'],
+          pressed: deepPurpleColorPalette['beige.1']
+        },
+        borderRadius: 4,
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      disabled: {
+        color: {
+          "default": deepPurpleColorPalette['grey.3'],
+          focused: deepPurpleColorPalette['grey.3'],
+          hovered: deepPurpleColorPalette['grey.3'],
+          pressed: deepPurpleColorPalette['grey.3']
+        },
+        indicator: {
+          backgroundColor: undefined
+        }
+      }
+    },
+    revert: {
+      active: {
+        color: {
+          "default": deepPurpleColorPalette['deepPurple.8'],
+          focused: deepPurpleColorPalette['deepPurple.8'],
+          hovered: deepPurpleColorPalette['deepPurple.8'],
+          pressed: deepPurpleColorPalette['deepPurple.8']
+        },
+        backgroundColor: {
+          "default": deepPurpleColorPalette['grey.0'],
+          focused: deepPurpleColorPalette['grey.0'],
+          hovered: deepPurpleColorPalette['grey.0'],
+          pressed: deepPurpleColorPalette['grey.0']
+        },
+        borderRadius: 4,
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      inactive: {
+        color: {
+          "default": deepPurpleColorPalette['white-alpha.80'],
+          focused: deepPurpleColorPalette['white-alpha.80'],
+          hovered: deepPurpleColorPalette['white-alpha.80'],
+          pressed: deepPurpleColorPalette['white-alpha.80']
+        },
+        backgroundColor: {
+          "default": undefined,
+          focused: undefined,
+          hovered: deepPurpleColorPalette['white-alpha.10'],
+          pressed: deepPurpleColorPalette['white-alpha.10']
+        },
+        borderRadius: 4,
+        indicator: {
+          backgroundColor: undefined
+        }
+      },
+      disabled: {
+        color: {
+          "default": deepPurpleColorPalette['white-alpha.20'],
+          focused: deepPurpleColorPalette['white-alpha.20'],
+          hovered: deepPurpleColorPalette['white-alpha.20'],
+          pressed: deepPurpleColorPalette['white-alpha.20']
+        },
+        indicator: {
+          backgroundColor: undefined
+        }
+      }
+    }
+  }
+};
+
 var tag = {
   borderRadius: 16,
   icon: {
@@ -2471,6 +2613,7 @@ var theme = {
   picker: picker,
   shadows: shadows,
   skeleton: skeleton,
+  tabBar: tabBar,
   tag: tag,
   tooltip: tooltip,
   typography: typography,