UNPKG

10.9 kBTypeScriptView Raw
1/**
2 * Namespace for the decoration data and the styling refinements for the decorated widgets.
3 */
4export declare namespace WidgetDecoration {
5 /**
6 * CSS styles for the decorators.
7 */
8 namespace Styles {
9 const CAPTION_HIGHLIGHT_CLASS = "theia-caption-highlight";
10 const CAPTION_PREFIX_CLASS = "theia-caption-prefix";
11 const CAPTION_SUFFIX_CLASS = "theia-caption-suffix";
12 const ICON_WRAPPER_CLASS = "theia-icon-wrapper";
13 const DECORATOR_SIZE_CLASS = "theia-decorator-size";
14 const DECORATOR_SIDEBAR_SIZE_CLASS = "theia-decorator-sidebar-size";
15 const TOP_RIGHT_CLASS = "theia-top-right";
16 const BOTTOM_RIGHT_CLASS = "theia-bottom-right";
17 const BOTTOM_RIGHT_SIDEBAR_CLASS = "theia-bottom-right-sidebar";
18 const BOTTOM_LEFT_CLASS = "theia-bottom-left";
19 const TOP_LEFT_CLASS = "theia-top-left";
20 }
21 /**
22 * For the sake of simplicity, we have merged the `font-style`, `font-weight`, and the `text-decoration` together.
23 */
24 type FontStyle = 'normal' | 'bold' | 'italic' | 'oblique' | 'underline' | 'line-through';
25 /**
26 * A string that could be:
27 *
28 * - one of the browser colors, (E.g.: `blue`, `red`, `magenta`),
29 * - the case insensitive hexadecimal color code, (for instance, `#ee82ee`, `#20B2AA`, `#f09` ), or
30 * - either the `rgb()` or the `rgba()` functions.
31 *
32 * For more details, see: https://developer.mozilla.org/en-US/docs/Web/CSS/color_value.
33 *
34 * Note, it is highly recommended to use one of the predefined colors of Theia, so the desired color will
35 * look nice with both the `light` and the `dark` theme too.
36 */
37 type Color = string;
38 /**
39 * Encapsulates styling information of the font.
40 */
41 interface FontData {
42 /**
43 * Zero to any font style.
44 */
45 readonly style?: FontStyle | FontStyle[];
46 /**
47 * The color of the font.
48 */
49 readonly color?: Color;
50 }
51 /**
52 * Arbitrary information that has to be shown either before or after the caption as a prefix or a suffix.
53 */
54 interface CaptionAffix {
55 /**
56 * The text content of the prefix or the suffix.
57 */
58 readonly data: string;
59 /**
60 * Font data for customizing the prefix of the suffix.
61 */
62 readonly fontData?: FontData;
63 }
64 interface BaseTailDecoration {
65 /**
66 * Optional tooltip for the tail decoration.
67 */
68 readonly tooltip?: string;
69 }
70 /**
71 * Unlike caption suffixes, tail decorations appears right-aligned after the caption and the caption suffixes (is any).
72 */
73 interface TailDecoration extends BaseTailDecoration {
74 /**
75 * The text content of the tail decoration.
76 */
77 readonly data: string;
78 /**
79 * Font data for customizing the content.
80 */
81 readonly fontData?: FontData;
82 }
83 namespace TailDecoration {
84 /**
85 * Combines all fields of all `TailDecoration` variants
86 */
87 type AnyPartial = Partial<TailDecoration & TailDecorationIcon & TailDecorationIconClass>;
88 /**
89 * Represents any permissible concrete `TailDecoration` variation.
90 */
91 type AnyConcrete = TailDecoration | TailDecorationIcon | TailDecorationIconClass;
92 function isDotDecoration(decoration: AnyPartial): decoration is TailDecorationIcon;
93 }
94 interface TailDecorationIcon extends BaseTailDecoration {
95 /**
96 * This should be the name of the Font Awesome icon with out the `fa fa-` prefix, just the name, for instance `paw`.
97 * For the existing icons, see here: https://fontawesome.com/v4.7.0/icons/.
98 */
99 readonly icon: string;
100 /**
101 * The color of the icon.
102 */
103 readonly color?: Color;
104 }
105 interface TailDecorationIconClass extends BaseTailDecoration {
106 /**
107 * This should be the entire Font Awesome class array, for instance ['fa', 'fa-paw']
108 * For the existing icons, see here: https://fontawesome.com/v4.7.0/icons/.
109 */
110 readonly iconClass: string[];
111 /**
112 * The color of the icon.
113 */
114 readonly color?: Color;
115 }
116 /**
117 * Enumeration for the quadrant to overlay the image on.
118 */
119 enum IconOverlayPosition {
120 /**
121 * Overlays the top right quarter of the original image.
122 */
123 TOP_RIGHT = 0,
124 /**
125 * Overlays the bottom right of the original image.
126 */
127 BOTTOM_RIGHT = 1,
128 /**
129 * Overlays the bottom left segment of the original image.
130 */
131 BOTTOM_LEFT = 2,
132 /**
133 * Occupies the top left quarter of the original icon.
134 */
135 TOP_LEFT = 3
136 }
137 namespace IconOverlayPosition {
138 /**
139 * Returns with the CSS class style for the enum.
140 */
141 function getStyle(position: IconOverlayPosition, inSideBar?: boolean): string;
142 }
143 /**
144 * A shape that can be optionally rendered behind the overlay icon. Can be used to further refine colors.
145 */
146 interface IconOverlayBackground {
147 /**
148 * Either `circle` or `square`.
149 */
150 readonly shape: 'circle' | 'square';
151 /**
152 * The color of the background shape.
153 */
154 readonly color?: Color;
155 }
156 /**
157 * Has not effect if the widget being decorated has no associated icon.
158 */
159 interface BaseOverlay {
160 /**
161 * The position where the decoration will be placed on the top of the original icon.
162 */
163 readonly position: IconOverlayPosition;
164 /**
165 * The color of the overlaying icon. If not specified, then the default icon color will be used.
166 */
167 readonly color?: Color;
168 /**
169 * The optional background color of the overlay icon.
170 */
171 readonly background?: IconOverlayBackground;
172 }
173 interface IconOverlay extends BaseOverlay {
174 /**
175 * This should be the name of the Font Awesome icon with out the `fa fa-` prefix, just the name, for instance `paw`.
176 * For the existing icons, see here: https://fontawesome.com/v4.7.0/icons/.
177 */
178 readonly icon: string;
179 }
180 interface IconClassOverlay extends BaseOverlay {
181 /**
182 * This should be the entire Font Awesome class array, for instance ['fa', 'fa-paw']
183 * For the existing icons, see here: https://fontawesome.com/v4.7.0/icons/.
184 */
185 readonly iconClass: string[];
186 }
187 /**
188 * The caption highlighting with the highlighted ranges and an optional background color.
189 */
190 interface CaptionHighlight {
191 /**
192 * The ranges to highlight in the caption.
193 */
194 readonly ranges: CaptionHighlight.Range[];
195 /**
196 * The optional color of the text data that is being highlighted. Falls back to the default `mark` color values defined under a widget segment class.
197 */
198 readonly color?: Color;
199 /**
200 * The optional background color of the text data that is being highlighted.
201 */
202 readonly backgroundColor?: Color;
203 }
204 namespace CaptionHighlight {
205 /**
206 * A pair of offset and length that has to be highlighted as a range.
207 */
208 interface Range {
209 /**
210 * Zero based offset of the highlighted region.
211 */
212 readonly offset: number;
213 /**
214 * The length of the highlighted region.
215 */
216 readonly length: number;
217 }
218 namespace Range {
219 /**
220 * `true` if the `arg` is contained in the range. The ranges are closed ranges, hence the check is inclusive.
221 */
222 function contains(arg: number, range: Range): boolean;
223 }
224 /**
225 * The result of a caption splitting based on the highlighting information.
226 */
227 interface Fragment {
228 /**
229 * The text data of the fragment.
230 */
231 readonly data: string;
232 /**
233 * Has to be highlighted if defined.
234 */
235 readonly highlight?: true;
236 }
237 /**
238 * Splits the `caption` argument based on the ranges from the `highlight` argument.
239 */
240 function split(caption: string, highlight: CaptionHighlight): Fragment[];
241 }
242 /**
243 * Encapsulates styling information that has to be applied on the widget which we decorate.
244 */
245 interface Data {
246 /**
247 * The higher number has higher priority. If not specified, treated as `0`.
248 * When multiple decorators are available for the same item, and decoration data cannot be merged together,
249 * then the higher priority item will be applied on the decorated element and the lower priority will be ignored.
250 */
251 readonly priority?: number;
252 /**
253 * The font data for the caption.
254 */
255 readonly fontData?: FontData;
256 /**
257 * The background color of the entire row.
258 */
259 readonly backgroundColor?: Color;
260 /**
261 * Optional, leading prefixes right before the caption.
262 */
263 readonly captionPrefixes?: CaptionAffix[];
264 /**
265 * Suffixes that might come after the caption as an additional information.
266 */
267 readonly captionSuffixes?: CaptionAffix[];
268 /**
269 * Optional right-aligned decorations that appear after the widget caption and after the caption suffixes (is any).
270 */
271 readonly tailDecorations?: Array<TailDecoration | TailDecorationIcon | TailDecorationIconClass>;
272 /**
273 * Custom tooltip for the decorated item. Tooltip will be appended to the original tooltip, if any.
274 */
275 readonly tooltip?: string;
276 /**
277 * Sets the color of the icon. Ignored if the decorated item has no icon.
278 */
279 readonly iconColor?: Color;
280 /**
281 * Has not effect if given, but the widget does not have an associated image.
282 */
283 readonly iconOverlay?: IconOverlay | IconClassOverlay;
284 /**
285 * An array of ranges to highlight the caption.
286 */
287 readonly highlight?: CaptionHighlight;
288 /**
289 * A count badge for widgets.
290 */
291 readonly badge?: number;
292 }
293 namespace Data {
294 /**
295 * Compares the decoration data based on the priority. Lowest priorities come first (i.e. left.priority - right.priority).
296 */
297 const comparePriority: (left: Data, right: Data) => number;
298 }
299}
300//# sourceMappingURL=widget-decoration.d.ts.map
\No newline at end of file