theme.rs

  1mod theme_registry;
  2
  3use gpui::{
  4    color::Color,
  5    elements::{ContainerStyle, ImageStyle, LabelStyle, TooltipStyle},
  6    fonts::{HighlightStyle, TextStyle},
  7    Border, MouseState,
  8};
  9use serde::{de::DeserializeOwned, Deserialize};
 10use serde_json::Value;
 11use std::{collections::HashMap, sync::Arc};
 12
 13pub use theme_registry::*;
 14
 15#[derive(Deserialize, Default)]
 16pub struct Theme {
 17    #[serde(default)]
 18    pub meta: ThemeMeta,
 19    pub workspace: Workspace,
 20    pub context_menu: ContextMenu,
 21    pub chat_panel: ChatPanel,
 22    pub contacts_popover: ContactsPopover,
 23    pub contacts_panel: ContactsPanel,
 24    pub contact_finder: ContactFinder,
 25    pub project_panel: ProjectPanel,
 26    pub command_palette: CommandPalette,
 27    pub picker: Picker,
 28    pub editor: Editor,
 29    pub search: Search,
 30    pub project_diagnostics: ProjectDiagnostics,
 31    pub breadcrumbs: ContainedText,
 32    pub contact_notification: ContactNotification,
 33    pub update_notification: UpdateNotification,
 34    pub tooltip: TooltipStyle,
 35    pub terminal: TerminalStyle,
 36}
 37
 38#[derive(Deserialize, Default, Clone)]
 39pub struct ThemeMeta {
 40    pub name: String,
 41    pub is_light: bool,
 42}
 43
 44#[derive(Deserialize, Default)]
 45pub struct Workspace {
 46    pub background: Color,
 47    pub titlebar: Titlebar,
 48    pub tab_bar: TabBar,
 49    pub pane_divider: Border,
 50    pub leader_border_opacity: f32,
 51    pub leader_border_width: f32,
 52    pub sidebar: Sidebar,
 53    pub status_bar: StatusBar,
 54    pub toolbar: Toolbar,
 55    pub disconnected_overlay: ContainedText,
 56    pub modal: ContainerStyle,
 57    pub notification: ContainerStyle,
 58    pub notifications: Notifications,
 59    pub joining_project_avatar: ImageStyle,
 60    pub joining_project_message: ContainedText,
 61    pub dock: Dock,
 62}
 63
 64#[derive(Clone, Deserialize, Default)]
 65pub struct Titlebar {
 66    #[serde(flatten)]
 67    pub container: ContainerStyle,
 68    pub height: f32,
 69    pub title: TextStyle,
 70    pub avatar_width: f32,
 71    pub avatar_margin: f32,
 72    pub avatar_ribbon: AvatarRibbon,
 73    pub offline_icon: OfflineIcon,
 74    pub avatar: ImageStyle,
 75    pub sign_in_prompt: Interactive<ContainedText>,
 76    pub outdated_warning: ContainedText,
 77    pub add_participant_button: Interactive<IconButton>,
 78    pub add_participant_popover: AddParticipantPopover,
 79}
 80
 81#[derive(Clone, Deserialize, Default)]
 82pub struct AddParticipantPopover {
 83    #[serde(flatten)]
 84    pub container: ContainerStyle,
 85    pub height: f32,
 86    pub width: f32,
 87}
 88
 89#[derive(Clone, Deserialize, Default)]
 90pub struct TabBar {
 91    #[serde(flatten)]
 92    pub container: ContainerStyle,
 93    pub pane_button: Interactive<IconButton>,
 94    pub pane_button_container: ContainerStyle,
 95    pub active_pane: TabStyles,
 96    pub inactive_pane: TabStyles,
 97    pub dragged_tab: Tab,
 98    pub height: f32,
 99    pub drop_target_overlay_color: Color,
100}
101
102impl TabBar {
103    pub fn tab_style(&self, pane_active: bool, tab_active: bool) -> &Tab {
104        let tabs = if pane_active {
105            &self.active_pane
106        } else {
107            &self.inactive_pane
108        };
109
110        if tab_active {
111            &tabs.active_tab
112        } else {
113            &tabs.inactive_tab
114        }
115    }
116}
117
118#[derive(Clone, Deserialize, Default)]
119pub struct TabStyles {
120    pub active_tab: Tab,
121    pub inactive_tab: Tab,
122}
123
124#[derive(Clone, Deserialize, Default)]
125pub struct AvatarRibbon {
126    #[serde(flatten)]
127    pub container: ContainerStyle,
128    pub width: f32,
129    pub height: f32,
130}
131
132#[derive(Clone, Deserialize, Default)]
133pub struct OfflineIcon {
134    #[serde(flatten)]
135    pub container: ContainerStyle,
136    pub width: f32,
137    pub color: Color,
138}
139
140#[derive(Clone, Deserialize, Default)]
141pub struct Tab {
142    pub height: f32,
143    #[serde(flatten)]
144    pub container: ContainerStyle,
145    #[serde(flatten)]
146    pub label: LabelStyle,
147    pub description: ContainedText,
148    pub spacing: f32,
149    pub icon_width: f32,
150    pub icon_close: Color,
151    pub icon_close_active: Color,
152    pub icon_dirty: Color,
153    pub icon_conflict: Color,
154}
155
156#[derive(Clone, Deserialize, Default)]
157pub struct Toolbar {
158    #[serde(flatten)]
159    pub container: ContainerStyle,
160    pub height: f32,
161    pub item_spacing: f32,
162    pub nav_button: Interactive<IconButton>,
163}
164
165#[derive(Clone, Deserialize, Default)]
166pub struct Dock {
167    pub initial_size_right: f32,
168    pub initial_size_bottom: f32,
169    pub wash_color: Color,
170    pub panel: ContainerStyle,
171    pub maximized: ContainerStyle,
172}
173
174#[derive(Clone, Deserialize, Default)]
175pub struct Notifications {
176    #[serde(flatten)]
177    pub container: ContainerStyle,
178    pub width: f32,
179}
180
181#[derive(Clone, Deserialize, Default)]
182pub struct Search {
183    #[serde(flatten)]
184    pub container: ContainerStyle,
185    pub editor: FindEditor,
186    pub invalid_editor: ContainerStyle,
187    pub option_button_group: ContainerStyle,
188    pub option_button: Interactive<ContainedText>,
189    pub match_background: Color,
190    pub match_index: ContainedText,
191    pub results_status: TextStyle,
192    pub tab_icon_width: f32,
193    pub tab_icon_spacing: f32,
194}
195
196#[derive(Clone, Deserialize, Default)]
197pub struct FindEditor {
198    #[serde(flatten)]
199    pub input: FieldEditor,
200    pub min_width: f32,
201    pub max_width: f32,
202}
203
204#[derive(Deserialize, Default)]
205pub struct StatusBar {
206    #[serde(flatten)]
207    pub container: ContainerStyle,
208    pub height: f32,
209    pub item_spacing: f32,
210    pub cursor_position: TextStyle,
211    pub auto_update_progress_message: TextStyle,
212    pub auto_update_done_message: TextStyle,
213    pub lsp_status: Interactive<StatusBarLspStatus>,
214    pub feedback: Interactive<TextStyle>,
215    pub sidebar_buttons: StatusBarSidebarButtons,
216    pub diagnostic_summary: Interactive<StatusBarDiagnosticSummary>,
217    pub diagnostic_message: Interactive<ContainedText>,
218}
219
220#[derive(Deserialize, Default)]
221pub struct StatusBarSidebarButtons {
222    pub group_left: ContainerStyle,
223    pub group_right: ContainerStyle,
224    pub item: Interactive<SidebarItem>,
225    pub badge: ContainerStyle,
226}
227
228#[derive(Deserialize, Default)]
229pub struct StatusBarDiagnosticSummary {
230    pub container_ok: ContainerStyle,
231    pub container_warning: ContainerStyle,
232    pub container_error: ContainerStyle,
233    pub text: TextStyle,
234    pub icon_color_ok: Color,
235    pub icon_color_warning: Color,
236    pub icon_color_error: Color,
237    pub height: f32,
238    pub icon_width: f32,
239    pub icon_spacing: f32,
240    pub summary_spacing: f32,
241}
242
243#[derive(Deserialize, Default)]
244pub struct StatusBarLspStatus {
245    #[serde(flatten)]
246    pub container: ContainerStyle,
247    pub height: f32,
248    pub icon_spacing: f32,
249    pub icon_color: Color,
250    pub icon_width: f32,
251    pub message: TextStyle,
252}
253
254#[derive(Deserialize, Default)]
255pub struct Sidebar {
256    pub initial_size: f32,
257    #[serde(flatten)]
258    pub container: ContainerStyle,
259}
260
261#[derive(Clone, Copy, Deserialize, Default)]
262pub struct SidebarItem {
263    #[serde(flatten)]
264    pub container: ContainerStyle,
265    pub icon_color: Color,
266    pub icon_size: f32,
267}
268
269#[derive(Deserialize, Default)]
270pub struct ChatPanel {
271    #[serde(flatten)]
272    pub container: ContainerStyle,
273    pub message: ChatMessage,
274    pub pending_message: ChatMessage,
275    pub channel_select: ChannelSelect,
276    pub input_editor: FieldEditor,
277    pub sign_in_prompt: TextStyle,
278    pub hovered_sign_in_prompt: TextStyle,
279}
280
281#[derive(Deserialize, Default)]
282pub struct ProjectPanel {
283    #[serde(flatten)]
284    pub container: ContainerStyle,
285    pub entry: Interactive<ProjectPanelEntry>,
286    pub cut_entry_fade: f32,
287    pub ignored_entry_fade: f32,
288    pub filename_editor: FieldEditor,
289    pub indent_width: f32,
290}
291
292#[derive(Clone, Debug, Deserialize, Default)]
293pub struct ProjectPanelEntry {
294    pub height: f32,
295    #[serde(flatten)]
296    pub container: ContainerStyle,
297    pub text: TextStyle,
298    pub icon_color: Color,
299    pub icon_size: f32,
300    pub icon_spacing: f32,
301}
302
303#[derive(Clone, Debug, Deserialize, Default)]
304pub struct ContextMenu {
305    #[serde(flatten)]
306    pub container: ContainerStyle,
307    pub item: Interactive<ContextMenuItem>,
308    pub keystroke_margin: f32,
309    pub separator: ContainerStyle,
310}
311
312#[derive(Clone, Debug, Deserialize, Default)]
313pub struct ContextMenuItem {
314    #[serde(flatten)]
315    pub container: ContainerStyle,
316    pub label: TextStyle,
317    pub keystroke: ContainedText,
318    pub icon_width: f32,
319    pub icon_spacing: f32,
320}
321
322#[derive(Debug, Deserialize, Default)]
323pub struct CommandPalette {
324    pub key: Interactive<ContainedLabel>,
325    pub keystroke_spacing: f32,
326}
327
328#[derive(Deserialize, Default)]
329pub struct ContactsPopover {
330    pub background: Color,
331}
332
333#[derive(Deserialize, Default)]
334pub struct ContactsPanel {
335    #[serde(flatten)]
336    pub container: ContainerStyle,
337    pub user_query_editor: FieldEditor,
338    pub user_query_editor_height: f32,
339    pub add_contact_button: IconButton,
340    pub header_row: Interactive<ContainedText>,
341    pub contact_row: Interactive<ContainerStyle>,
342    pub project_row: Interactive<ProjectRow>,
343    pub row_height: f32,
344    pub contact_avatar: ImageStyle,
345    pub contact_username: ContainedText,
346    pub contact_button: Interactive<IconButton>,
347    pub contact_button_spacing: f32,
348    pub disabled_button: IconButton,
349    pub tree_branch: Interactive<TreeBranch>,
350    pub private_button: Interactive<IconButton>,
351    pub section_icon_size: f32,
352    pub invite_row: Interactive<ContainedLabel>,
353}
354
355#[derive(Deserialize, Default)]
356pub struct InviteLink {
357    #[serde(flatten)]
358    pub container: ContainerStyle,
359    #[serde(flatten)]
360    pub label: LabelStyle,
361    pub icon: Icon,
362}
363
364#[derive(Deserialize, Default, Clone, Copy)]
365pub struct TreeBranch {
366    pub width: f32,
367    pub color: Color,
368}
369
370#[derive(Deserialize, Default)]
371pub struct ContactFinder {
372    pub row_height: f32,
373    pub contact_avatar: ImageStyle,
374    pub contact_username: ContainerStyle,
375    pub contact_button: IconButton,
376    pub disabled_contact_button: IconButton,
377}
378
379#[derive(Deserialize, Default)]
380pub struct Icon {
381    #[serde(flatten)]
382    pub container: ContainerStyle,
383    pub color: Color,
384    pub width: f32,
385    pub path: String,
386}
387
388#[derive(Deserialize, Clone, Copy, Default)]
389pub struct IconButton {
390    #[serde(flatten)]
391    pub container: ContainerStyle,
392    pub color: Color,
393    pub icon_width: f32,
394    pub button_width: f32,
395}
396
397#[derive(Deserialize, Default)]
398pub struct ProjectRow {
399    #[serde(flatten)]
400    pub container: ContainerStyle,
401    pub name: ContainedText,
402    pub guests: ContainerStyle,
403    pub guest_avatar: ImageStyle,
404    pub guest_avatar_spacing: f32,
405}
406
407#[derive(Deserialize, Default)]
408pub struct ChatMessage {
409    #[serde(flatten)]
410    pub container: ContainerStyle,
411    pub body: TextStyle,
412    pub sender: ContainedText,
413    pub timestamp: ContainedText,
414}
415
416#[derive(Deserialize, Default)]
417pub struct ChannelSelect {
418    #[serde(flatten)]
419    pub container: ContainerStyle,
420    pub header: ChannelName,
421    pub item: ChannelName,
422    pub active_item: ChannelName,
423    pub hovered_item: ChannelName,
424    pub hovered_active_item: ChannelName,
425    pub menu: ContainerStyle,
426}
427
428#[derive(Deserialize, Default)]
429pub struct ChannelName {
430    #[serde(flatten)]
431    pub container: ContainerStyle,
432    pub hash: ContainedText,
433    pub name: TextStyle,
434}
435
436#[derive(Deserialize, Default)]
437pub struct Picker {
438    #[serde(flatten)]
439    pub container: ContainerStyle,
440    pub empty: ContainedLabel,
441    pub input_editor: FieldEditor,
442    pub item: Interactive<ContainedLabel>,
443}
444
445#[derive(Clone, Debug, Deserialize, Default)]
446pub struct ContainedText {
447    #[serde(flatten)]
448    pub container: ContainerStyle,
449    #[serde(flatten)]
450    pub text: TextStyle,
451}
452
453#[derive(Clone, Debug, Deserialize, Default)]
454pub struct ContainedLabel {
455    #[serde(flatten)]
456    pub container: ContainerStyle,
457    #[serde(flatten)]
458    pub label: LabelStyle,
459}
460
461#[derive(Clone, Deserialize, Default)]
462pub struct ProjectDiagnostics {
463    #[serde(flatten)]
464    pub container: ContainerStyle,
465    pub empty_message: TextStyle,
466    pub tab_icon_width: f32,
467    pub tab_icon_spacing: f32,
468    pub tab_summary_spacing: f32,
469}
470
471#[derive(Deserialize, Default)]
472pub struct ContactNotification {
473    pub header_avatar: ImageStyle,
474    pub header_message: ContainedText,
475    pub header_height: f32,
476    pub body_message: ContainedText,
477    pub button: Interactive<ContainedText>,
478    pub dismiss_button: Interactive<IconButton>,
479}
480
481#[derive(Deserialize, Default)]
482pub struct UpdateNotification {
483    pub message: ContainedText,
484    pub action_message: Interactive<ContainedText>,
485    pub dismiss_button: Interactive<IconButton>,
486}
487
488#[derive(Clone, Deserialize, Default)]
489pub struct Editor {
490    pub text_color: Color,
491    #[serde(default)]
492    pub background: Color,
493    pub selection: SelectionStyle,
494    pub gutter_background: Color,
495    pub gutter_padding_factor: f32,
496    pub active_line_background: Color,
497    pub highlighted_line_background: Color,
498    pub rename_fade: f32,
499    pub document_highlight_read_background: Color,
500    pub document_highlight_write_background: Color,
501    pub diff_background_deleted: Color,
502    pub diff_background_inserted: Color,
503    pub line_number: Color,
504    pub line_number_active: Color,
505    pub guest_selections: Vec<SelectionStyle>,
506    pub syntax: Arc<SyntaxTheme>,
507    pub diagnostic_path_header: DiagnosticPathHeader,
508    pub diagnostic_header: DiagnosticHeader,
509    pub error_diagnostic: DiagnosticStyle,
510    pub invalid_error_diagnostic: DiagnosticStyle,
511    pub warning_diagnostic: DiagnosticStyle,
512    pub invalid_warning_diagnostic: DiagnosticStyle,
513    pub information_diagnostic: DiagnosticStyle,
514    pub invalid_information_diagnostic: DiagnosticStyle,
515    pub hint_diagnostic: DiagnosticStyle,
516    pub invalid_hint_diagnostic: DiagnosticStyle,
517    pub autocomplete: AutocompleteStyle,
518    pub code_actions: CodeActions,
519    pub unnecessary_code_fade: f32,
520    pub hover_popover: HoverPopover,
521    pub link_definition: HighlightStyle,
522    pub composition_mark: HighlightStyle,
523    pub jump_icon: Interactive<IconButton>,
524}
525
526#[derive(Clone, Deserialize, Default)]
527pub struct DiagnosticPathHeader {
528    #[serde(flatten)]
529    pub container: ContainerStyle,
530    pub filename: ContainedText,
531    pub path: ContainedText,
532    pub text_scale_factor: f32,
533}
534
535#[derive(Clone, Deserialize, Default)]
536pub struct DiagnosticHeader {
537    #[serde(flatten)]
538    pub container: ContainerStyle,
539    pub message: ContainedLabel,
540    pub code: ContainedText,
541    pub text_scale_factor: f32,
542    pub icon_width_factor: f32,
543}
544
545#[derive(Clone, Deserialize, Default)]
546pub struct DiagnosticStyle {
547    pub message: LabelStyle,
548    #[serde(default)]
549    pub header: ContainerStyle,
550    pub text_scale_factor: f32,
551}
552
553#[derive(Clone, Deserialize, Default)]
554pub struct AutocompleteStyle {
555    #[serde(flatten)]
556    pub container: ContainerStyle,
557    pub item: ContainerStyle,
558    pub selected_item: ContainerStyle,
559    pub hovered_item: ContainerStyle,
560    pub match_highlight: HighlightStyle,
561}
562
563#[derive(Clone, Copy, Default, Deserialize)]
564pub struct SelectionStyle {
565    pub cursor: Color,
566    pub selection: Color,
567}
568
569#[derive(Clone, Deserialize, Default)]
570pub struct FieldEditor {
571    #[serde(flatten)]
572    pub container: ContainerStyle,
573    pub text: TextStyle,
574    #[serde(default)]
575    pub placeholder_text: Option<TextStyle>,
576    pub selection: SelectionStyle,
577}
578
579#[derive(Clone, Deserialize, Default)]
580pub struct CodeActions {
581    #[serde(default)]
582    pub indicator: Color,
583    pub vertical_scale: f32,
584}
585
586#[derive(Debug, Default, Clone, Copy)]
587pub struct Interactive<T> {
588    pub default: T,
589    pub hover: Option<T>,
590    pub clicked: Option<T>,
591    pub active: Option<T>,
592    pub disabled: Option<T>,
593}
594
595impl<T> Interactive<T> {
596    pub fn style_for(&self, state: MouseState, active: bool) -> &T {
597        if active {
598            self.active.as_ref().unwrap_or(&self.default)
599        } else if state.clicked == Some(gpui::MouseButton::Left) && self.clicked.is_some() {
600            self.clicked.as_ref().unwrap()
601        } else if state.hovered {
602            self.hover.as_ref().unwrap_or(&self.default)
603        } else {
604            &self.default
605        }
606    }
607
608    pub fn disabled_style(&self) -> &T {
609        self.disabled.as_ref().unwrap_or(&self.default)
610    }
611}
612
613impl<'de, T: DeserializeOwned> Deserialize<'de> for Interactive<T> {
614    fn deserialize<D>(deserializer: D) -> Result<Self, D::Error>
615    where
616        D: serde::Deserializer<'de>,
617    {
618        #[derive(Deserialize)]
619        struct Helper {
620            #[serde(flatten)]
621            default: Value,
622            hover: Option<Value>,
623            clicked: Option<Value>,
624            active: Option<Value>,
625            disabled: Option<Value>,
626        }
627
628        let json = Helper::deserialize(deserializer)?;
629
630        let deserialize_state = |state_json: Option<Value>| -> Result<Option<T>, D::Error> {
631            if let Some(mut state_json) = state_json {
632                if let Value::Object(state_json) = &mut state_json {
633                    if let Value::Object(default) = &json.default {
634                        for (key, value) in default {
635                            if !state_json.contains_key(key) {
636                                state_json.insert(key.clone(), value.clone());
637                            }
638                        }
639                    }
640                }
641                Ok(Some(
642                    serde_json::from_value::<T>(state_json).map_err(serde::de::Error::custom)?,
643                ))
644            } else {
645                Ok(None)
646            }
647        };
648
649        let hover = deserialize_state(json.hover)?;
650        let clicked = deserialize_state(json.clicked)?;
651        let active = deserialize_state(json.active)?;
652        let disabled = deserialize_state(json.disabled)?;
653        let default = serde_json::from_value(json.default).map_err(serde::de::Error::custom)?;
654
655        Ok(Interactive {
656            default,
657            hover,
658            clicked,
659            active,
660            disabled,
661        })
662    }
663}
664
665impl Editor {
666    pub fn replica_selection_style(&self, replica_id: u16) -> &SelectionStyle {
667        let style_ix = replica_id as usize % (self.guest_selections.len() + 1);
668        if style_ix == 0 {
669            &self.selection
670        } else {
671            &self.guest_selections[style_ix - 1]
672        }
673    }
674}
675
676#[derive(Default)]
677pub struct SyntaxTheme {
678    pub highlights: Vec<(String, HighlightStyle)>,
679}
680
681impl SyntaxTheme {
682    pub fn new(highlights: Vec<(String, HighlightStyle)>) -> Self {
683        Self { highlights }
684    }
685}
686
687impl<'de> Deserialize<'de> for SyntaxTheme {
688    fn deserialize<D>(deserializer: D) -> Result<Self, D::Error>
689    where
690        D: serde::Deserializer<'de>,
691    {
692        let syntax_data: HashMap<String, HighlightStyle> = Deserialize::deserialize(deserializer)?;
693
694        let mut result = Self::new(Vec::new());
695        for (key, style) in syntax_data {
696            match result
697                .highlights
698                .binary_search_by(|(needle, _)| needle.cmp(&key))
699            {
700                Ok(i) | Err(i) => {
701                    result.highlights.insert(i, (key, style));
702                }
703            }
704        }
705
706        Ok(result)
707    }
708}
709
710#[derive(Clone, Deserialize, Default)]
711pub struct HoverPopover {
712    pub container: ContainerStyle,
713    pub info_container: ContainerStyle,
714    pub warning_container: ContainerStyle,
715    pub error_container: ContainerStyle,
716    pub block_style: ContainerStyle,
717    pub prose: TextStyle,
718    pub highlight: Color,
719}
720
721#[derive(Clone, Deserialize, Default)]
722pub struct TerminalStyle {
723    pub colors: TerminalColors,
724    pub modal_container: ContainerStyle,
725}
726
727#[derive(Clone, Deserialize, Default)]
728pub struct TerminalColors {
729    pub black: Color,
730    pub red: Color,
731    pub green: Color,
732    pub yellow: Color,
733    pub blue: Color,
734    pub magenta: Color,
735    pub cyan: Color,
736    pub white: Color,
737    pub bright_black: Color,
738    pub bright_red: Color,
739    pub bright_green: Color,
740    pub bright_yellow: Color,
741    pub bright_blue: Color,
742    pub bright_magenta: Color,
743    pub bright_cyan: Color,
744    pub bright_white: Color,
745    pub foreground: Color,
746    pub background: Color,
747    pub modal_background: Color,
748    pub cursor: Color,
749    pub dim_black: Color,
750    pub dim_red: Color,
751    pub dim_green: Color,
752    pub dim_yellow: Color,
753    pub dim_blue: Color,
754    pub dim_magenta: Color,
755    pub dim_cyan: Color,
756    pub dim_white: Color,
757    pub bright_foreground: Color,
758    pub dim_foreground: Color,
759}