//! Interactive node graph editor widget.

//!

//! Provides the [`NodeGraph`] widget for building visual node-based editors

//! (e.g. shader graphs, data-flow pipelines). Key types:

//!

//! - [`NodeGraph`] — top-level widget holding nodes, types, and callbacks

//! - [`Node`] — a single node with typed input/output connections and editable fields

//! - [`NodeTypeInfo`] / [`InputOutputInfo`] — metadata describing node types and their I/O ports

//! - [`NodeGraphCallbacks`] — user-provided callbacks for add, remove, drag, connect, etc.

//!

//! **Known limitation:** Connection curves between nodes are currently not rendered

//! (`draw_connection` returns a null image pending `RenderImageCallbackInfo` support).

use alloc::vec::Vec;

use core::fmt;

use azul_core::{

    callbacks::{CoreCallback, CoreCallbackData, Update},

    dom::{Dom, EventFilter, HoverEventFilter, IdOrClass, IdOrClass::Class, IdOrClassVec},

    geom::{LogicalPosition, LogicalRect, LogicalSize, PhysicalSizeU32},

    gl::Texture,

    menu::{Menu, MenuItem, StringMenuItem},

    refany::{OptionRefAny, RefAny},

    resources::{ImageRef, RawImageFormat},

    svg::{SvgPath, SvgPathElement, SvgStrokeStyle, TessellatedGPUSvgNode},

    window::CursorPosition::InWindow,

};

use azul_css::{

    dynamic_selector::{CssPropertyWithConditions, CssPropertyWithConditionsVec},

    props::{

        basic::*,

        layout::*,

        property::{CssProperty, *},

        style::*,

    },

    *,

};

use azul_css::css::BoxOrStatic;

use crate::{

    callbacks::{Callback, CallbackInfo},

    extra::coloru_from_str,

    widgets::{

        check_box::{CheckBox, CheckBoxOnToggleCallbackType, CheckBoxState},

        color_input::{ColorInput, ColorInputOnValueChangeCallbackType, ColorInputState},

        file_input::{FileInput, FileInputOnPathChangeCallbackType, FileInputState},

        number_input::{NumberInput, NumberInputOnFocusLostCallbackType, NumberInputState},

        text_input::{TextInput, TextInputOnFocusLostCallbackType, TextInputState},

    },

};

/// Interactive node graph editor widget with typed input/output connections.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct NodeGraph {

    pub node_types: NodeTypeIdInfoMapVec,

    pub input_output_types: InputOutputTypeIdInfoMapVec,

    pub nodes: NodeIdNodeMapVec,

    pub allow_multiple_root_nodes: bool,

    pub offset: LogicalPosition,

    pub style: NodeGraphStyle,

    pub callbacks: NodeGraphCallbacks,

    pub add_node_str: AzString,

    pub scale_factor: f32,

}

impl Default for NodeGraph {

}

impl NodeGraph {

    /// Generates a new NodeId that is unique in the graph

        NodeGraphNodeId {

        }

}

/// Maps a [`NodeTypeId`] to its [`NodeTypeInfo`] metadata.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct NodeTypeIdInfoMap {

    pub node_type_id: NodeTypeId,

    pub node_type_info: NodeTypeInfo,

}

impl_option!(NodeTypeIdInfoMap, OptionNodeTypeIdInfoMap, copy = false, [Debug, Clone]);

impl_vec!(NodeTypeIdInfoMap, NodeTypeIdInfoMapVec, NodeTypeIdInfoMapVecDestructor, NodeTypeIdInfoMapVecDestructorType, NodeTypeIdInfoMapVecSlice, OptionNodeTypeIdInfoMap);

impl_vec_clone!(

    NodeTypeIdInfoMap,

    NodeTypeIdInfoMapVec,

    NodeTypeIdInfoMapVecDestructor

);

impl_vec_mut!(NodeTypeIdInfoMap, NodeTypeIdInfoMapVec);

impl_vec_debug!(NodeTypeIdInfoMap, NodeTypeIdInfoMapVec);

/// Maps an [`InputOutputTypeId`] to its [`InputOutputInfo`] metadata.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct InputOutputTypeIdInfoMap {

    pub io_type_id: InputOutputTypeId,

    pub io_info: InputOutputInfo,

}

impl_option!(InputOutputTypeIdInfoMap, OptionInputOutputTypeIdInfoMap, copy = false, [Debug, Clone]);

impl_vec!(InputOutputTypeIdInfoMap, InputOutputTypeIdInfoMapVec, InputOutputTypeIdInfoMapVecDestructor, InputOutputTypeIdInfoMapVecDestructorType, InputOutputTypeIdInfoMapVecSlice, OptionInputOutputTypeIdInfoMap);

impl_vec_clone!(

    InputOutputTypeIdInfoMap,

    InputOutputTypeIdInfoMapVec,

    InputOutputTypeIdInfoMapVecDestructor

);

impl_vec_mut!(InputOutputTypeIdInfoMap, InputOutputTypeIdInfoMapVec);

impl_vec_debug!(InputOutputTypeIdInfoMap, InputOutputTypeIdInfoMapVec);

/// Maps a [`NodeGraphNodeId`] to its [`Node`] data.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct NodeIdNodeMap {

    pub node_id: NodeGraphNodeId,

    pub node: Node,

}

impl_option!(NodeIdNodeMap, OptionNodeIdNodeMap, copy = false, [Debug, Clone]);

impl_vec!(NodeIdNodeMap, NodeIdNodeMapVec, NodeIdNodeMapVecDestructor, NodeIdNodeMapVecDestructorType, NodeIdNodeMapVecSlice, OptionNodeIdNodeMap);

impl_vec_clone!(NodeIdNodeMap, NodeIdNodeMapVec, NodeIdNodeMapVecDestructor);

impl_vec_mut!(NodeIdNodeMap, NodeIdNodeMapVec);

impl_vec_debug!(NodeIdNodeMap, NodeIdNodeMapVec);

#[derive(Debug, Copy, Clone)]

#[repr(C)]

pub enum NodeGraphStyle {

    Default,

    // to be extended

}

/// User-provided callbacks for node graph interaction events.

#[derive(Default, Debug, Clone)]

#[repr(C)]

pub struct NodeGraphCallbacks {

    pub on_node_added: OptionOnNodeAdded,

    pub on_node_removed: OptionOnNodeRemoved,

    pub on_node_dragged: OptionOnNodeDragged,

    pub on_node_graph_dragged: OptionOnNodeGraphDragged,

    pub on_node_connected: OptionOnNodeConnected,

    pub on_node_input_disconnected: OptionOnNodeInputDisconnected,

    pub on_node_output_disconnected: OptionOnNodeOutputDisconnected,

    pub on_node_field_edited: OptionOnNodeFieldEdited,

}

pub type OnNodeAddedCallbackType = extern "C" fn(

    refany: RefAny,

    info: CallbackInfo,

    new_node_type: NodeTypeId,

    new_node_id: NodeGraphNodeId,

    new_node_position: NodeGraphNodePosition,

) -> Update;

impl_widget_callback!(

    OnNodeAdded,

    OptionOnNodeAdded,

    OnNodeAddedCallback,

    OnNodeAddedCallbackType

);

pub type OnNodeRemovedCallbackType =

    extern "C" fn(refany: RefAny, info: CallbackInfo, node_id_to_remove: NodeGraphNodeId) -> Update;

impl_widget_callback!(

    OnNodeRemoved,

    OptionOnNodeRemoved,

    OnNodeRemovedCallback,

    OnNodeRemovedCallbackType

);

pub type OnNodeGraphDraggedCallbackType =

    extern "C" fn(refany: RefAny, info: CallbackInfo, drag_amount: GraphDragAmount) -> Update;

impl_widget_callback!(

    OnNodeGraphDragged,

    OptionOnNodeGraphDragged,

    OnNodeGraphDraggedCallback,

    OnNodeGraphDraggedCallbackType

);

pub type OnNodeDraggedCallbackType = extern "C" fn(

    refany: RefAny,

    info: CallbackInfo,

    node_dragged: NodeGraphNodeId,

    drag_amount: NodeDragAmount,

) -> Update;

impl_widget_callback!(

    OnNodeDragged,

    OptionOnNodeDragged,

    OnNodeDraggedCallback,

    OnNodeDraggedCallbackType

);

pub type OnNodeConnectedCallbackType = extern "C" fn(

    refany: RefAny,

    info: CallbackInfo,

    input: NodeGraphNodeId,

    input_index: usize,

    output: NodeGraphNodeId,

    output_index: usize,

) -> Update;

impl_widget_callback!(

    OnNodeConnected,

    OptionOnNodeConnected,

    OnNodeConnectedCallback,

    OnNodeConnectedCallbackType

);

pub type OnNodeInputDisconnectedCallbackType = extern "C" fn(

    refany: RefAny,

    info: CallbackInfo,

    input: NodeGraphNodeId,

    input_index: usize,

) -> Update;

impl_widget_callback!(

    OnNodeInputDisconnected,

    OptionOnNodeInputDisconnected,

    OnNodeInputDisconnectedCallback,

    OnNodeInputDisconnectedCallbackType

);

pub type OnNodeOutputDisconnectedCallbackType = extern "C" fn(

    refany: RefAny,

    info: CallbackInfo,

    output: NodeGraphNodeId,

    output_index: usize,

) -> Update;

impl_widget_callback!(

    OnNodeOutputDisconnected,

    OptionOnNodeOutputDisconnected,

    OnNodeOutputDisconnectedCallback,

    OnNodeOutputDisconnectedCallbackType

);

pub type OnNodeFieldEditedCallbackType = extern "C" fn(

    refany: RefAny,

    info: CallbackInfo,

    node_id: NodeGraphNodeId,

    field_id: usize,

    node_type: NodeTypeId,

    new_value: NodeTypeFieldValue,

) -> Update;

impl_widget_callback!(

    OnNodeFieldEdited,

    OptionOnNodeFieldEdited,

    OnNodeFieldEditedCallback,

    OnNodeFieldEditedCallbackType

);

/// Unique identifier for an input/output port type.

#[derive(Debug, Copy, Clone, PartialEq, Eq, PartialOrd, Ord, Hash)]

#[repr(C)]

pub struct InputOutputTypeId {

    pub inner: u64,

}

impl_option!(InputOutputTypeId, OptionInputOutputTypeId, copy = false, [Debug, Clone, PartialEq, Eq, PartialOrd, Ord, Hash]);

impl_vec!(InputOutputTypeId, InputOutputTypeIdVec, InputOutputTypeIdVecDestructor, InputOutputTypeIdVecDestructorType, InputOutputTypeIdVecSlice, OptionInputOutputTypeId);

impl_vec_clone!(

    InputOutputTypeId,

    InputOutputTypeIdVec,

    InputOutputTypeIdVecDestructor

);

impl_vec_mut!(InputOutputTypeId, InputOutputTypeIdVec);

impl_vec_debug!(InputOutputTypeId, InputOutputTypeIdVec);

/// Unique identifier for a node type (e.g. "Add", "Multiply").

#[derive(Debug, Copy, Clone, PartialEq, Eq, PartialOrd, Ord, Hash)]

#[repr(C)]

pub struct NodeTypeId {

    pub inner: u64,

}

/// Unique identifier for a node instance within the graph.

#[derive(Debug, Copy, Clone, PartialEq, Eq, PartialOrd, Ord, Hash)]

#[repr(C)]

pub struct NodeGraphNodeId {

    pub inner: u64,

}

/// A single node with typed input/output connections and editable fields.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct Node {

    pub node_type: NodeTypeId,

    pub position: NodeGraphNodePosition,

    pub fields: NodeTypeFieldVec,

    pub connect_in: InputConnectionVec,

    pub connect_out: OutputConnectionVec,

}

/// A key-value field on a node (e.g. a text input labelled "Name").

#[derive(Debug, Clone)]

#[repr(C)]

pub struct NodeTypeField {

    pub key: AzString,

    pub value: NodeTypeFieldValue,

}

impl_option!(NodeTypeField, OptionNodeTypeField, copy = false, [Debug, Clone]);

impl_vec!(NodeTypeField, NodeTypeFieldVec, NodeTypeFieldVecDestructor, NodeTypeFieldVecDestructorType, NodeTypeFieldVecSlice, OptionNodeTypeField);

impl_vec_clone!(NodeTypeField, NodeTypeFieldVec, NodeTypeFieldVecDestructor);

impl_vec_debug!(NodeTypeField, NodeTypeFieldVec);

impl_vec_mut!(NodeTypeField, NodeTypeFieldVec);

/// The value of a node field, determining which widget is rendered.

#[derive(Debug, Clone)]

#[repr(C, u8)]

pub enum NodeTypeFieldValue {

    TextInput(AzString),

    NumberInput(f32),

    CheckBox(bool),

    ColorInput(ColorU),

    FileInput(OptionString),

}

/// An input port's connections to one or more output ports on other nodes.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct InputConnection {

    pub input_index: usize,

    pub connects_to: OutputNodeAndIndexVec,

}

impl_option!(InputConnection, OptionInputConnection, copy = false, [Debug, Clone]);

impl_vec!(InputConnection, InputConnectionVec, InputConnectionVecDestructor, InputConnectionVecDestructorType, InputConnectionVecSlice, OptionInputConnection);

impl_vec_clone!(

    InputConnection,

    InputConnectionVec,

    InputConnectionVecDestructor

);

impl_vec_debug!(InputConnection, InputConnectionVec);

impl_vec_mut!(InputConnection, InputConnectionVec);

/// Reference to a specific output port on a node.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct OutputNodeAndIndex {

    pub node_id: NodeGraphNodeId,

    pub output_index: usize,

}

impl_option!(OutputNodeAndIndex, OptionOutputNodeAndIndex, copy = false, [Debug, Clone]);

impl_vec!(OutputNodeAndIndex, OutputNodeAndIndexVec, OutputNodeAndIndexVecDestructor, OutputNodeAndIndexVecDestructorType, OutputNodeAndIndexVecSlice, OptionOutputNodeAndIndex);

impl_vec_clone!(

    OutputNodeAndIndex,

    OutputNodeAndIndexVec,

    OutputNodeAndIndexVecDestructor

);

impl_vec_debug!(OutputNodeAndIndex, OutputNodeAndIndexVec);

impl_vec_mut!(OutputNodeAndIndex, OutputNodeAndIndexVec);

/// An output port's connections to one or more input ports on other nodes.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct OutputConnection {

    pub output_index: usize,

    pub connects_to: InputNodeAndIndexVec,

}

impl_option!(OutputConnection, OptionOutputConnection, copy = false, [Debug, Clone]);

impl_vec!(OutputConnection, OutputConnectionVec, OutputConnectionVecDestructor, OutputConnectionVecDestructorType, OutputConnectionVecSlice, OptionOutputConnection);

impl_vec_clone!(

    OutputConnection,

    OutputConnectionVec,

    OutputConnectionVecDestructor

);

impl_vec_debug!(OutputConnection, OutputConnectionVec);

impl_vec_mut!(OutputConnection, OutputConnectionVec);

/// Reference to a specific input port on a node.

#[derive(Debug, Clone, PartialEq)]

#[repr(C)]

pub struct InputNodeAndIndex {

    pub node_id: NodeGraphNodeId,

    pub input_index: usize,

}

impl_option!(InputNodeAndIndex, OptionInputNodeAndIndex, copy = false, [Debug, Clone]);

impl_vec!(InputNodeAndIndex, InputNodeAndIndexVec, InputNodeAndIndexVecDestructor, InputNodeAndIndexVecDestructorType, InputNodeAndIndexVecSlice, OptionInputNodeAndIndex);

impl_vec_clone!(

    InputNodeAndIndex,

    InputNodeAndIndexVec,

    InputNodeAndIndexVecDestructor

);

impl_vec_debug!(InputNodeAndIndex, InputNodeAndIndexVec);

impl_vec_mut!(InputNodeAndIndex, InputNodeAndIndexVec);

/// Metadata describing a node type and its I/O port configuration.

#[derive(Debug, Clone)]

#[repr(C)]

pub struct NodeTypeInfo {

    /// Whether this node type is a "root" type

    pub is_root: bool,

    /// Name of the node type

    pub node_type_name: AzString,

    /// List of inputs for this node

    pub inputs: InputOutputTypeIdVec,

    /// List of outputs for this node

    pub outputs: InputOutputTypeIdVec,

}

/// Display metadata for an input/output port type (name and color).

#[derive(Debug, Clone)]

#[repr(C)]

pub struct InputOutputInfo {

    /// Data type of this input / output

    pub data_type: AzString,

    /// Which color to use for the input / output

    pub color: ColorU,

}

/// Things only relevant to the display of the node in an interactive editor

/// - such as x and y position in the node graph, name, etc.

#[derive(Debug, Copy, Clone)]

#[repr(C)]

pub struct NodeGraphNodePosition {

    /// X Position of the node

    pub x: f32,

    /// Y Position of the node

    pub y: f32,

}

#[derive(Debug, Copy, Clone, PartialEq, Eq)]

#[repr(C)]

pub enum NodeGraphError {

    /// MIME type is not the same (for example: connection "spatialdata/point"

    /// with a node that expects "spatialdata/line")

    NodeMimeTypeMismatch,

    /// Invalid index when accessing a node in / output

    NodeInvalidIndex,

    /// The in-/ output matching encountered a non-existing hash to a node that doesn't exist

    NodeInvalidNode,

    /// Root node is missing from the graph tree

    NoRootNode,

}

impl fmt::Display for NodeGraphError {

        use self::NodeGraphError::*;

        }

}

/// Amount (in logical pixels) the entire graph was dragged.

#[derive(Debug, Copy, Clone, PartialEq)]

#[repr(C)]

pub struct GraphDragAmount {

    pub x: f32,

    pub y: f32,

}

/// Amount (in logical pixels) a single node was dragged.

#[derive(Debug, Copy, Clone, PartialEq)]

#[repr(C)]

pub struct NodeDragAmount {

    pub x: f32,

    pub y: f32,

}

impl NodeGraph {

    /// Connects the current nodes input with another nodes output

    ///

    /// ## Inputs

    ///

    /// - `output_node_id`: The ID of the output node (index in the NodeGraphs internal BTree)

    /// - `output_index`: The index of the output *on the output node*

    /// - `input_node_id`: Same as output_node_id, but for the input node

    /// - `input_index`: Same as output_index, but for the input node

    ///

    /// ## Returns

    ///

    /// One of:

    ///

    /// - `NodeGraphError::NodeInvalidNode`: One of the input nodes does not exist

    /// - `NodeGraphError::NodeInvalidIndex`: One node has an invalid `output` or `input` index

    /// - `NodeGraphError::NodeMimeTypeMismatch`: The types of two connected `outputs` and `inputs`

    ///   aren't the same

    /// - `Ok(())`: The connection was established successfully.

        // Verify that the node type of the connection matches

        let _ =

        // connect input -> output

        {

            }

        } else {

        }

        // connect output -> input

        {

            }

        } else {

        }

    /// Disconnect an input if it is connected to an output

    ///

    /// # Inputs

    ///

    /// - `input_node_id`: The ID of the input node (index in the NodeGraphs internal BTree)

    /// - `input_index`: The index of the input *on the input node*

    ///

    /// # Returns

    ///

    /// - `Err(NodeGraphError::NodeInvalidNode)`: The node at index `input_node_id` does not

    ///   exist

    /// - `Err(NodeGraphError::NodeInvalidIndex)`: One node has an invalid `input` or `output`

    ///   index

    /// - `Err(NodeGraphError::NodeMimeTypeMismatch)`: The types of two connected `input` and

    ///   `output` do not match

    /// - `Ok(())`: The disconnection completed successfully.

            {

            }

        };

        // for every output that this input was connected to...

        for OutputNodeAndIndex {

        {

            // verify that the node type of the connection matches

            // disconnect input -> output

            {

            } else {

            }

            {

            } else {

            }

        }

    /// Disconnect an output if it is connected to an input

    ///

    /// # Inputs

    ///

    /// - `output_node_id`: The ID of the output node (index in the NodeGraphs internal BTree)

    /// - `output_index`: The index of the output *on the output node*

    ///

    /// # Returns

    ///

    /// - `Err(NodeGraphError::NodeInvalidNode)`: The node at index `output_node_id` does not exist

    /// - `Err(NodeGraphError::NodeInvalidIndex)`: One node has an invalid `input` or `output` index

    /// - `Err(NodeGraphError::NodeMimeTypeMismatch)`: The types of two connected `input` and

    ///   `output` do not match

    /// - `Ok(())`: The disconnection completed successfully.

            {

            }

        };

        for InputNodeAndIndex {

        {

            // verify that the node type of the connection matches

            {

            } else {

            }

            {

            } else {

            }

        }

    /// Verifies that the node types of two connections match

        // Input / Output do not have the same TypeId

        static NODEGRAPH_CLASS: &[IdOrClass] = &[Class(AzString::from_const_str("nodegraph"))];

        static NODEGRAPH_BACKGROUND: &[StyleBackgroundContent] = &[StyleBackgroundContent::Image(

            AzString::from_const_str("nodegraph-background"),

        )];

        static NODEGRAPH_NODES_CONTAINER_CLASS: &[IdOrClass] =

            &[Class(AzString::from_const_str("nodegraph-nodes-container"))];

        static NODEGRAPH_NODES_CONTAINER_PROPS: &[CssPropertyWithConditions] = &[

            CssPropertyWithConditions::simple(CssProperty::flex_grow(LayoutFlexGrow::const_new(1))),

            CssPropertyWithConditions::simple(CssProperty::position(LayoutPosition::Absolute)),

        ];

            )),

            )),

            )),

        ];

        ];

                            |NodeTypeIdInfoMap {

                                 node_type_id,

                                 node_type_info,

                        )

                ),

            )]

        );

                        ]

                    )

                            // connections

                            // nodes

                                ))

                                )),

                        ]

                    })]

            )

}

// dataset set on the top-level nodegraph node,

// containing all the state of the node graph

struct NodeGraphLocalDataset {

    node_graph: NodeGraph,

    last_input_or_output_clicked: Option<(NodeGraphNodeId, InputOrOutput)>,

    // Ref<NodeLocalDataSet> - used as a marker for getting the visual node ID

    active_node_being_dragged: Option<(NodeGraphNodeId, RefAny)>,

    node_connection_marker: RefAny, // Ref<NodeConnectionMarkerDataset>

    callbacks: NodeGraphCallbacks,

}

struct ContextMenuEntryLocalDataset {

    node_type: NodeTypeId,

    backref: RefAny, // RefAny<NodeGraphLocalDataset>

}

struct NodeConnectionMarkerDataset {}

struct NodeLocalDataset {

    node_id: NodeGraphNodeId,

    backref: RefAny, // RefAny<NodeGraphLocalDataset>

}

#[derive(Debug, Copy, Clone)]

enum InputOrOutput {

    Input(usize),

    Output(usize),

}

struct NodeInputOutputLocalDataset {

    io_id: InputOrOutput,

    backref: RefAny, // RefAny<NodeLocalDataset>

}

struct NodeFieldLocalDataset {

    field_idx: usize,

    backref: RefAny, // RefAny<NodeLocalDataset>

}

#[derive(Copy, Clone)]

struct ConnectionLocalDataset {

    out_node_id: NodeGraphNodeId,

    out_idx: usize,

    in_node_id: NodeGraphNodeId,

    in_idx: usize,

    swap_vert: bool,

    swap_horz: bool,

    color: ColorU,

}

    use azul_core::dom::{

        CssPropertyWithConditions, CssPropertyWithConditionsVec, Dom, DomVec, IdOrClass,

        IdOrClass::Class, IdOrClassVec,

    };

    use azul_css::*;

    const STRING_9416190750059025162: AzString = AzString::from_const_str("Material Icons");

    const STRING_16146701490593874959: AzString = AzString::from_const_str("system:ui");

    const STYLE_BACKGROUND_CONTENT_524016094839686509_ITEMS: &[StyleBackgroundContent] =

        &[StyleBackgroundContent::Color(ColorU {

            r: 34,

            g: 34,

            b: 34,

            a: 255,

        })];

    const STYLE_BACKGROUND_CONTENT_10430246856047584562_ITEMS: &[StyleBackgroundContent] =

        &[StyleBackgroundContent::LinearGradient(LinearGradient {

            direction: Direction::FromTo(DirectionCorners {

                dir_from: DirectionCorner::Left,

                dir_to: DirectionCorner::Right,

            }),

            extend_mode: ExtendMode::Clamp,

            stops: NormalizedLinearColorStopVec::from_const_slice(

                LINEAR_COLOR_STOP_4373556077110009258_ITEMS,

            ),

        })];

    const STYLE_BACKGROUND_CONTENT_11535310356736632656_ITEMS: &[StyleBackgroundContent] =

        &[StyleBackgroundContent::RadialGradient(RadialGradient {

            shape: Shape::Ellipse,

            extend_mode: ExtendMode::Clamp,

            position: StyleBackgroundPosition {

                horizontal: BackgroundPositionHorizontal::Left,

                vertical: BackgroundPositionVertical::Top,

            },

            size: RadialGradientSize::FarthestCorner,

            stops: NormalizedLinearColorStopVec::from_const_slice(

                LINEAR_COLOR_STOP_15596411095679453272_ITEMS,

            ),

        })];

    const STYLE_BACKGROUND_CONTENT_11936041127084538304_ITEMS: &[StyleBackgroundContent] =

        &[StyleBackgroundContent::LinearGradient(LinearGradient {

            direction: Direction::FromTo(DirectionCorners {

                dir_from: DirectionCorner::Right,

                dir_to: DirectionCorner::Left,

            }),

            extend_mode: ExtendMode::Clamp,

            stops: NormalizedLinearColorStopVec::from_const_slice(

                LINEAR_COLOR_STOP_4373556077110009258_ITEMS,

            ),

        })];

    const STYLE_BACKGROUND_CONTENT_15813232491335471489_ITEMS: &[StyleBackgroundContent] =

        &[StyleBackgroundContent::Color(ColorU {

            r: 0,

            g: 0,

            b: 0,

            a: 85,

        })];

    const STYLE_BACKGROUND_CONTENT_17648039690071193942_ITEMS: &[StyleBackgroundContent] =

        &[StyleBackgroundContent::LinearGradient(LinearGradient {

            direction: Direction::FromTo(DirectionCorners {

                dir_from: DirectionCorner::Top,

                dir_to: DirectionCorner::Bottom,

            }),

            extend_mode: ExtendMode::Clamp,

            stops: NormalizedLinearColorStopVec::from_const_slice(

                LINEAR_COLOR_STOP_7397113864565941600_ITEMS,

            ),

        })];

    const STYLE_TRANSFORM_347117342922946953_ITEMS: &[StyleTransform] =

        &[StyleTransform::Translate(StyleTransformTranslate2D {

            x: PixelValue::const_px(200),

            y: PixelValue::const_px(100),

        })];

    const STYLE_TRANSFORM_14683950870521466298_ITEMS: &[StyleTransform] =

        &[StyleTransform::Translate(StyleTransformTranslate2D {

            x: PixelValue::const_px(240),

            y: PixelValue::const_px(-10),

        })];

    const STYLE_FONT_FAMILY_8122988506401935406_ITEMS: &[StyleFontFamily] =

        &[StyleFontFamily::System(STRING_16146701490593874959)];

    const STYLE_FONT_FAMILY_11383897783350685780_ITEMS: &[StyleFontFamily] =

        &[StyleFontFamily::System(STRING_9416190750059025162)];

    const LINEAR_COLOR_STOP_4373556077110009258_ITEMS: &[NormalizedLinearColorStop] = &[

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(20),

            color: ColorOrSystem::color(ColorU {

                r: 0,

                g: 0,

                b: 0,

                a: 204,

            }),

        },

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(100),

            color: ColorOrSystem::color(ColorU {

                r: 0,

                g: 0,

                b: 0,

                a: 0,

            }),

        },

    ];

    const LINEAR_COLOR_STOP_7397113864565941600_ITEMS: &[NormalizedLinearColorStop] = &[

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(0),

            color: ColorOrSystem::color(ColorU {

                r: 229,

                g: 57,

                b: 53,

                a: 255,

            }),

        },

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(100),

            color: ColorOrSystem::color(ColorU {

                r: 227,

                g: 93,

                b: 91,

                a: 255,

            }),

        },

    ];

    const LINEAR_COLOR_STOP_15596411095679453272_ITEMS: &[NormalizedLinearColorStop] = &[

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(0),

            color: ColorOrSystem::color(ColorU {

                r: 47,

                g: 49,

                b: 54,

                a: 255,

            }),

        },

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(50),

            color: ColorOrSystem::color(ColorU {

                r: 47,

                g: 49,

                b: 54,

                a: 255,

            }),

        },

        NormalizedLinearColorStop {

            offset: PercentageValue::const_new(100),

            color: ColorOrSystem::color(ColorU {

                r: 32,

                g: 34,

                b: 37,

                a: 255,

            }),

        },

    ];

    const CSS_MATCH_10339190304804100510_PROPERTIES: &[CssPropertyWithConditions] = &[

        // .node_output_wrapper

        CssPropertyWithConditions::simple(CssProperty::Display(LayoutDisplayValue::Exact(

            LayoutDisplay::Flex,

        ))),

        CssPropertyWithConditions::simple(CssProperty::FlexDirection(

            LayoutFlexDirectionValue::Exact(LayoutFlexDirection::Column),

        )),

        CssPropertyWithConditions::simple(CssProperty::Left(LayoutLeftValue::Exact(LayoutLeft {

            inner: PixelValue::const_px(0),

        }))),

        CssPropertyWithConditions::simple(CssProperty::OverflowX(LayoutOverflowValue::Exact(

            LayoutOverflow::Visible,

        ))),

        CssPropertyWithConditions::simple(CssProperty::OverflowY(LayoutOverflowValue::Exact(

            LayoutOverflow::Visible,

        ))),

        CssPropertyWithConditions::simple(CssProperty::Position(LayoutPositionValue::Exact(

            LayoutPosition::Absolute,

        ))),

    ];

    const CSS_MATCH_10339190304804100510: CssPropertyWithConditionsVec =

        CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_10339190304804100510_PROPERTIES);

    const CSS_MATCH_11452431279102104133_PROPERTIES: &[CssPropertyWithConditions] = &[

        // .node_input_connection_label

        CssPropertyWithConditions::simple(CssProperty::FontFamily(StyleFontFamilyVecValue::Exact(

            StyleFontFamilyVec::from_const_slice(STYLE_FONT_FAMILY_8122988506401935406_ITEMS),

        ))),

        CssPropertyWithConditions::simple(CssProperty::FontSize(StyleFontSizeValue::Exact(

            StyleFontSize {

                inner: PixelValue::const_px(12),

            },

        ))),

        CssPropertyWithConditions::simple(CssProperty::Height(LayoutHeightValue::Exact(

            LayoutHeight::Px(PixelValue::const_px(15)),

        ))),

        CssPropertyWithConditions::simple(CssProperty::TextAlign(StyleTextAlignValue::Exact(

            StyleTextAlign::Right,

        ))),

        CssPropertyWithConditions::simple(CssProperty::Width(LayoutWidthValue::Exact(

            LayoutWidth::Px(PixelValue::const_px(100)),

        ))),

    ];

    const CSS_MATCH_11452431279102104133: CssPropertyWithConditionsVec =

        CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_11452431279102104133_PROPERTIES);

    const CSS_MATCH_1173826950760010563_PROPERTIES: &[CssPropertyWithConditions] = &[

        // .node_configuration_field_value:focus

        CssPropertyWithConditions::simple(CssProperty::BorderTopColor(

            StyleBorderTopColorValue::Exact(StyleBorderTopColor {

                inner: ColorU {

                    r: 0,

                    g: 131,

                    b: 176,

                    a: 119,

                },

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderRightColor(

            StyleBorderRightColorValue::Exact(StyleBorderRightColor {

                inner: ColorU {

                    r: 0,

                    g: 131,

                    b: 176,

                    a: 119,

                },

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(

            StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {

                inner: ColorU {

                    r: 0,

                    g: 131,

                    b: 176,

                    a: 119,

                },

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(

            StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {

                inner: ColorU {

                    r: 0,

                    g: 131,

                    b: 176,

                    a: 119,

                },

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(

            StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {

                inner: BorderStyle::Solid,

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(

            StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {

                inner: BorderStyle::Solid,

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(

            StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {

                inner: BorderStyle::Solid,

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(

            StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {

                inner: BorderStyle::Solid,

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(

            LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {

                inner: PixelValue::const_px(1),

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(

            LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {

                inner: PixelValue::const_px(1),

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(

            LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {

                inner: PixelValue::const_px(1),

            }),

        )),

        CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(

            LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {

                inner: PixelValue::const_px(1),