colibri-ui 0.7.5 → 0.7.7

package/esm/Theme/themes/default.js

@@ -6,94 +6,113 @@ var ButtonThemeDefault = {
     color: Color.BLACK,
     borderRadius: "26px"
   },
-  "default": {
+  primary: {
     normal: {
-      backgroundColor: Color.NEUTRAL_2,
-      borderColor: Color.NEUTRAL_2
+      color: Color.WHITE,
+      backgroundColor: Color.PRIMARY_4,
+      borderColor: Color.PRIMARY_4
     },
     hover: {
-      backgroundColor: Color.NEUTRAL_3,
-      borderColor: Color.NEUTRAL_3
+      color: Color.WHITE,
+      backgroundColor: Color.PRIMARY_5,
+      borderColor: Color.PRIMARY_5
     },
     focus: {
-      backgroundColor: Color.NEUTRAL_3,
-      borderColor: Color.NEUTRAL_3
+      color: Color.WHITE,
+      backgroundColor: Color.PRIMARY_5,
+      borderColor: Color.PRIMARY_5
     },
     active: {
-      backgroundColor: Color.NEUTRAL_3,
-      borderColor: Color.NEUTRAL_3
+      color: Color.WHITE,
+      backgroundColor: Color.PRIMARY_5,
+      borderColor: Color.PRIMARY_5
     },
     disabled: {
-      color: Color.NEUTRAL_3,
-      backgroundColor: Color.NEUTRAL_1,
-      borderColor: Color.NEUTRAL_1
+      color: Color.PRIMARY_3,
+      backgroundColor: Color.PRIMARY_2,
+      borderColor: Color.PRIMARY_2
     }
   },
-  primary: {
+  secondary: {
     normal: {
       color: Color.WHITE,
-      backgroundColor: Color.BLUE_9,
-      borderColor: Color.BLUE_9
+      backgroundColor: Color.SECONDARY_4,
+      borderColor: Color.SECONDARY_4
     },
     hover: {
       color: Color.WHITE,
-      backgroundColor: Color.BLUE_10,
-      borderColor: Color.BLUE_10
+      backgroundColor: Color.SECONDARY_5,
+      borderColor: Color.SECONDARY_5
     },
     focus: {
       color: Color.WHITE,
-      backgroundColor: Color.BLUE_10,
-      borderColor: Color.BLUE_10
+      backgroundColor: Color.SECONDARY_5,
+      borderColor: Color.SECONDARY_5
     },
     active: {
       color: Color.WHITE,
-      backgroundColor: Color.BLUE_10,
-      borderColor: Color.BLUE_10
+      backgroundColor: Color.SECONDARY_5,
+      borderColor: Color.SECONDARY_5
     },
     disabled: {
-      color: Color.BLUE_7,
-      backgroundColor: Color.BLUE_4,
-      borderColor: Color.BLUE_4
+      color: Color.SECONDARY_3,
+      backgroundColor: Color.SECONDARY_2,
+      borderColor: Color.SECONDARY_2
     }
   },
   clear: {
     normal: {
-      color: Color.GRAY_9,
+      color: Color.TRETIARY_5,
       backgroundColor: Color.WHITE,
       borderColor: Color.WHITE
     },
     hover: {
-      color: Color.BLACK,
-      backgroundColor: Color.NEUTRAL_2,
-      borderColor: Color.NEUTRAL_2
+      color: Color.TRETIARY_5,
+      backgroundColor: Color.TRETIARY_2,
+      borderColor: Color.TRETIARY_2
     },
     active: {
-      color: Color.BLACK,
-      backgroundColor: Color.NEUTRAL_2,
-      borderColor: Color.NEUTRAL_2
+      color: Color.TRETIARY_5,
+      backgroundColor: Color.TRETIARY_2,
+      borderColor: Color.TRETIARY_2
     },
     disabled: {
-      color: Color.NEUTRAL_3,
-      backgroundColor: Color.NEUTRAL_1,
-      borderColor: Color.NEUTRAL_1
+      color: Color.TRETIARY_3,
+      backgroundColor: Color.TRETIARY_1,
+      borderColor: Color.TRETIARY_1
     }
   }
 };
-var TypographyThemeDefault = {
+var CheckboxThemeDefault = {
   primary: {
-    color: Color.TYPOGRAPHY_PRIMARY
-  },
-  secondary: {
-    color: Color.TYPOGRAPHY_SECONDARY
-  },
+    normal: {
+      backgroundColor: Color.PRIMARY_4
+    },
+    hover: {
+      backgroundColor: Color.PRIMARY_4
+    },
+    focus: {
+      boxShadow: "0 0 0 2px ".concat(Color.PRIMARY_1)
+    },
+    checked: {
+      backgroundColor: Color.PRIMARY_4
+    },
+    active: {
+      backgroundColor: Color.PRIMARY_4,
+      borderColor: Color.PRIMARY_4,
+      boxShadow: Color.PRIMARY_4
+    },
+    disabled: {
+      backgroundColor: Color.BG_1
+    }
+  }
+};
+var TypographyThemeDefault = {
   alert: {
-    color: Color.TYPOGRAPHY_ALERT
+    color: Color.ALERT
   },
   success: {
-    color: Color.TYPOGRAPHY_SUCCESS
-  },
-  link: {
-    color: Color.TYPOGRAPHY_LINK
+    color: Color.SUCCESS
   }
 };
 var SwitchThemeDefault = {
@@ -102,20 +121,22 @@ var SwitchThemeDefault = {
   },
   state: {
     normal: {
-      backgroundColor: Color.BLUE_6,
-      borderColor: Color.BLUE_6
+      backgroundColor: Color.BG_1,
+      borderColor: Color.BG_1
     },
     checked: {
-      backgroundColor: Color.BLUE_10,
-      borderColor: Color.BLUE_10
+      backgroundColor: Color.PRIMARY_5,
+      borderColor: Color.PRIMARY_5
     }
   }
 };
 var THEME_DEFAULT = {
   breakpoints: Breakpoints,
   button: ButtonThemeDefault,
+  checkbox: CheckboxThemeDefault,
   typography: TypographyThemeDefault,
-  "switch": SwitchThemeDefault
+  "switch": SwitchThemeDefault,
+  palette: Color
 };
 
-export { ButtonThemeDefault, SwitchThemeDefault, THEME_DEFAULT, TypographyThemeDefault };
+export { ButtonThemeDefault, CheckboxThemeDefault, SwitchThemeDefault, THEME_DEFAULT, TypographyThemeDefault };

package/esm/Typography/index.js

@@ -2,19 +2,17 @@ import { __assign } from 'tslib';
 import { jsx } from '@emotion/react/jsx-runtime';
 import { useMemo, Children } from 'react';
 import { BaseTypography } from './styles.js';
-import { VARIANT } from './index.props.js';
 
 var Typography = function Typography(_a) {
   var _b = _a.tag,
     Element = _b === void 0 ? "span" : _b,
     children = _a.children,
-    _c = _a.variant,
-    variant = _c === void 0 ? VARIANT.PRIMARY : _c,
+    variant = _a.variant,
     size = _a.size,
     fontWeight = _a.fontWeight,
     className = _a.className,
-    _d = _a.nowrap,
-    nowrap = _d === void 0 ? false : _d;
+    _c = _a.nowrap,
+    nowrap = _c === void 0 ? false : _c;
   var isNotComponent = typeof children === "string";
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   var child = useMemo(function () {

package/esm/Typography/index.props.d.ts

@@ -1,20 +1,14 @@
 import type { CSSObject } from "@emotion/react";
 export declare enum VARIANT {
-    PRIMARY = "primary",
-    SECONDARY = "secondary",
     ALERT = "alert",
-    SUCCESS = "success",
-    LINK = "link"
+    SUCCESS = "success"
 }
 type VariantStyles = {
     color?: CSSObject["color"];
 };
 export type TypographyVariant = {
-    [VARIANT.PRIMARY]: VariantStyles;
-    [VARIANT.SECONDARY]: VariantStyles;
     [VARIANT.ALERT]: VariantStyles;
     [VARIANT.SUCCESS]: VariantStyles;
-    [VARIANT.LINK]: VariantStyles;
 };
 export type TypographyFontWeight = "normal" | "medium" | "bold";
 export type TypographySize = "xs" | "s" | "m" | "l" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";