elit 3.5.6 → 3.5.8

package/desktop/native_renderer/action_widgets.rs

@@ -0,0 +1,184 @@
+use eframe::egui::{self, Vec2};
+use serde_json::Value;
+
+use super::utilities::{is_external_destination, resolve_interaction};
+use super::{DesktopNativeApp, NativeElementNode, NativeNode};
+
+impl DesktopNativeApp {
+    pub(super) fn render_button(&mut self, ui: &mut egui::Ui, ctx: &egui::Context, node: &NativeElementNode) {
+        let label = self.collect_text_content(&NativeNode::Element(node.clone()));
+        let disabled = self.is_disabled(node);
+        let base_state = self.base_pseudo_state(node);
+        let inactive_style = self.resolve_style_map_with_state(node, base_state);
+
+        let mut hovered_state = base_state;
+        hovered_state.hovered = true;
+        let hovered_style = self.resolve_style_map_with_state(node, hovered_state);
+
+        let mut active_state = hovered_state;
+        active_state.active = true;
+        let active_style = self.resolve_style_map_with_state(node, active_state);
+
+        let mut focus_state = base_state;
+        focus_state.focused = true;
+        focus_state.focus_within = true;
+        let focus_style = self.resolve_style_map_with_state(node, focus_state);
+
+        let mut disabled_state = base_state;
+        disabled_state.enabled = false;
+        disabled_state.disabled = true;
+        let disabled_style = self.resolve_style_map_with_state(node, disabled_state);
+        let inactive_gradient = Self::resolve_background_gradient_from_style(inactive_style.as_ref());
+        let hovered_gradient = Self::resolve_background_gradient_from_style(hovered_style.as_ref());
+        let active_gradient = Self::resolve_background_gradient_from_style(active_style.as_ref());
+        let focus_gradient = Self::resolve_background_gradient_from_style(focus_style.as_ref());
+        let disabled_gradient = Self::resolve_background_gradient_from_style(disabled_style.as_ref());
+        let gradient_shape_idx = if inactive_gradient.is_some() || hovered_gradient.is_some() || active_gradient.is_some() || focus_gradient.is_some() || disabled_gradient.is_some() {
+            Some(ui.painter().add(egui::Shape::Noop))
+        } else {
+            None
+        };
+        let button_corner_radius = Self::resolve_corner_radius_from_style(inactive_style.as_ref()).unwrap_or(ui.style().visuals.widgets.inactive.corner_radius);
+
+        let response = ui
+            .scope(|ui| {
+                self.apply_widget_state_visuals(
+                    ui,
+                    inactive_style.as_ref(),
+                    hovered_style.as_ref(),
+                    active_style.as_ref(),
+                    focus_style.as_ref(),
+                    disabled_style.as_ref(),
+                );
+
+                if let Some(padding) = Self::resolve_box_edges(inactive_style.as_ref(), "padding") {
+                    ui.spacing_mut().button_padding = egui::vec2(padding.average_horizontal(), padding.average_vertical());
+                }
+
+                let min_size = self.resolve_widget_min_size(inactive_style.as_ref());
+                let mut button = egui::Button::new(self.resolve_text_style_from_style(ui, inactive_style.as_ref(), label.clone(), false)).frame(true);
+                if min_size != Vec2::ZERO {
+                    button = button.min_size(min_size);
+                }
+
+                ui.add_enabled(!disabled, button)
+            })
+            .inner;
+
+        if let Some(shape_idx) = gradient_shape_idx {
+            let active_gradient = if disabled {
+                disabled_gradient.or(inactive_gradient)
+            } else if response.is_pointer_button_down_on() {
+                active_gradient.or(hovered_gradient).or(focus_gradient).or(inactive_gradient)
+            } else if response.hovered() {
+                hovered_gradient.or(focus_gradient).or(inactive_gradient)
+            } else if response.has_focus() {
+                focus_gradient.or(inactive_gradient)
+            } else {
+                inactive_gradient
+            };
+
+            if let Some(gradient) = active_gradient {
+                ui.painter().set(
+                    shape_idx,
+                    Self::gradient_shape_for_rect(response.rect, button_corner_radius, &gradient),
+                );
+            }
+        }
+
+        if response.clicked() {
+            if let Some(interaction) = resolve_interaction(node, None, None) {
+                self.dispatch_interaction(ctx, interaction);
+            } else if node.events.iter().any(|event| event == "press") {
+                self.dispatch_press_event(ctx, node);
+            }
+        }
+    }
+
+    pub(super) fn render_link(&mut self, ui: &mut egui::Ui, ctx: &egui::Context, node: &NativeElementNode) {
+        let label = self.collect_text_content(&NativeNode::Element(node.clone()));
+        let base_state = self.base_pseudo_state(node);
+        let inactive_style = self.resolve_style_map_with_state(node, base_state);
+
+        let mut hovered_state = base_state;
+        hovered_state.hovered = true;
+        let hovered_style = self.resolve_style_map_with_state(node, hovered_state);
+
+        let mut active_state = hovered_state;
+        active_state.active = true;
+        let active_style = self.resolve_style_map_with_state(node, active_state);
+
+        let mut focus_state = base_state;
+        focus_state.focused = true;
+        focus_state.focus_within = true;
+        let focus_style = self.resolve_style_map_with_state(node, focus_state);
+
+        let has_frame = Self::style_has_widget_frame(inactive_style.as_ref());
+        let inactive_gradient = Self::resolve_background_gradient_from_style(inactive_style.as_ref());
+        let hovered_gradient = Self::resolve_background_gradient_from_style(hovered_style.as_ref());
+        let active_gradient = Self::resolve_background_gradient_from_style(active_style.as_ref());
+        let focus_gradient = Self::resolve_background_gradient_from_style(focus_style.as_ref());
+        let gradient_shape_idx = if inactive_gradient.is_some() || hovered_gradient.is_some() || active_gradient.is_some() || focus_gradient.is_some() {
+            Some(ui.painter().add(egui::Shape::Noop))
+        } else {
+            None
+        };
+        let link_corner_radius = Self::resolve_corner_radius_from_style(inactive_style.as_ref()).unwrap_or(ui.style().visuals.widgets.inactive.corner_radius);
+        let destination = node.props.get("destination").and_then(Value::as_str).map(str::trim).unwrap_or("");
+        let response = ui
+            .scope(|ui| {
+                self.apply_widget_state_visuals(
+                    ui,
+                    inactive_style.as_ref(),
+                    hovered_style.as_ref(),
+                    active_style.as_ref(),
+                    focus_style.as_ref(),
+                    None,
+                );
+
+                if has_frame {
+                    if let Some(padding) = Self::resolve_box_edges(inactive_style.as_ref(), "padding") {
+                        ui.spacing_mut().button_padding = egui::vec2(padding.average_horizontal(), padding.average_vertical());
+                    }
+                }
+
+                let min_size = self.resolve_widget_min_size(inactive_style.as_ref());
+                let mut link = egui::Button::new(self.resolve_text_style_from_style(ui, inactive_style.as_ref(), label.clone(), false)).frame(has_frame);
+                if min_size != Vec2::ZERO {
+                    link = link.min_size(min_size);
+                }
+
+                ui.add(link)
+            })
+            .inner;
+
+        if let Some(shape_idx) = gradient_shape_idx {
+            let active_gradient = if response.is_pointer_button_down_on() {
+                active_gradient.or(hovered_gradient).or(focus_gradient).or(inactive_gradient)
+            } else if response.hovered() {
+                hovered_gradient.or(focus_gradient).or(inactive_gradient)
+            } else if response.has_focus() {
+                focus_gradient.or(inactive_gradient)
+            } else {
+                inactive_gradient
+            };
+
+            if let Some(gradient) = active_gradient {
+                ui.painter().set(
+                    shape_idx,
+                    Self::gradient_shape_for_rect(response.rect, link_corner_radius, &gradient),
+                );
+            }
+        }
+
+        if response.clicked() {
+            if !destination.is_empty() && is_external_destination(destination) {
+                let _ = webbrowser::open(destination);
+            } else if let Some(interaction) = resolve_interaction(node, None, None) {
+                self.dispatch_interaction(ctx, interaction);
+            } else if node.events.iter().any(|event| event == "press") {
+                self.dispatch_press_event(ctx, node);
+            }
+        }
+    }
+}

package/desktop/native_renderer/app_models.rs

@@ -0,0 +1,171 @@
+use std::path::PathBuf;
+
+use eframe::egui::Rect;
+use serde::Serialize;
+use serde_json::Value;
+#[cfg(target_os = "windows")]
+use wry::WebView;
+
+#[derive(Debug, Clone, PartialEq, Serialize)]
+pub(crate) struct DesktopInteraction {
+    pub(crate) action: Option<String>,
+    pub(crate) route: Option<String>,
+    pub(crate) payload: Option<Value>,
+}
+
+impl DesktopInteraction {
+    pub(crate) fn is_empty(&self) -> bool {
+        self.action.is_none() && self.route.is_none() && self.payload.is_none()
+    }
+
+    pub(crate) fn summary(&self) -> String {
+        let mut parts = Vec::new();
+        if let Some(action) = &self.action {
+            parts.push(format!("action={action}"));
+        }
+        if let Some(route) = &self.route {
+            parts.push(format!("route={route}"));
+        }
+        if let Some(payload) = &self.payload {
+            parts.push(format!("payload={payload}"));
+        }
+
+        if parts.is_empty() {
+            String::from("idle")
+        } else {
+            parts.join(" | ")
+        }
+    }
+}
+
+#[derive(Debug, Clone, Default)]
+pub(crate) struct DesktopControlEventData {
+    pub(crate) value: Option<String>,
+    pub(crate) values: Option<Vec<String>>,
+    pub(crate) checked: Option<bool>,
+}
+
+#[derive(Debug, Clone, PartialEq)]
+pub(crate) struct PickerOptionData {
+    pub(crate) label: String,
+    pub(crate) value: String,
+    pub(crate) disabled: bool,
+    pub(crate) selected: bool,
+}
+
+#[derive(Debug, Clone, Default)]
+pub(crate) struct ResolvedDesktopInteractionOutput {
+    pub(crate) file: Option<PathBuf>,
+    pub(crate) stdout: bool,
+    pub(crate) emit_ready: bool,
+}
+
+#[derive(Debug, Clone, Default)]
+pub(crate) struct DesktopNavigationState {
+    pub(crate) history: Vec<String>,
+    pub(crate) index: Option<usize>,
+}
+
+impl DesktopNavigationState {
+    pub(crate) fn current_route(&self) -> Option<&str> {
+        self.index.and_then(|index| self.history.get(index)).map(String::as_str)
+    }
+
+    pub(crate) fn can_go_back(&self) -> bool {
+        self.index.is_some()
+    }
+
+    pub(crate) fn can_go_forward(&self) -> bool {
+        match self.index {
+            Some(index) => index + 1 < self.history.len(),
+            None => !self.history.is_empty(),
+        }
+    }
+
+    pub(crate) fn navigate_to(&mut self, route: impl Into<String>) -> bool {
+        let route = route.into().trim().to_string();
+        if route.is_empty() {
+            return false;
+        }
+
+        if let Some(index) = self.index {
+            if index + 1 < self.history.len() {
+                self.history.truncate(index + 1);
+            }
+        } else {
+            self.history.clear();
+        }
+
+        self.history.push(route);
+        self.index = Some(self.history.len() - 1);
+        true
+    }
+
+    pub(crate) fn go_back(&mut self) -> bool {
+        match self.index {
+            Some(index) if index > 0 => {
+                self.index = Some(index - 1);
+                true
+            }
+            Some(_) => {
+                self.index = None;
+                true
+            }
+            None => false,
+        }
+    }
+
+    pub(crate) fn go_forward(&mut self) -> bool {
+        match self.index {
+            Some(index) if index + 1 < self.history.len() => {
+                self.index = Some(index + 1);
+                true
+            }
+            None if !self.history.is_empty() => {
+                self.index = Some(0);
+                true
+            }
+            _ => false,
+        }
+    }
+
+    pub(crate) fn clear(&mut self) {
+        self.index = None;
+    }
+}
+
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+pub(crate) enum DesktopSurfaceWindowKind {
+    WebView,
+    Video,
+    Audio,
+}
+
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+pub(crate) enum DesktopEmbeddedSurfaceVisibility {
+    Hidden,
+    Clipped,
+    Visible,
+}
+
+#[derive(Clone, Debug, PartialEq, Eq)]
+pub(crate) enum DesktopEmbeddedSurfaceContent {
+    Url(String),
+    Html(String),
+}
+
+#[derive(Clone, Debug)]
+pub(crate) struct DesktopEmbeddedSurfaceRequest {
+    pub(crate) kind: DesktopSurfaceWindowKind,
+    pub(crate) title: String,
+    pub(crate) rect: Rect,
+    pub(crate) content: DesktopEmbeddedSurfaceContent,
+    pub(crate) focus_requested: bool,
+}
+
+#[cfg(target_os = "windows")]
+pub(crate) struct DesktopEmbeddedSurface {
+    pub(crate) kind: DesktopSurfaceWindowKind,
+    pub(crate) content: DesktopEmbeddedSurfaceContent,
+    pub(crate) webview: WebView,
+}

package/desktop/native_renderer/app_runtime.rs

@@ -0,0 +1,140 @@
+use eframe::egui;
+use serde_json::Value;
+
+use super::{DesktopNativeApp, NativeElementNode, NativeNode};
+
+impl DesktopNativeApp {
+    pub(super) fn resolve_prop_number(&self, node: &NativeElementNode, key: &str) -> Option<f32> {
+        Self::parse_css_number(node.props.get(key))
+    }
+
+    pub(super) fn resolve_prop_string<'a>(&self, node: &'a NativeElementNode, key: &str) -> Option<&'a str> {
+        node.props.get(key).and_then(Value::as_str).map(str::trim).filter(|value| !value.is_empty())
+    }
+
+    pub(super) fn resolve_label(&self, node: &NativeElementNode) -> Option<String> {
+        ["aria-label", "label", "title", "name", "alt"]
+            .iter()
+            .find_map(|key| self.resolve_prop_string(node, key).map(str::to_string))
+            .or_else(|| {
+                let text = self.collect_text_content(&NativeNode::Element(node.clone()));
+                let trimmed = text.trim();
+                (!trimmed.is_empty()).then_some(trimmed.to_string())
+            })
+    }
+
+    pub(super) fn is_disabled(&self, node: &NativeElementNode) -> bool {
+        super::parse_native_bool(node.props.get("disabled")) || super::parse_native_bool(node.props.get("aria-disabled"))
+    }
+
+    pub(super) fn is_read_only(&self, node: &NativeElementNode) -> bool {
+        super::parse_native_bool(node.props.get("readOnly")) || super::parse_native_bool(node.props.get("readonly"))
+    }
+
+    pub(super) fn has_focusable_tab_index(&self, node: &NativeElementNode) -> bool {
+        node.props
+            .get("tabIndex")
+            .or_else(|| node.props.get("tabindex"))
+            .and_then(|value| match value {
+                Value::Number(number) => number.as_i64(),
+                Value::String(text) => text.trim().parse::<i64>().ok(),
+                _ => None,
+            })
+            .map(|value| value >= 0)
+            .unwrap_or(false)
+    }
+
+    pub(super) fn render_node(&mut self, ui: &mut egui::Ui, ctx: &egui::Context, node: &NativeNode, path: &str) {
+        match node {
+            NativeNode::Text(text_node) => {
+                ui.label(self.resolve_text_node_value(text_node));
+            }
+            NativeNode::Element(element_node) => match element_node.component.as_str() {
+                "Text" => self.render_text_element(ui, element_node),
+                "Button" => self.render_button(ui, ctx, element_node),
+                "Link" => self.render_link(ui, ctx, element_node),
+                "TextInput" => self.render_text_input(ui, ctx, element_node, path),
+                "Toggle" => self.render_toggle(ui, ctx, element_node, path),
+                "Slider" => self.render_slider(ui, ctx, element_node, path),
+                "Picker" => self.render_picker(ui, ctx, element_node, path),
+                "Option" => self.render_text_element(ui, element_node),
+                "Divider" => self.render_divider(ui),
+                "Progress" => self.render_progress(ui, element_node),
+                "Image" => self.render_image(ui, ctx, element_node),
+                "WebView" => self.render_web_view(ui, element_node, path),
+                "Media" => self.render_media(ui, ctx, element_node, path),
+                "Canvas" => self.render_canvas(ui, element_node),
+                "Vector" => self.render_vector(ui, element_node),
+                "Math" => self.render_math(ui, element_node),
+                "Table" => self.render_table(ui, ctx, element_node, path),
+                "Row" => self.render_row(ui, ctx, element_node, path),
+                "Cell" => self.render_cell(ui, ctx, element_node, path),
+                "ListItem" => self.render_list_item(ui, ctx, element_node, path),
+                "List" => self.render_list(ui, ctx, element_node, path),
+                "Screen" | "View" => self.render_container(ui, ctx, element_node, path),
+                _ => self.render_surface_placeholder(ui, &element_node.component, "Desktop native fallback surface"),
+            },
+        }
+    }
+
+    fn render_navigation_bar(&mut self, ui: &mut egui::Ui, ctx: &egui::Context) {
+        if self.navigation.current_route().is_none() && !self.navigation.can_go_forward() {
+            return;
+        }
+
+        ui.horizontal(|ui| {
+            if ui.add_enabled(self.navigation.can_go_back(), egui::Button::new("Back")).clicked() {
+                self.navigation.go_back();
+                self.apply_navigation_title(ctx);
+            }
+
+            if ui.add_enabled(self.navigation.can_go_forward(), egui::Button::new("Forward")).clicked() {
+                self.navigation.go_forward();
+                self.apply_navigation_title(ctx);
+            }
+
+            if ui.add_enabled(self.navigation.current_route().is_some(), egui::Button::new("Reset")).clicked() {
+                self.navigation.clear();
+                self.apply_navigation_title(ctx);
+            }
+
+            ui.small(self.navigation.current_route().unwrap_or("/"));
+        });
+        ui.separator();
+    }
+
+    fn render_last_interaction_summary(&self, ui: &mut egui::Ui) {
+        if let Some(interaction) = &self.last_interaction {
+            ui.separator();
+            ui.small(format!("Last interaction: {}", interaction.summary()));
+        }
+    }
+}
+
+impl eframe::App for DesktopNativeApp {
+    fn update(&mut self, ctx: &egui::Context, frame: &mut eframe::Frame) {
+        let roots = self.payload.tree.roots.clone();
+        self.viewport_size = ctx.screen_rect().size();
+        self.ensure_fonts_loaded(ctx);
+        self.emit_ready_interaction();
+
+        egui::CentralPanel::default().show(ctx, |ui| {
+            egui::ScrollArea::vertical().auto_shrink([false, false]).show(ui, |ui| {
+                self.render_navigation_bar(ui, ctx);
+
+                for (index, root) in roots.iter().enumerate() {
+                    self.render_node(ui, ctx, root, &format!("root-{index}"));
+                }
+
+                self.render_last_interaction_summary(ui);
+            });
+        });
+
+        self.reconcile_embedded_surfaces(frame);
+
+        if self.pending_auto_close {
+            self.pending_auto_close = false;
+            ctx.send_viewport_cmd(egui::ViewportCommand::Close);
+        }
+    }
+}