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 [
6 "base",
7 "variant",
8 "on",
9 "accent",
10 "positive",
11 "warning",
12 "negative",
13 ].includes(key);
14}
15
16function isStyle(key: any): key is Styles {
17 return [
18 "default",
19 "active",
20 "disabled",
21 "hovered",
22 "pressed",
23 "inverted",
24 ].includes(key);
25}
26function getStyle(
27 layer: Layer,
28 possibleStyleSetOrStyle?: any,
29 possibleStyle?: any
30): Style {
31 let styleSet: StyleSets = "base";
32 let style: Styles = "default";
33 if (isStyleSet(possibleStyleSetOrStyle)) {
34 styleSet = possibleStyleSetOrStyle;
35 } else if (isStyle(possibleStyleSetOrStyle)) {
36 style = possibleStyleSetOrStyle;
37 }
38
39 if (isStyle(possibleStyle)) {
40 style = possibleStyle;
41 }
42
43 return layer[styleSet][style];
44}
45
46export function background(layer: Layer, style?: Styles): string;
47export function background(
48 layer: Layer,
49 styleSet?: StyleSets,
50 style?: Styles
51): string;
52export function background(
53 layer: Layer,
54 styleSetOrStyles?: StyleSets | Styles,
55 style?: Styles
56): string {
57 return getStyle(layer, styleSetOrStyles, style).background;
58}
59
60export function borderColor(layer: Layer, style?: Styles): string;
61export function borderColor(
62 layer: Layer,
63 styleSet?: StyleSets,
64 style?: Styles
65): string;
66export function borderColor(
67 layer: Layer,
68 styleSetOrStyles?: StyleSets | Styles,
69 style?: Styles
70): string {
71 return getStyle(layer, styleSetOrStyles, style).border;
72}
73
74export function foreground(layer: Layer, style?: Styles): string;
75export function foreground(
76 layer: Layer,
77 styleSet?: StyleSets,
78 style?: Styles
79): string;
80export function foreground(
81 layer: Layer,
82 styleSetOrStyles?: StyleSets | Styles,
83 style?: Styles
84): string {
85 return getStyle(layer, styleSetOrStyles, style).foreground;
86}
87
88interface Text {
89 family: keyof typeof fontFamilies;
90 color: string;
91 size: number;
92 weight?: FontWeight;
93 underline?: boolean;
94}
95
96interface TextProperties {
97 size?: keyof typeof fontSizes;
98 weight?: FontWeight;
99 underline?: boolean;
100 color?: string;
101}
102
103export function text(
104 layer: Layer,
105 fontFamily: keyof typeof fontFamilies,
106 styleSet: StyleSets,
107 style: Styles,
108 properties?: TextProperties
109): Text;
110export function text(
111 layer: Layer,
112 fontFamily: keyof typeof fontFamilies,
113 styleSet: StyleSets,
114 properties?: TextProperties
115): Text;
116export function text(
117 layer: Layer,
118 fontFamily: keyof typeof fontFamilies,
119 style: Styles,
120 properties?: TextProperties
121): Text;
122export function text(
123 layer: Layer,
124 fontFamily: keyof typeof fontFamilies,
125 properties?: TextProperties
126): Text;
127export function text(
128 layer: Layer,
129 fontFamily: keyof typeof fontFamilies,
130 styleSetStyleOrProperties?: StyleSets | Styles | TextProperties,
131 styleOrProperties?: Styles | TextProperties,
132 properties?: TextProperties
133) {
134 let style = getStyle(layer, styleSetStyleOrProperties, styleOrProperties);
135
136 if (typeof styleSetStyleOrProperties === "object") {
137 properties = styleSetStyleOrProperties;
138 }
139 if (typeof styleOrProperties === "object") {
140 properties = styleOrProperties;
141 }
142
143 let size = fontSizes[properties?.size || "sm"];
144 let color = properties?.color || style.foreground;
145
146 return {
147 family: fontFamilies[fontFamily],
148 ...properties,
149 color,
150 size,
151 };
152}
153
154export interface Border {
155 color: string;
156 width: number;
157 top?: boolean;
158 bottom?: boolean;
159 left?: boolean;
160 right?: boolean;
161 overlay?: boolean;
162}
163
164export interface BorderProperties {
165 width?: number;
166 top?: boolean;
167 bottom?: boolean;
168 left?: boolean;
169 right?: boolean;
170 overlay?: boolean;
171}
172
173export function border(
174 layer: Layer,
175 styleSet: StyleSets,
176 style: Styles,
177 properties?: BorderProperties
178): Border;
179export function border(
180 layer: Layer,
181 styleSet: StyleSets,
182 properties?: BorderProperties
183): Border;
184export function border(
185 layer: Layer,
186 style: Styles,
187 properties?: BorderProperties
188): Border;
189export function border(layer: Layer, properties?: BorderProperties): Border;
190export function border(
191 layer: Layer,
192 styleSetStyleOrProperties?: StyleSets | Styles | BorderProperties,
193 styleOrProperties?: Styles | BorderProperties,
194 properties?: BorderProperties
195): Border {
196 let style = getStyle(layer, styleSetStyleOrProperties, styleOrProperties);
197
198 if (typeof styleSetStyleOrProperties === "object") {
199 properties = styleSetStyleOrProperties;
200 }
201 if (typeof styleOrProperties === "object") {
202 properties = styleOrProperties;
203 }
204
205 return {
206 color: style.border,
207 width: 1,
208 ...properties,
209 };
210}