1import { fontFamilies, fontSizes, FontWeight } from "../common";
2import { Layer, Styles, StyleSets, Style } from "../themes/common/colorScheme";
3
4function isStyleSet(key: any): key is StyleSets {
5 return ["base", "variant", "on", "info", "positive", "warning", "negative"].includes(key);
6}
7function isStyle(key: any): key is Styles {
8 return ["default", "active", "disabled", "hovered", "pressed"].includes(key);
9}
10function getStyle(layer: Layer, possibleStyleSetOrStyle?: any, possibleStyle?: any): Style {
11 let styleSet: StyleSets = "base";
12 let style: Styles = "default";
13 if (isStyleSet(possibleStyleSetOrStyle)) {
14 styleSet = possibleStyleSetOrStyle;
15 } else if (isStyle(possibleStyleSetOrStyle)) {
16 style = possibleStyleSetOrStyle;
17 }
18
19 if (isStyle(possibleStyle)) {
20 style = possibleStyle;
21 }
22
23 return layer[styleSet][style];
24}
25
26export function background(layer: Layer, style?: Styles): string;
27export function background(layer: Layer, styleSet?: StyleSets, style?: Styles): string;
28export function background(layer: Layer, styleSetOrStyles?: StyleSets | Styles, style?: Styles): string {
29 return getStyle(layer, styleSetOrStyles, style).background;
30}
31
32export function borderColor(layer: Layer, style?: Styles): string;
33export function borderColor(layer: Layer, styleSet?: StyleSets, style?: Styles): string;
34export function borderColor(layer: Layer, styleSetOrStyles?: StyleSets | Styles, style?: Styles): string {
35 return getStyle(layer, styleSetOrStyles, style).border;
36}
37
38export function foreground(layer: Layer, style?: Styles): string;
39export function foreground(layer: Layer, styleSet?: StyleSets, style?: Styles): string;
40export function foreground(layer: Layer, styleSetOrStyles?: StyleSets | Styles, style?: Styles): string {
41 return getStyle(layer, styleSetOrStyles, style).foreground;
42}
43
44interface Text {
45 family: keyof typeof fontFamilies,
46 color: string,
47 size: number,
48 weight?: FontWeight,
49 underline?: boolean,
50}
51
52interface TextProperties {
53 size?: keyof typeof fontSizes;
54 weight?: FontWeight;
55 underline?: boolean;
56}
57
58export function text(
59 layer: Layer,
60 fontFamily: keyof typeof fontFamilies,
61 styleSet: StyleSets,
62 style: Styles,
63 properties?: TextProperties
64): Text;
65export function text(
66 layer: Layer,
67 fontFamily: keyof typeof fontFamilies,
68 styleSet: StyleSets,
69 properties?: TextProperties): Text;
70export function text(
71 layer: Layer,
72 fontFamily: keyof typeof fontFamilies,
73 style: Styles,
74 properties?: TextProperties): Text;
75export function text(
76 layer: Layer,
77 fontFamily: keyof typeof fontFamilies,
78 properties?: TextProperties): Text;
79export function text(
80 layer: Layer,
81 fontFamily: keyof typeof fontFamilies,
82 styleSetStyleOrProperties?: StyleSets | Styles | TextProperties,
83 styleOrProperties?: Styles | TextProperties,
84 properties?: TextProperties
85) {
86 let style = getStyle(layer, styleSetStyleOrProperties, styleOrProperties);
87 let size = fontSizes[properties?.size || "sm"];
88
89 if (typeof styleSetStyleOrProperties === "object") {
90 properties = styleSetStyleOrProperties;
91 }
92 if (typeof styleOrProperties === "object") {
93 properties = styleOrProperties;
94 }
95
96 return {
97 family: fontFamilies[fontFamily],
98 color: style.foreground,
99 ...properties,
100 size,
101 };
102}
103
104
105export interface Border {
106 color: string,
107 width: number,
108 top?: boolean;
109 bottom?: boolean;
110 left?: boolean;
111 right?: boolean;
112 overlay?: boolean;
113}
114
115export interface BorderProperties {
116 width?: number;
117 top?: boolean;
118 bottom?: boolean;
119 left?: boolean;
120 right?: boolean;
121 overlay?: boolean;
122}
123
124export function border(
125 layer: Layer,
126 styleSet: StyleSets,
127 style: Styles,
128 properties?: BorderProperties
129): Border;
130export function border(
131 layer: Layer,
132 styleSet: StyleSets,
133 properties?: BorderProperties
134): Border;
135export function border(
136 layer: Layer,
137 style: Styles,
138 properties?: BorderProperties
139): Border;
140export function border(
141 layer: Layer,
142 properties?: BorderProperties
143): Border;
144export function border(
145 layer: Layer,
146 styleSetStyleOrProperties?: StyleSets | Styles | BorderProperties,
147 styleOrProperties?: Styles | BorderProperties,
148 properties?: BorderProperties
149): Border {
150 let style = getStyle(layer, styleSetStyleOrProperties, styleOrProperties);
151
152 if (typeof styleSetStyleOrProperties === "object") {
153 properties = styleSetStyleOrProperties;
154 }
155 if (typeof styleOrProperties === "object") {
156 properties = styleOrProperties;
157 }
158
159 return {
160 color: style.border,
161 width: 1,
162 ...properties,
163 };
164}