@lawkit/ui 0.1.0

package/dist/tokens/src/semantic/color-roles.d.ts

@@ -0,0 +1,409 @@
+export declare const semanticColorRoles: {
+    readonly surface: {
+        readonly page: string;
+        readonly canvas: string;
+        readonly subtle: string;
+        readonly raised: string;
+        readonly disabled: string;
+        readonly tableHeader: "#f1f4f9";
+        readonly backdrop: "rgba(0, 0, 0, 0.2)";
+    };
+    readonly text: {
+        readonly primary: string;
+        readonly heading: string;
+        readonly secondary: string;
+        readonly tertiary: string;
+        readonly disabled: string;
+        readonly inverse: string;
+        readonly placeholder: string;
+    };
+    readonly border: {
+        readonly subtle: string;
+        readonly default: string;
+        readonly strong: string;
+        readonly focus: string;
+        readonly input: "#9ea7b8";
+        readonly primary: string;
+        readonly secondary: string;
+        readonly success: "#28c76f";
+        readonly danger: string;
+        readonly warning: string;
+        readonly info: string;
+        readonly dark: "#4b4b4b";
+    };
+    readonly action: {
+        readonly primary: {
+            readonly default: string;
+            readonly hover: string;
+            readonly active: string;
+            readonly subtle: "rgba(33, 81, 236, 0.12)";
+            readonly subtleActive: "rgba(23, 57, 165, 0.12)";
+        };
+        readonly secondary: {
+            readonly default: string;
+            readonly hover: string;
+            readonly active: string;
+            readonly subtle: "rgba(130, 134, 139, 0.12)";
+        };
+    };
+    readonly status: {
+        readonly success: {
+            readonly text: "#006d38";
+            readonly fill: "rgba(39, 194, 129, 0.12)";
+            readonly border: "#28c76f";
+        };
+        readonly danger: {
+            readonly text: "#b12a30";
+            readonly fill: "rgba(234, 59, 59, 0.12)";
+            readonly border: string;
+        };
+        readonly warning: {
+            readonly text: "#7d5800";
+            readonly fill: "rgba(240, 175, 35, 0.12)";
+            readonly border: string;
+        };
+        readonly info: {
+            readonly text: "#006876";
+            readonly fill: "rgba(0, 207, 232, 0.12)";
+            readonly border: string;
+        };
+        readonly dark: {
+            readonly text: "#343434";
+            readonly fill: "rgba(76, 84, 105, 0.12)";
+            readonly border: string;
+        };
+        readonly scourt: {
+            readonly blue: {
+                readonly text: "#003399";
+                readonly fill: "rgba(0, 51, 153, 0.12)";
+            };
+            readonly green: {
+                readonly text: "#336633";
+                readonly fill: "rgba(51, 102, 51, 0.12)";
+            };
+            readonly red: {
+                readonly text: "#660000";
+                readonly fill: "rgba(102, 0, 0, 0.12)";
+            };
+            readonly yellow: {
+                readonly text: "#cc6600";
+                readonly fill: "rgba(204, 102, 0, 0.12)";
+            };
+            readonly stamp: {
+                readonly text: "#ff0000";
+                readonly fill: "rgba(234, 59, 59, 0.12)";
+            };
+        };
+    };
+    readonly button: {
+        readonly solid: {
+            readonly primary: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly secondary: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly success: {
+                readonly background: "#28c76f";
+                readonly hover: "#28c76f";
+                readonly active: "#006d38";
+                readonly text: string;
+            };
+            readonly danger: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly warning: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly info: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly dark: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly neutral: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly disabled: {
+                readonly background: string;
+                readonly text: string;
+            };
+        };
+        readonly outline: {
+            readonly primary: {
+                readonly border: string;
+                readonly text: string;
+                readonly hover: "rgba(33, 81, 236, 0.12)";
+                readonly active: "rgba(23, 57, 165, 0.12)";
+            };
+            readonly secondary: {
+                readonly border: string;
+                readonly text: string;
+                readonly hover: "rgba(130, 134, 139, 0.12)";
+                readonly active: "rgba(130, 134, 139, 0.12)";
+            };
+            readonly success: {
+                readonly border: "#28c76f";
+                readonly text: "#006d38";
+                readonly hover: "rgba(39, 194, 129, 0.12)";
+                readonly active: "rgba(39, 194, 129, 0.12)";
+            };
+            readonly danger: {
+                readonly border: string;
+                readonly text: "#b12a30";
+                readonly hover: "rgba(234, 59, 59, 0.12)";
+                readonly active: "rgba(234, 59, 59, 0.12)";
+            };
+            readonly warning: {
+                readonly border: string;
+                readonly text: "#7d5800";
+                readonly hover: "rgba(240, 175, 35, 0.12)";
+                readonly active: "rgba(240, 175, 35, 0.12)";
+            };
+            readonly info: {
+                readonly border: string;
+                readonly text: "#006876";
+                readonly hover: "rgba(0, 207, 232, 0.12)";
+                readonly active: "rgba(0, 207, 232, 0.12)";
+            };
+            readonly dark: {
+                readonly border: string;
+                readonly text: "#343434";
+                readonly hover: "rgba(76, 84, 105, 0.12)";
+                readonly active: "rgba(76, 84, 105, 0.12)";
+            };
+            readonly neutral: {
+                readonly border: string;
+                readonly text: string;
+                readonly hover: string;
+                readonly active: string;
+            };
+            readonly disabled: {
+                readonly border: string;
+                readonly text: string;
+                readonly hover: string;
+                readonly active: string;
+            };
+        };
+        readonly gradient: {
+            readonly primary: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(33, 81, 236, 0.18)";
+                readonly disabledTo: "rgba(33, 81, 236, 0.18)";
+                readonly text: string;
+            };
+            readonly secondary: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(130, 134, 139, 0.18)";
+                readonly disabledTo: "rgba(130, 134, 139, 0.18)";
+                readonly text: string;
+            };
+            readonly success: {
+                readonly from: "#28c76f";
+                readonly to: "#28c76f";
+                readonly hoverFrom: "#28c76f";
+                readonly hoverTo: "#28c76f";
+                readonly activeFrom: "#006d38";
+                readonly activeTo: "#006d38";
+                readonly disabledFrom: "rgba(40, 199, 111, 0.18)";
+                readonly disabledTo: "rgba(40, 199, 111, 0.18)";
+                readonly text: string;
+            };
+            readonly danger: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(234, 84, 85, 0.18)";
+                readonly disabledTo: "rgba(234, 84, 85, 0.18)";
+                readonly text: string;
+            };
+            readonly warning: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(240, 175, 35, 0.18)";
+                readonly disabledTo: "rgba(240, 175, 35, 0.18)";
+                readonly text: string;
+            };
+            readonly info: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(0, 207, 232, 0.18)";
+                readonly disabledTo: "rgba(0, 207, 232, 0.18)";
+                readonly text: string;
+            };
+            readonly dark: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(75, 75, 75, 0.18)";
+                readonly disabledTo: "rgba(75, 75, 75, 0.18)";
+                readonly text: string;
+            };
+            readonly neutral: {
+                readonly from: string;
+                readonly to: string;
+                readonly hoverFrom: string;
+                readonly hoverTo: string;
+                readonly activeFrom: string;
+                readonly activeTo: string;
+                readonly disabledFrom: "rgba(130, 134, 139, 0.18)";
+                readonly disabledTo: "rgba(130, 134, 139, 0.18)";
+                readonly text: string;
+            };
+        };
+    };
+    readonly field: {
+        readonly label: string;
+        readonly text: string;
+        readonly placeholder: string;
+        readonly helper: string;
+        readonly background: string;
+        readonly backgroundDisabled: string;
+        readonly border: "#9ea7b8";
+        readonly borderHover: string;
+        readonly borderFocus: string;
+        readonly icon: string;
+    };
+    readonly table: {
+        readonly headerBackground: "#f1f4f9";
+        readonly bodyBackground: "#f2f4f6";
+        readonly border: string;
+        readonly text: string;
+    };
+    readonly badge: {
+        readonly filled: {
+            readonly primary: {
+                readonly background: string;
+                readonly text: string;
+            };
+            readonly neutral: {
+                readonly background: string;
+                readonly text: string;
+            };
+        };
+        readonly outline: {
+            readonly primary: {
+                readonly background: string;
+                readonly border: string;
+                readonly text: string;
+            };
+            readonly neutral: {
+                readonly background: string;
+                readonly border: string;
+                readonly text: string;
+            };
+        };
+        readonly muted: {
+            readonly primary: {
+                readonly background: "rgba(33, 81, 236, 0.12)";
+                readonly border: string;
+                readonly text: string;
+            };
+            readonly neutral: {
+                readonly background: "rgba(158, 167, 184, 0.12)";
+                readonly border: string;
+                readonly text: string;
+            };
+        };
+    };
+    readonly chip: {
+        readonly background: string;
+        readonly border: string;
+        readonly text: string;
+        readonly selected: {
+            readonly basic: {
+                readonly background: "rgba(33, 81, 236, 0.12)";
+                readonly border: string;
+                readonly text: string;
+            };
+            readonly check: {
+                readonly background: "rgba(33, 81, 236, 0.12)";
+                readonly border: string;
+                readonly text: string;
+            };
+            readonly file: {
+                readonly background: "rgba(39, 194, 129, 0.12)";
+                readonly border: "#28c76f";
+                readonly text: "#006d38";
+            };
+            readonly link: {
+                readonly background: string;
+                readonly border: string;
+                readonly text: string;
+            };
+        };
+    };
+    readonly alert: {
+        readonly info: {
+            readonly background: "rgba(0, 207, 232, 0.12)";
+            readonly border: string;
+            readonly text: string;
+            readonly icon: "#006876";
+        };
+        readonly neutral: {
+            readonly background: string;
+            readonly border: string;
+            readonly text: string;
+            readonly icon: string;
+        };
+        readonly action: {
+            readonly primary: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+            readonly warning: {
+                readonly background: string;
+                readonly hover: string;
+                readonly active: string;
+                readonly text: string;
+            };
+        };
+    };
+};