@foi/design-system 0.0.17 → 0.0.19

package/dist/theme/dark/components/index.d.ts

@@ -1,42 +1,4 @@
 declare const _default: {
-    PAGINATIONMENU: {
-        readonly DEFAULT: {
-            readonly ROOT: {
-                readonly 'background-color': string;
-                readonly 'border-radius': "4px";
-                readonly bottom: "8px";
-            };
-            readonly EVENTS: {
-                readonly ENABLED: {
-                    readonly 'background-color': "transparent";
-                    readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
-                };
-                readonly VALUE: {
-                    readonly 'background-color': string;
-                };
-                readonly HOVER: {
-                    readonly 'background-color': string;
-                };
-                readonly ACTIVE: {
-                    readonly 'background-color': string;
-                };
-                readonly FOCUS: {
-                    readonly 'background-color': string;
-                };
-            };
-        };
-    };
-    PAGINATION: {
-        readonly DEFAULT: {
-            readonly EVENTS: {
-                readonly ENABLED: {
-                    readonly 'color-secondary': string;
-                };
-            };
-        };
-    };
     DATAGRIDMENU: {
         readonly DEFAULT: {
             readonly ROOT: {
@@ -77,111 +39,68 @@ declare const _default: {
             };
         };
     };
-    MODAL: {
+    TOAST: {
         readonly DEFAULT: {
             readonly ROOT: {
-                readonly 'background-color': string;
-                readonly 'border-color': string;
-                readonly 'border-width': "1px";
-                readonly 'border-radius': "8px";
-                readonly 'border-style': "solid";
+                readonly 'border-radius': "4px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
+                    readonly 'background-color': string;
                     readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
+                    readonly 'icon-color': string;
                 };
             };
         };
     };
-    DATEPICKERMENU: {
+    RADIOGROUP: {
         readonly DEFAULT: {
-            readonly ROOT: {
-                readonly 'background-color': string;
-                readonly 'border-radius': "4px";
-            };
             readonly EVENTS: {
                 readonly ENABLED: {
                     readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'background-color': string;
-                };
-                readonly VALUE: {
-                    readonly 'background-color': string;
-                };
-                readonly HOVER: {
-                    readonly 'background-color': string;
                 };
-                readonly ACTIVE: {
-                    readonly 'background-color': string;
+                readonly ERROR: {
+                    readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
                 };
-                readonly FOCUS: {
-                    readonly 'outline-color': string;
-                    readonly 'outline-width': "1px";
-                    readonly 'outline-style': "solid";
-                    readonly 'outline-offset': "2px";
+                readonly DISABLED: {
+                    readonly 'color-secondary': string;
                 };
             };
         };
     };
-    DATEPICKER: {
+    MODAL: {
         readonly DEFAULT: {
             readonly ROOT: {
-                readonly 'border-radius': "4px";
+                readonly 'background-color': string;
+                readonly 'border-radius': "8px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
-                    readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
-                    readonly 'border-color': string;
-                    readonly 'border-width': "2px";
-                    readonly 'border-style': "solid";
-                };
-                readonly VALUE: {
-                    readonly 'border-color': string;
-                };
-                readonly HOVER: {
-                    readonly 'border-color': string;
                 };
-                readonly ACTIVE: {
-                    readonly 'border-color': string;
-                };
-                readonly FOCUS: {
-                    readonly 'border-color': string;
-                };
-                readonly ERROR: {
-                    readonly 'background-color': "transparent";
+            };
+        };
+    };
+    CHECKBOXTREE: {
+        readonly DEFAULT: {
+            readonly EVENTS: {
+                readonly ENABLED: {
                     readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
-                    readonly 'border-color': string;
-                };
-                readonly ERROR_VALUE: {
-                    readonly 'border-color': string;
-                };
-                readonly ERROR_HOVER: {
-                    readonly 'border-color': string;
-                };
-                readonly ERROR_ACTIVE: {
-                    readonly 'border-color': string;
                 };
-                readonly ERROR_FOCUS: {
-                    readonly 'border-color': string;
+                readonly ERROR: {
+                    readonly 'color-secondary': string;
                 };
                 readonly DISABLED: {
-                    readonly 'background-color': "transparent";
-                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
-                    readonly 'border-color': string;
                 };
-                readonly DISABLED_VALUE: {};
             };
         };
     };
-    RADIOGROUP: {
+    CHECKBOXGROUP: {
         readonly DEFAULT: {
             readonly EVENTS: {
                 readonly ENABLED: {
@@ -198,85 +117,90 @@ declare const _default: {
             };
         };
     };
-    RADIO: {
+    TEXTFIELD: {
         readonly DEFAULT: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
+                    readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'icon-color': string;
-                    readonly 'background-color': "transparent";
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
                 };
                 readonly VALUE: {
-                    readonly 'icon-color': string;
                     readonly 'border-color': string;
                 };
                 readonly HOVER: {
-                    readonly 'shadow-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'shadow-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly FOCUS: {
-                    readonly 'outline-color': string;
-                    readonly 'outline-width': "1px";
-                    readonly 'outline-style': "solid";
-                    readonly 'outline-offset': "2px";
+                    readonly 'border-color': string;
                 };
                 readonly ERROR: {
                     readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                 };
                 readonly ERROR_VALUE: {
-                    readonly 'icon-color': string;
-                    readonly 'background-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly ERROR_HOVER: {
-                    readonly 'shadow-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly ERROR_ACTIVE: {
-                    readonly 'shadow-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly ERROR_FOCUS: {
-                    readonly 'outline-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly DISABLED: {
                     readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                 };
-                readonly DISABLED_VALUE: {
-                    readonly 'icon-color': string;
-                };
+                readonly DISABLED_VALUE: {};
             };
         };
     };
-    SLIDER: {
+    SWITCH: {
         readonly DEFAULT: {
+            readonly ROOT: {
+                readonly 'border-radius': "12px";
+            };
             readonly EVENTS: {
                 readonly ENABLED: {
+                    readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
                     readonly 'icon-color': string;
                     readonly 'icon-background-color': string;
-                    readonly 'background-color': string;
+                    readonly 'background-color': "transparent";
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
                 };
                 readonly VALUE: {
+                    readonly 'icon-color': string;
+                    readonly 'icon-background-color': string;
                     readonly 'background-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly HOVER: {
-                    readonly 'background-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'background-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly FOCUS: {
                     readonly 'outline-color': string;
@@ -287,7 +211,8 @@ declare const _default: {
                 readonly DISABLED: {
                     readonly 'icon-color': string;
                     readonly 'icon-background-color': string;
-                    readonly 'background-color': string;
+                    readonly 'background-color': "transparent";
+                    readonly 'color-secondary': string;
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
@@ -303,33 +228,25 @@ declare const _default: {
             };
         };
     };
-    SWITCH: {
+    SLIDER: {
         readonly DEFAULT: {
-            readonly ROOT: {
-                readonly 'border-radius': "12px";
-            };
             readonly EVENTS: {
                 readonly ENABLED: {
-                    readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
                     readonly 'icon-color': string;
                     readonly 'icon-background-color': string;
-                    readonly 'background-color': "transparent";
+                    readonly 'background-color': string;
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
                 };
                 readonly VALUE: {
-                    readonly 'icon-color': string;
-                    readonly 'icon-background-color': string;
                     readonly 'background-color': string;
-                    readonly 'border-color': string;
                 };
                 readonly HOVER: {
-                    readonly 'shadow-color': string;
+                    readonly 'background-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'shadow-color': string;
+                    readonly 'background-color': string;
                 };
                 readonly FOCUS: {
                     readonly 'outline-color': string;
@@ -340,8 +257,7 @@ declare const _default: {
                 readonly DISABLED: {
                     readonly 'icon-color': string;
                     readonly 'icon-background-color': string;
-                    readonly 'background-color': "transparent";
-                    readonly 'color-secondary': string;
+                    readonly 'background-color': string;
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
@@ -443,40 +359,7 @@ declare const _default: {
             };
         };
     };
-    CHECKBOXTREE: {
-        readonly DEFAULT: {
-            readonly EVENTS: {
-                readonly ENABLED: {
-                    readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                };
-                readonly ERROR: {
-                    readonly 'color-secondary': string;
-                };
-                readonly DISABLED: {
-                    readonly 'color-secondary': string;
-                };
-            };
-        };
-    };
-    CHECKBOXGROUP: {
-        readonly DEFAULT: {
-            readonly EVENTS: {
-                readonly ENABLED: {
-                    readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                };
-                readonly ERROR: {
-                    readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                };
-                readonly DISABLED: {
-                    readonly 'color-secondary': string;
-                };
-            };
-        };
-    };
-    CHECKBOX: {
+    RADIO: {
         readonly DEFAULT: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
@@ -493,7 +376,6 @@ declare const _default: {
                 };
                 readonly VALUE: {
                     readonly 'icon-color': string;
-                    readonly 'background-color': string;
                     readonly 'border-color': string;
                 };
                 readonly HOVER: {
@@ -516,7 +398,6 @@ declare const _default: {
                 readonly ERROR_VALUE: {
                     readonly 'icon-color': string;
                     readonly 'background-color': string;
-                    readonly 'border-color': string;
                 };
                 readonly ERROR_HOVER: {
                     readonly 'shadow-color': string;
@@ -534,88 +415,121 @@ declare const _default: {
                 };
                 readonly DISABLED_VALUE: {
                     readonly 'icon-color': string;
-                    readonly 'background-color': string;
                 };
             };
         };
-        readonly PRUEBA: {
+    };
+    PAGINATIONMENU: {
+        readonly DEFAULT: {
             readonly ROOT: {
+                readonly 'background-color': string;
                 readonly 'border-radius': "4px";
+                readonly bottom: "8px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
+                    readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'icon-color': string;
-                    readonly 'background-color': "transparent";
-                    readonly 'border-color': string;
-                    readonly 'border-width': "2px";
-                    readonly 'border-style': "solid";
+                    readonly 'color-tertiary': string;
                 };
                 readonly VALUE: {
-                    readonly 'icon-color': string;
                     readonly 'background-color': string;
-                    readonly 'border-color': string;
                 };
                 readonly HOVER: {
-                    readonly 'shadow-color': string;
+                    readonly 'background-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'shadow-color': string;
+                    readonly 'background-color': string;
                 };
                 readonly FOCUS: {
-                    readonly 'outline-color': string;
-                    readonly 'outline-width': "1px";
-                    readonly 'outline-style': "solid";
-                    readonly 'outline-offset': "2px";
+                    readonly 'background-color': string;
+                };
+            };
+        };
+    };
+    PAGINATION: {
+        readonly DEFAULT: {
+            readonly EVENTS: {
+                readonly ENABLED: {
+                    readonly 'color-secondary': string;
+                };
+            };
+        };
+    };
+    NUMBERFIELD: {
+        readonly DEFAULT: {
+            readonly ROOT: {
+                readonly 'border-radius': "4px";
+            };
+            readonly EVENTS: {
+                readonly ENABLED: {
+                    readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
+                    readonly 'border-color': string;
+                    readonly 'border-width': "2px";
+                    readonly 'border-style': "solid";
+                };
+                readonly VALUE: {
+                    readonly 'border-color': string;
+                };
+                readonly HOVER: {
+                    readonly 'border-color': string;
+                };
+                readonly ACTIVE: {
+                    readonly 'border-color': string;
+                };
+                readonly FOCUS: {
+                    readonly 'border-color': string;
                 };
                 readonly ERROR: {
                     readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                 };
                 readonly ERROR_VALUE: {
-                    readonly 'icon-color': string;
-                    readonly 'background-color': string;
                     readonly 'border-color': string;
                 };
                 readonly ERROR_HOVER: {
-                    readonly 'shadow-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly ERROR_ACTIVE: {
-                    readonly 'shadow-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly ERROR_FOCUS: {
-                    readonly 'outline-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly DISABLED: {
                     readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                 };
-                readonly DISABLED_VALUE: {
-                    readonly 'icon-color': string;
-                    readonly 'background-color': string;
-                };
+                readonly DISABLED_VALUE: {};
             };
         };
     };
-    BUTTON: {
+    ICONBUTTON: {
         readonly DEFAULT: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
-                    readonly 'background-color': string;
-                    readonly 'color-primary': string;
+                    readonly 'icon-color': string;
+                    readonly 'background-color': "transparent";
                     readonly 'border-style': "none";
                 };
                 readonly HOVER: {
-                    readonly 'background-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'background-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly FOCUS: {
                     readonly 'outline-color': string;
@@ -624,16 +538,43 @@ declare const _default: {
                     readonly 'outline-offset': "2px";
                 };
                 readonly DISABLED: {
-                    readonly 'background-color': string;
+                    readonly 'icon-color': string;
+                };
+            };
+        };
+    };
+    DATEPICKERMENU: {
+        readonly DEFAULT: {
+            readonly ROOT: {
+                readonly 'background-color': string;
+                readonly 'border-radius': "4px";
+            };
+            readonly EVENTS: {
+                readonly ENABLED: {
                     readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
+                    readonly 'background-color': string;
                 };
-                readonly LOADING: {
+                readonly VALUE: {
+                    readonly 'background-color': string;
+                };
+                readonly HOVER: {
+                    readonly 'background-color': string;
+                };
+                readonly ACTIVE: {
                     readonly 'background-color': string;
-                    readonly 'color-primary': string;
+                };
+                readonly FOCUS: {
+                    readonly 'outline-color': string;
+                    readonly 'outline-width': "1px";
+                    readonly 'outline-style': "solid";
+                    readonly 'outline-offset': "2px";
                 };
             };
         };
-        readonly GHOST: {
+    };
+    DATEPICKER: {
+        readonly DEFAULT: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
             };
@@ -641,46 +582,83 @@ declare const _default: {
                 readonly ENABLED: {
                     readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
                 };
+                readonly VALUE: {
+                    readonly 'border-color': string;
+                };
                 readonly HOVER: {
-                    readonly 'background-color': "rgba(255, 255, 255, 0.04)";
+                    readonly 'border-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'background-color': "rgba(255, 255, 255, 0.08)";
+                    readonly 'border-color': string;
                 };
                 readonly FOCUS: {
-                    readonly 'outline-color': string;
-                    readonly 'outline-width': "1px";
-                    readonly 'outline-style': "solid";
-                    readonly 'outline-offset': "2px";
+                    readonly 'border-color': string;
                 };
-                readonly DISABLED: {
+                readonly ERROR: {
                     readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
-                    readonly 'border-width': "1px";
-                    readonly 'border-style': "solid";
                 };
-                readonly LOADING: {
+                readonly ERROR_VALUE: {
+                    readonly 'border-color': string;
+                };
+                readonly ERROR_HOVER: {
+                    readonly 'border-color': string;
+                };
+                readonly ERROR_ACTIVE: {
+                    readonly 'border-color': string;
+                };
+                readonly ERROR_FOCUS: {
+                    readonly 'border-color': string;
+                };
+                readonly DISABLED: {
                     readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
+                    readonly 'color-tertiary': string;
+                    readonly 'border-color': string;
                 };
+                readonly DISABLED_VALUE: {};
             };
         };
     };
-    ICONBUTTON: {
+    CHIP: {
+        readonly DEFAULT: {
+            readonly EVENTS: {
+                readonly ENABLED: {
+                    readonly 'background-color': string;
+                    readonly 'color-primary': string;
+                };
+            };
+        };
+    };
+    CHECKBOX: {
         readonly DEFAULT: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
+                    readonly 'color-primary': string;
+                    readonly 'color-secondary': string;
                     readonly 'icon-color': string;
                     readonly 'background-color': "transparent";
-                    readonly 'border-style': "none";
+                    readonly 'border-color': string;
+                    readonly 'border-width': "2px";
+                    readonly 'border-style': "solid";
+                };
+                readonly VALUE: {
+                    readonly 'icon-color': string;
+                    readonly 'background-color': string;
+                    readonly 'border-color': string;
                 };
                 readonly HOVER: {
                     readonly 'shadow-color': string;
@@ -694,123 +672,166 @@ declare const _default: {
                     readonly 'outline-style': "solid";
                     readonly 'outline-offset': "2px";
                 };
+                readonly ERROR: {
+                    readonly 'background-color': "transparent";
+                    readonly 'color-secondary': string;
+                    readonly 'border-color': string;
+                };
+                readonly ERROR_VALUE: {
+                    readonly 'icon-color': string;
+                    readonly 'background-color': string;
+                    readonly 'border-color': string;
+                };
+                readonly ERROR_HOVER: {
+                    readonly 'shadow-color': string;
+                };
+                readonly ERROR_ACTIVE: {
+                    readonly 'shadow-color': string;
+                };
+                readonly ERROR_FOCUS: {
+                    readonly 'outline-color': string;
+                };
                 readonly DISABLED: {
+                    readonly 'background-color': "transparent";
+                    readonly 'color-secondary': string;
+                    readonly 'border-color': string;
+                };
+                readonly DISABLED_VALUE: {
                     readonly 'icon-color': string;
+                    readonly 'background-color': string;
                 };
             };
         };
-    };
-    NUMBERFIELD: {
-        readonly DEFAULT: {
+        readonly PRUEBA: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
-                    readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
+                    readonly 'icon-color': string;
+                    readonly 'background-color': "transparent";
                     readonly 'border-color': string;
                     readonly 'border-width': "2px";
                     readonly 'border-style': "solid";
                 };
                 readonly VALUE: {
+                    readonly 'icon-color': string;
+                    readonly 'background-color': string;
                     readonly 'border-color': string;
                 };
                 readonly HOVER: {
-                    readonly 'border-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'border-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly FOCUS: {
-                    readonly 'border-color': string;
+                    readonly 'outline-color': string;
+                    readonly 'outline-width': "1px";
+                    readonly 'outline-style': "solid";
+                    readonly 'outline-offset': "2px";
                 };
                 readonly ERROR: {
                     readonly 'background-color': "transparent";
-                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                 };
                 readonly ERROR_VALUE: {
+                    readonly 'icon-color': string;
+                    readonly 'background-color': string;
                     readonly 'border-color': string;
                 };
                 readonly ERROR_HOVER: {
-                    readonly 'border-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly ERROR_ACTIVE: {
-                    readonly 'border-color': string;
+                    readonly 'shadow-color': string;
                 };
                 readonly ERROR_FOCUS: {
-                    readonly 'border-color': string;
+                    readonly 'outline-color': string;
                 };
                 readonly DISABLED: {
                     readonly 'background-color': "transparent";
-                    readonly 'color-primary': string;
                     readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
                 };
-                readonly DISABLED_VALUE: {};
+                readonly DISABLED_VALUE: {
+                    readonly 'icon-color': string;
+                    readonly 'background-color': string;
+                };
             };
         };
     };
-    TEXTFIELD: {
+    BUTTON: {
         readonly DEFAULT: {
             readonly ROOT: {
                 readonly 'border-radius': "4px";
             };
             readonly EVENTS: {
                 readonly ENABLED: {
-                    readonly 'background-color': "transparent";
+                    readonly 'background-color': string;
                     readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
-                    readonly 'border-color': string;
-                    readonly 'border-width': "2px";
-                    readonly 'border-style': "solid";
-                };
-                readonly VALUE: {
-                    readonly 'border-color': string;
+                    readonly 'border-style': "none";
                 };
                 readonly HOVER: {
-                    readonly 'border-color': string;
+                    readonly 'background-color': string;
                 };
                 readonly ACTIVE: {
-                    readonly 'border-color': string;
+                    readonly 'background-color': string;
                 };
                 readonly FOCUS: {
-                    readonly 'border-color': string;
+                    readonly 'outline-color': string;
+                    readonly 'outline-width': "1px";
+                    readonly 'outline-style': "solid";
+                    readonly 'outline-offset': "2px";
                 };
-                readonly ERROR: {
-                    readonly 'background-color': "transparent";
+                readonly DISABLED: {
+                    readonly 'background-color': string;
                     readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
-                    readonly 'border-color': string;
                 };
-                readonly ERROR_VALUE: {
-                    readonly 'border-color': string;
+                readonly LOADING: {
+                    readonly 'background-color': string;
+                    readonly 'color-primary': string;
                 };
-                readonly ERROR_HOVER: {
+            };
+        };
+        readonly GHOST: {
+            readonly ROOT: {
+                readonly 'border-radius': "4px";
+            };
+            readonly EVENTS: {
+                readonly ENABLED: {
+                    readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
                     readonly 'border-color': string;
+                    readonly 'border-width': "2px";
+                    readonly 'border-style': "solid";
                 };
-                readonly ERROR_ACTIVE: {
-                    readonly 'border-color': string;
+                readonly HOVER: {
+                    readonly 'background-color': "rgba(255, 255, 255, 0.04)";
                 };
-                readonly ERROR_FOCUS: {
-                    readonly 'border-color': string;
+                readonly ACTIVE: {
+                    readonly 'background-color': "rgba(255, 255, 255, 0.08)";
+                };
+                readonly FOCUS: {
+                    readonly 'outline-color': string;
+                    readonly 'outline-width': "1px";
+                    readonly 'outline-style': "solid";
+                    readonly 'outline-offset': "2px";
                 };
                 readonly DISABLED: {
                     readonly 'background-color': "transparent";
                     readonly 'color-primary': string;
-                    readonly 'color-secondary': string;
-                    readonly 'color-tertiary': string;
                     readonly 'border-color': string;
+                    readonly 'border-width': "1px";
+                    readonly 'border-style': "solid";
+                };
+                readonly LOADING: {
+                    readonly 'background-color': "transparent";
+                    readonly 'color-primary': string;
                 };
-                readonly DISABLED_VALUE: {};
             };
         };
     };