@factorearth/component-library 3.6.9-alpha.0 → 3.6.11-alpha.0

package/dist/Theme/tokens.json

@@ -5,112 +5,151 @@
             "type": "lineHeights"
         },
         "Base Colors": {
+            "100-white": {
+                "value": "#FFFFFF",
+                "type": "color",
+                "description": "Background, Primary Button Background Dark, Primary Link Dark"
+            },
             "200-white-grey": {
                 "value": "#FCFCFD",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
                 "description": "Container Background, Text Dark"
             },
-            "300-French-grey": {
+            "300-porcelain-grey": {
+                "value": "#EFF0F0",
+                "type": "color",
+                "description": "Border 2 Dark"
+            },
+            "400-iron-grey": {
+                "value": "#DCDEE0",
+                "type": "color",
+                "description": "Border 2, Border Dark"
+            },
+            "500-French-grey": {
                 "value": "#d0d8dc",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
                 "description": "Text 2 Dark"
             },
-            "400-cadet-grey": {
+            "600-cadet-grey": {
                 "value": "#9aa3ac",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
                 "description": "Text 3"
             },
-            "500-slate-grey": {
+            "700-regent-grey": {
+                "value": "#89949F",
+                "type": "color",
+                "description": "Border"
+            },
+            "800-slate-grey": {
                 "value": "#6e7a87",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
                 "description": "Text 3"
             },
-            "600-space-grey": {
+            "900-space-grey": {
                 "value": "#2f3034",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
                 "description": "Text 2, Container Background 2 Dark"
             },
-            "700-grey": {
-                "value": "#1b1b1e",
+            "1000-blue-grey": {
+                "value": "#0D1A26",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
-                "description": "Text, Container Background Dark, Primary Label Dark"
+                "description": "Default Badge Label"
             },
-            "300-light-blue": {
-                "value": "#ebf7ff",
+            "1100-grey": {
+                "value": "#1b1b1e",
                 "type": "color",
                 "parent": "Collection 1/Mode 1",
-                "description": "Container Background 2"
+                "description": "Text, Container Background Dark, Primary Label Dark"
             },
-            "700-blue": {
-                "value": "#004F80",
+            "1200-black": {
+                "value": "#000000",
                 "type": "color",
-                "parent": "Collection 1/Mode 1",
-                "description": "Primary Button Background, Primary Link"
+                "description": "Background Dark"
             },
-            "500-green": {
-                "value": "#365E3D",
+            "100-error-pink": {
+                "value": "#FCE9E9",
                 "type": "color",
-                "parent": "Collection 1/Mode 1"
+                "description": "Error Red Background"
             },
-            "700-red": {
+            "200-red": {
                 "value": "#BF4040",
                 "type": "color",
                 "parent": "Collection 1/Mode 1"
             },
-            "100-white": {
-                "value": "#FFFFFF",
+            "300-fuscia": {
+                "value": "#A44D9B",
                 "type": "color",
-                "description": "Background, Primary Button Background Dark, Primary Link Dark"
+                "description": "Factor Earth Fuscia"
             },
-            "500-regent-grey": {
-                "value": "#89949F",
+            "400-error-red": {
+                "value": "#660000",
                 "type": "color",
-                "description": "Border"
+                "description": "Error Red Label"
             },
-            "300-iron-grey": {
-                "value": "#DCDEE0",
+            "100-warning-orange": {
+                "value": "#FCF2E9",
                 "type": "color",
-                "description": "Border 2, Border Dark"
+                "description": "Warning Orange Background"
             },
-            "800-black": {
-                "value": "#000000",
+            "200-grain-yellow": {
+                "value": "#DCCAAD",
                 "type": "color",
-                "description": "Background Dark"
+                "description": "Factor Earth Grain"
             },
-            "300-porcelain-grey": {
-                "value": "#EFF0F0",
-                "type": "color",
-                "description": "Border 2 Dark"
-            }
-        },
-        "Brand Colors": {
-            "Factor Earth  Fuscia": {
-                "value": "#A44D9B",
+            "300-warning-orange": {
+                "value": "#663300",
                 "type": "color",
-                "description": "Factor Earth Fuscia"
+                "description": "Warning Orange Label"
             },
-            "Factor Earth Grain": {
-                "value": "#DCCAAD",
+            "100-light-green": {
+                "value": "#EBFAED",
                 "type": "color",
-                "description": "Factor Earth Grain"
+                "description": "Success Green Background"
             },
-            "Factor Earth Tea Flower": {
+            "200-tea-green": {
                 "value": "#BEDFB9",
                 "type": "color",
                 "description": "Factor Earth Tea Flower"
             },
-            "Factor Earth Tropaz": {
+            "300-green": {
+                "value": "#365E3D",
+                "type": "color",
+                "parent": "Collection 1/Mode 1"
+            },
+            "100-lighter-blue": {
+                "value": "#E6EEFE",
+                "type": "color",
+                "description": "Info Blue Background"
+            },
+            "200-light-blue": {
+                "value": "#ebf7ff",
+                "type": "color",
+                "parent": "Collection 1/Mode 1",
+                "description": "Container Background 2"
+            },
+            "300-tropaz-blue": {
                 "value": "#325690",
                 "type": "color",
                 "description": "Factor Earth Tropaz"
             },
-            "Metcalf Bison Blue": {
+            "400-blue": {
+                "value": "#004F80",
+                "type": "color",
+                "parent": "Collection 1/Mode 1",
+                "description": "Primary Button Background, Primary Link"
+            },
+            "500-info-blue": {
+                "value": "#002266",
+                "type": "color",
+                "description": "Info Blue Label"
+            },
+            "600-bison-blue": {
                 "value": "#142541",
                 "type": "color",
                 "description": "Metcalf Bison Blue"
@@ -233,48 +272,6 @@
                 "paragraphIndent": "0"
             },
             "type": "typography"
-        },
-        "Badge Colors": {
-            "Info Blue Background": {
-                "value": "#E6EEFE",
-                "type": "color",
-                "description": "Info Blue Background"
-            },
-            "Info Blue Label": {
-                "value": "#002266",
-                "type": "color",
-                "description": "Info Blue Label"
-            },
-            "Success Green Background": {
-                "value": "#EBFAED",
-                "type": "color",
-                "description": "Success Green Background"
-            },
-            "Sucess Green Label": {
-                "value": "#365E3D",
-                "type": "color",
-                "description": "Success Green Label"
-            },
-            "Warning Orange Background": {
-                "value": "#FCF2E9",
-                "type": "color",
-                "description": "Warning Orange Background"
-            },
-            "Warning Orange Label": {
-                "value": "#663300",
-                "type": "color",
-                "description": "Warning Orange Label"
-            },
-            "Error Red Background": {
-                "value": "#FCE9E9",
-                "type": "color",
-                "description": "Error Red Background"
-            },
-            "Error Red Label": {
-                "value": "#660000",
-                "type": "color",
-                "description": "Error Red Label"
-            }
         }
     },
     "$themes": [],

package/dist/Theme/types.d.ts

@@ -5,22 +5,49 @@ interface GreyColorMapping {
     500: string;
     600: string;
     700: string;
+    800: string;
+    900: string;
+    1000: string;
+    1100: string;
+    1200: string;
 }
 interface BlueColorMapping {
+    100: string;
+    200: string;
     300: string;
-    700: string;
+    400: string;
+    500: string;
+    600: string;
 }
 interface GreenColorMapping {
-    500: string;
+    100: string;
+    200: string;
+    300: string;
 }
 interface RedColorMapping {
-    700: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+}
+interface OrangeColorMapping {
+    100: string;
+    300: string;
+}
+interface YellowColorMapping {
+    200: string;
+}
+interface WhiteColorMapping {
+    100: string;
 }
 export interface ThemeBaseColors {
-    grey: GreyColorMapping;
+    yellow: YellowColorMapping;
+    orange: OrangeColorMapping;
     blue: BlueColorMapping;
     green: GreenColorMapping;
+    grey: GreyColorMapping;
     red: RedColorMapping;
+    white: WhiteColorMapping;
 }
 export interface Colors {
     text: {
@@ -28,12 +55,15 @@ export interface Colors {
         secondary: string;
         tertiary: string;
         badge: string;
+        disabled: string;
     };
     background: {
+        absolute: string;
         primary: string;
         secondary: string;
         tertiary: string;
         tableRow: string;
+        disabledInput: string;
     };
     border: {
         primary: string;
@@ -45,6 +75,7 @@ export interface Colors {
         filled: string;
         destructive: string;
         success: string;
+        disabled: string;
     };
     buttonBorder: {
         outlined: string;
@@ -58,13 +89,39 @@ export interface Colors {
         destructive: string;
         success: string;
     };
+    tab: {
+        selected: string;
+        notSelected: string;
+    };
+    tabText: {
+        selected: string;
+        notSelected: string;
+    };
+    badgeText: {
+        outlined: string;
+        filled: string;
+        destructive: string;
+        success: string;
+    };
+    badgeBorder: {
+        outlined: string;
+        filled: string;
+        destructive: string;
+        success: string;
+    };
+    badgeBackground: {
+        outlined: string;
+        filled: string;
+        destructive: string;
+        success: string;
+    };
     highlight: {
         primary: string;
         secondary: string;
     };
     utils: {
         success: string;
-        error: string;
+        destructive: string;
         icon: string;
         disabled: string;
     };

package/dist/index.d.ts

@@ -7,9 +7,12 @@ export * from "./Atoms/TextField/TextField";
 export * from "./Atoms/Buttons/Button";
 export * from "./Atoms/FieldWrapper/FieldWrapper";
 export * from "./Atoms/DropdownField/DropdownField";
-export * from "./Molecules/Thumbnail/Thumbnail";
-export * from "./Organisms/Card/Card";
 export * from "./Atoms/NoteField/NoteField";
 export * from "./Atoms/SelectField/SelectField";
+export * from "./Atoms/Tab/Tab";
+export * from "./Molecules/Form/Form";
+export * from "./Molecules/Thumbnail/Thumbnail";
+export * from "./Organisms/Card/Card";
 export * from "./Organisms/Modal/Modal";
 export * from "./Molecules/NavMenu/NavMenu";
+export * from "./Organisms/TabManager/TabManager";

package/dist/index.js

@@ -1,3 +1,4 @@
+// Atoms
 export * from "./Atoms/MoreHorizonButton/MoreHorizonButton";
 export * from "./Atoms/NumberField/NumberField";
 export * from "./Atoms/PhoneNumberField/PhoneNumberField";
@@ -8,10 +9,15 @@ export * from "./Atoms/TextField/TextField";
 export * from "./Atoms/Buttons/Button";
 export * from "./Atoms/FieldWrapper/FieldWrapper";
 export * from "./Atoms/DropdownField/DropdownField";
-export * from "./Molecules/Thumbnail/Thumbnail";
-export * from "./Organisms/Card/Card";
 export * from "./Atoms/NoteField/NoteField";
 export * from "./Atoms/SelectField/SelectField";
+export * from "./Atoms/Tab/Tab";
+// Molecules
+export * from "./Molecules/Form/Form";
+export * from "./Molecules/Thumbnail/Thumbnail";
+// Organisms
+export * from "./Organisms/Card/Card";
 export * from "./Organisms/Modal/Modal";
 export * from "./Molecules/NavMenu/NavMenu";
+export * from "./Organisms/TabManager/TabManager";
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,6CAA6C,CAAC;AAC5D,cAAc,iCAAiC,CAAC;AAChD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,+BAA+B,CAAC;AAC9C,qDAAqD;AACrD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,mCAAmC,CAAC;AAClD,cAAc,qCAAqC,CAAC;AACpD,cAAc,iCAAiC,CAAC;AAChD,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../lib/index.ts"],"names":[],"mappings":"AAAA,QAAQ;AACR,cAAc,6CAA6C,CAAC;AAC5D,cAAc,iCAAiC,CAAC;AAChD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,+BAA+B,CAAC;AAC9C,qDAAqD;AACrD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,mCAAmC,CAAC;AAClD,cAAc,qCAAqC,CAAC;AACpD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,iBAAiB,CAAC;AAChC,YAAY;AACZ,cAAc,uBAAuB,CAAC;AACtC,cAAc,iCAAiC,CAAC;AAChD,YAAY;AACZ,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mCAAmC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@factorearth/component-library",
-	"version": "3.6.9-alpha.0",
+	"version": "3.6.11-alpha.0",
 	"description": " A storybook component library for FactorEarth",
 	"author": "madtrx <marlin.makori@gmail.com>",
 	"homepage": "https://github.com/FactorEarth/RecordMiddleware#readme",
@@ -46,7 +46,7 @@
 		"access": "public",
 		"registry": "https://registry.npmjs.org/"
 	},
-	"gitHead": "070639f54865569ec8ca16836fcb51bf11e78332",
+	"gitHead": "b4231a8eb279ec94e7135e928b40c0c4f5818cbc",
 	"dependencies": {
 		"@emotion/react": "^11.13.0",
 		"@emotion/styled": "^11.13.0",