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_panel: ContactsPanel,
 23    pub contact_finder: ContactFinder,
 24    pub project_panel: ProjectPanel,
 25    pub command_palette: CommandPalette,
 26    pub picker: Picker,
 27    pub editor: Editor,
 28    pub search: Search,
 29    pub project_diagnostics: ProjectDiagnostics,
 30    pub breadcrumbs: ContainedText,
 31    pub contact_notification: ContactNotification,
 32    pub update_notification: UpdateNotification,
 33    pub tooltip: TooltipStyle,
 34    pub terminal: TerminalStyle,
 35}
 36
 37#[derive(Deserialize, Default, Clone)]
 38pub struct ThemeMeta {
 39    pub name: String,
 40    pub is_light: bool,
 41}
 42
 43#[derive(Deserialize, Default)]
 44pub struct Workspace {
 45    pub background: Color,
 46    pub titlebar: Titlebar,
 47    pub tab_bar: TabBar,
 48    pub pane_divider: Border,
 49    pub leader_border_opacity: f32,
 50    pub leader_border_width: f32,
 51    pub sidebar: Sidebar,
 52    pub status_bar: StatusBar,
 53    pub toolbar: Toolbar,
 54    pub disconnected_overlay: ContainedText,
 55    pub modal: ContainerStyle,
 56    pub notification: ContainerStyle,
 57    pub notifications: Notifications,
 58    pub joining_project_avatar: ImageStyle,
 59    pub joining_project_message: ContainedText,
 60    pub dock: Dock,
 61}
 62
 63#[derive(Clone, Deserialize, Default)]
 64pub struct Titlebar {
 65    #[serde(flatten)]
 66    pub container: ContainerStyle,
 67    pub height: f32,
 68    pub title: TextStyle,
 69    pub avatar_width: f32,
 70    pub avatar_margin: f32,
 71    pub avatar_ribbon: AvatarRibbon,
 72    pub offline_icon: OfflineIcon,
 73    pub avatar: ImageStyle,
 74    pub inactive_avatar: ImageStyle,
 75    pub sign_in_prompt: Interactive<ContainedText>,
 76    pub outdated_warning: ContainedText,
 77    pub toggle_contacts_button: Interactive<IconButton>,
 78    pub contacts_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 ContactsPanel {
330    #[serde(flatten)]
331    pub container: ContainerStyle,
332    pub user_query_editor: FieldEditor,
333    pub user_query_editor_height: f32,
334    pub add_contact_button: IconButton,
335    pub header_row: Interactive<ContainedText>,
336    pub contact_row: Interactive<ContainerStyle>,
337    pub project_row: Interactive<ProjectRow>,
338    pub row_height: f32,
339    pub contact_avatar: ImageStyle,
340    pub contact_username: ContainedText,
341    pub contact_button: Interactive<IconButton>,
342    pub contact_button_spacing: f32,
343    pub disabled_button: IconButton,
344    pub tree_branch: Interactive<TreeBranch>,
345    pub private_button: Interactive<IconButton>,
346    pub section_icon_size: f32,
347    pub invite_row: Interactive<ContainedLabel>,
348}
349
350#[derive(Deserialize, Default)]
351pub struct InviteLink {
352    #[serde(flatten)]
353    pub container: ContainerStyle,
354    #[serde(flatten)]
355    pub label: LabelStyle,
356    pub icon: Icon,
357}
358
359#[derive(Deserialize, Default, Clone, Copy)]
360pub struct TreeBranch {
361    pub width: f32,
362    pub color: Color,
363}
364
365#[derive(Deserialize, Default)]
366pub struct ContactFinder {
367    pub row_height: f32,
368    pub contact_avatar: ImageStyle,
369    pub contact_username: ContainerStyle,
370    pub contact_button: IconButton,
371    pub disabled_contact_button: IconButton,
372}
373
374#[derive(Deserialize, Default)]
375pub struct Icon {
376    #[serde(flatten)]
377    pub container: ContainerStyle,
378    pub color: Color,
379    pub width: f32,
380    pub path: String,
381}
382
383#[derive(Deserialize, Clone, Copy, Default)]
384pub struct IconButton {
385    #[serde(flatten)]
386    pub container: ContainerStyle,
387    pub color: Color,
388    pub icon_width: f32,
389    pub button_width: f32,
390}
391
392#[derive(Deserialize, Default)]
393pub struct ProjectRow {
394    #[serde(flatten)]
395    pub container: ContainerStyle,
396    pub name: ContainedText,
397    pub guests: ContainerStyle,
398    pub guest_avatar: ImageStyle,
399    pub guest_avatar_spacing: f32,
400}
401
402#[derive(Deserialize, Default)]
403pub struct ChatMessage {
404    #[serde(flatten)]
405    pub container: ContainerStyle,
406    pub body: TextStyle,
407    pub sender: ContainedText,
408    pub timestamp: ContainedText,
409}
410
411#[derive(Deserialize, Default)]
412pub struct ChannelSelect {
413    #[serde(flatten)]
414    pub container: ContainerStyle,
415    pub header: ChannelName,
416    pub item: ChannelName,
417    pub active_item: ChannelName,
418    pub hovered_item: ChannelName,
419    pub hovered_active_item: ChannelName,
420    pub menu: ContainerStyle,
421}
422
423#[derive(Deserialize, Default)]
424pub struct ChannelName {
425    #[serde(flatten)]
426    pub container: ContainerStyle,
427    pub hash: ContainedText,
428    pub name: TextStyle,
429}
430
431#[derive(Deserialize, Default)]
432pub struct Picker {
433    #[serde(flatten)]
434    pub container: ContainerStyle,
435    pub empty: ContainedLabel,
436    pub input_editor: FieldEditor,
437    pub item: Interactive<ContainedLabel>,
438}
439
440#[derive(Clone, Debug, Deserialize, Default)]
441pub struct ContainedText {
442    #[serde(flatten)]
443    pub container: ContainerStyle,
444    #[serde(flatten)]
445    pub text: TextStyle,
446}
447
448#[derive(Clone, Debug, Deserialize, Default)]
449pub struct ContainedLabel {
450    #[serde(flatten)]
451    pub container: ContainerStyle,
452    #[serde(flatten)]
453    pub label: LabelStyle,
454}
455
456#[derive(Clone, Deserialize, Default)]
457pub struct ProjectDiagnostics {
458    #[serde(flatten)]
459    pub container: ContainerStyle,
460    pub empty_message: TextStyle,
461    pub tab_icon_width: f32,
462    pub tab_icon_spacing: f32,
463    pub tab_summary_spacing: f32,
464}
465
466#[derive(Deserialize, Default)]
467pub struct ContactNotification {
468    pub header_avatar: ImageStyle,
469    pub header_message: ContainedText,
470    pub header_height: f32,
471    pub body_message: ContainedText,
472    pub button: Interactive<ContainedText>,
473    pub dismiss_button: Interactive<IconButton>,
474}
475
476#[derive(Deserialize, Default)]
477pub struct UpdateNotification {
478    pub message: ContainedText,
479    pub action_message: Interactive<ContainedText>,
480    pub dismiss_button: Interactive<IconButton>,
481}
482
483#[derive(Clone, Deserialize, Default)]
484pub struct Editor {
485    pub text_color: Color,
486    #[serde(default)]
487    pub background: Color,
488    pub selection: SelectionStyle,
489    pub gutter_background: Color,
490    pub gutter_padding_factor: f32,
491    pub active_line_background: Color,
492    pub highlighted_line_background: Color,
493    pub rename_fade: f32,
494    pub document_highlight_read_background: Color,
495    pub document_highlight_write_background: Color,
496    pub diff_background_deleted: Color,
497    pub diff_background_inserted: Color,
498    pub line_number: Color,
499    pub line_number_active: Color,
500    pub guest_selections: Vec<SelectionStyle>,
501    pub syntax: Arc<SyntaxTheme>,
502    pub diagnostic_path_header: DiagnosticPathHeader,
503    pub diagnostic_header: DiagnosticHeader,
504    pub error_diagnostic: DiagnosticStyle,
505    pub invalid_error_diagnostic: DiagnosticStyle,
506    pub warning_diagnostic: DiagnosticStyle,
507    pub invalid_warning_diagnostic: DiagnosticStyle,
508    pub information_diagnostic: DiagnosticStyle,
509    pub invalid_information_diagnostic: DiagnosticStyle,
510    pub hint_diagnostic: DiagnosticStyle,
511    pub invalid_hint_diagnostic: DiagnosticStyle,
512    pub autocomplete: AutocompleteStyle,
513    pub code_actions: CodeActions,
514    pub unnecessary_code_fade: f32,
515    pub hover_popover: HoverPopover,
516    pub link_definition: HighlightStyle,
517    pub composition_mark: HighlightStyle,
518    pub jump_icon: Interactive<IconButton>,
519}
520
521#[derive(Clone, Deserialize, Default)]
522pub struct DiagnosticPathHeader {
523    #[serde(flatten)]
524    pub container: ContainerStyle,
525    pub filename: ContainedText,
526    pub path: ContainedText,
527    pub text_scale_factor: f32,
528}
529
530#[derive(Clone, Deserialize, Default)]
531pub struct DiagnosticHeader {
532    #[serde(flatten)]
533    pub container: ContainerStyle,
534    pub message: ContainedLabel,
535    pub code: ContainedText,
536    pub text_scale_factor: f32,
537    pub icon_width_factor: f32,
538}
539
540#[derive(Clone, Deserialize, Default)]
541pub struct DiagnosticStyle {
542    pub message: LabelStyle,
543    #[serde(default)]
544    pub header: ContainerStyle,
545    pub text_scale_factor: f32,
546}
547
548#[derive(Clone, Deserialize, Default)]
549pub struct AutocompleteStyle {
550    #[serde(flatten)]
551    pub container: ContainerStyle,
552    pub item: ContainerStyle,
553    pub selected_item: ContainerStyle,
554    pub hovered_item: ContainerStyle,
555    pub match_highlight: HighlightStyle,
556}
557
558#[derive(Clone, Copy, Default, Deserialize)]
559pub struct SelectionStyle {
560    pub cursor: Color,
561    pub selection: Color,
562}
563
564#[derive(Clone, Deserialize, Default)]
565pub struct FieldEditor {
566    #[serde(flatten)]
567    pub container: ContainerStyle,
568    pub text: TextStyle,
569    #[serde(default)]
570    pub placeholder_text: Option<TextStyle>,
571    pub selection: SelectionStyle,
572}
573
574#[derive(Clone, Deserialize, Default)]
575pub struct CodeActions {
576    #[serde(default)]
577    pub indicator: Color,
578    pub vertical_scale: f32,
579}
580
581#[derive(Debug, Default, Clone, Copy)]
582pub struct Interactive<T> {
583    pub default: T,
584    pub hover: Option<T>,
585    pub clicked: Option<T>,
586    pub active: Option<T>,
587    pub disabled: Option<T>,
588}
589
590impl<T> Interactive<T> {
591    pub fn style_for(&self, state: MouseState, active: bool) -> &T {
592        if active {
593            self.active.as_ref().unwrap_or(&self.default)
594        } else if state.clicked == Some(gpui::MouseButton::Left) && self.clicked.is_some() {
595            self.clicked.as_ref().unwrap()
596        } else if state.hovered {
597            self.hover.as_ref().unwrap_or(&self.default)
598        } else {
599            &self.default
600        }
601    }
602
603    pub fn disabled_style(&self) -> &T {
604        self.disabled.as_ref().unwrap_or(&self.default)
605    }
606}
607
608impl<'de, T: DeserializeOwned> Deserialize<'de> for Interactive<T> {
609    fn deserialize<D>(deserializer: D) -> Result<Self, D::Error>
610    where
611        D: serde::Deserializer<'de>,
612    {
613        #[derive(Deserialize)]
614        struct Helper {
615            #[serde(flatten)]
616            default: Value,
617            hover: Option<Value>,
618            clicked: Option<Value>,
619            active: Option<Value>,
620            disabled: Option<Value>,
621        }
622
623        let json = Helper::deserialize(deserializer)?;
624
625        let deserialize_state = |state_json: Option<Value>| -> Result<Option<T>, D::Error> {
626            if let Some(mut state_json) = state_json {
627                if let Value::Object(state_json) = &mut state_json {
628                    if let Value::Object(default) = &json.default {
629                        for (key, value) in default {
630                            if !state_json.contains_key(key) {
631                                state_json.insert(key.clone(), value.clone());
632                            }
633                        }
634                    }
635                }
636                Ok(Some(
637                    serde_json::from_value::<T>(state_json).map_err(serde::de::Error::custom)?,
638                ))
639            } else {
640                Ok(None)
641            }
642        };
643
644        let hover = deserialize_state(json.hover)?;
645        let clicked = deserialize_state(json.clicked)?;
646        let active = deserialize_state(json.active)?;
647        let disabled = deserialize_state(json.disabled)?;
648        let default = serde_json::from_value(json.default).map_err(serde::de::Error::custom)?;
649
650        Ok(Interactive {
651            default,
652            hover,
653            clicked,
654            active,
655            disabled,
656        })
657    }
658}
659
660impl Editor {
661    pub fn replica_selection_style(&self, replica_id: u16) -> &SelectionStyle {
662        let style_ix = replica_id as usize % (self.guest_selections.len() + 1);
663        if style_ix == 0 {
664            &self.selection
665        } else {
666            &self.guest_selections[style_ix - 1]
667        }
668    }
669}
670
671#[derive(Default)]
672pub struct SyntaxTheme {
673    pub highlights: Vec<(String, HighlightStyle)>,
674}
675
676impl SyntaxTheme {
677    pub fn new(highlights: Vec<(String, HighlightStyle)>) -> Self {
678        Self { highlights }
679    }
680}
681
682impl<'de> Deserialize<'de> for SyntaxTheme {
683    fn deserialize<D>(deserializer: D) -> Result<Self, D::Error>
684    where
685        D: serde::Deserializer<'de>,
686    {
687        let syntax_data: HashMap<String, HighlightStyle> = Deserialize::deserialize(deserializer)?;
688
689        let mut result = Self::new(Vec::new());
690        for (key, style) in syntax_data {
691            match result
692                .highlights
693                .binary_search_by(|(needle, _)| needle.cmp(&key))
694            {
695                Ok(i) | Err(i) => {
696                    result.highlights.insert(i, (key, style));
697                }
698            }
699        }
700
701        Ok(result)
702    }
703}
704
705#[derive(Clone, Deserialize, Default)]
706pub struct HoverPopover {
707    pub container: ContainerStyle,
708    pub info_container: ContainerStyle,
709    pub warning_container: ContainerStyle,
710    pub error_container: ContainerStyle,
711    pub block_style: ContainerStyle,
712    pub prose: TextStyle,
713    pub highlight: Color,
714}
715
716#[derive(Clone, Deserialize, Default)]
717pub struct TerminalStyle {
718    pub colors: TerminalColors,
719    pub modal_container: ContainerStyle,
720}
721
722#[derive(Clone, Deserialize, Default)]
723pub struct TerminalColors {
724    pub black: Color,
725    pub red: Color,
726    pub green: Color,
727    pub yellow: Color,
728    pub blue: Color,
729    pub magenta: Color,
730    pub cyan: Color,
731    pub white: Color,
732    pub bright_black: Color,
733    pub bright_red: Color,
734    pub bright_green: Color,
735    pub bright_yellow: Color,
736    pub bright_blue: Color,
737    pub bright_magenta: Color,
738    pub bright_cyan: Color,
739    pub bright_white: Color,
740    pub foreground: Color,
741    pub background: Color,
742    pub modal_background: Color,
743    pub cursor: Color,
744    pub dim_black: Color,
745    pub dim_red: Color,
746    pub dim_green: Color,
747    pub dim_yellow: Color,
748    pub dim_blue: Color,
749    pub dim_magenta: Color,
750    pub dim_cyan: Color,
751    pub dim_white: Color,
752    pub bright_foreground: Color,
753    pub dim_foreground: Color,
754}