//go:build js && wasm package ui import ( "fmt" "syscall/js" "git.flowmade.one/flowmade-one/iris/internal/element" ) const svgNS = "http://www.w3.org/2000/svg" // SVG creates an SVG container element func SVG() SVGElement { e := element.NewElementNS(svgNS, "svg") return SVGElement{e} } // SVGElement wraps an SVG element type SVGElement struct { e element.Element } // Attr sets an attribute on the SVG element func (s SVGElement) Attr(name, value string) SVGElement { s.e.Attr(name, value) return s } // Width sets the width attribute func (s SVGElement) Width(value string) SVGElement { s.e.Attr("width", value) return s } // Height sets the height attribute func (s SVGElement) Height(value string) SVGElement { s.e.Attr("height", value) return s } // Position sets CSS position func (s SVGElement) Position(pos string) SVGElement { s.e.Position(pos) return s } // Left sets CSS left func (s SVGElement) Left(value string) SVGElement { s.e.Left(value) return s } // Top sets CSS top func (s SVGElement) Top(value string) SVGElement { s.e.Top(value) return s } // PointerEvents sets CSS pointer-events func (s SVGElement) PointerEvents(value string) SVGElement { s.e.PointerEvents(value) return s } // Child adds a child SVG element func (s SVGElement) ChildSVG(child SVGElement) SVGElement { s.e.Child(child.e) return s } // ClearChildren removes all children func (s SVGElement) ClearChildren() SVGElement { s.e.ClearChildren() return s } // ToView converts the SVG element to a View (for embedding in layouts) func (s SVGElement) ToView() View { return View{s.e} } // SVGDefs creates a defs element func SVGDefs() SVGElement { return SVGElement{element.NewElementNS(svgNS, "defs")} } // SVGMarker creates a marker element for arrowheads func SVGMarker(id string) SVGElement { e := element.NewElementNS(svgNS, "marker") e.Attr("id", id) return SVGElement{e} } // MarkerWidth sets marker width func (s SVGElement) MarkerWidth(value string) SVGElement { s.e.Attr("markerWidth", value) return s } // MarkerHeight sets marker height func (s SVGElement) MarkerHeight(value string) SVGElement { s.e.Attr("markerHeight", value) return s } // RefX sets refX func (s SVGElement) RefX(value string) SVGElement { s.e.Attr("refX", value) return s } // RefY sets refY func (s SVGElement) RefY(value string) SVGElement { s.e.Attr("refY", value) return s } // Orient sets orient func (s SVGElement) Orient(value string) SVGElement { s.e.Attr("orient", value) return s } // MarkerUnits sets markerUnits func (s SVGElement) MarkerUnits(value string) SVGElement { s.e.Attr("markerUnits", value) return s } // SVGPath creates a path element func SVGPath(d string) SVGElement { e := element.NewElementNS(svgNS, "path") e.Attr("d", d) return SVGElement{e} } // Fill sets fill color func (s SVGElement) Fill(color string) SVGElement { s.e.Attr("fill", color) return s } // Stroke sets stroke color func (s SVGElement) Stroke(color string) SVGElement { s.e.Attr("stroke", color) return s } // StrokeWidth sets stroke width func (s SVGElement) StrokeWidth(value string) SVGElement { s.e.Attr("stroke-width", value) return s } // StrokeDasharray sets stroke dash pattern func (s SVGElement) StrokeDasharray(value string) SVGElement { s.e.Attr("stroke-dasharray", value) return s } // MarkerEnd sets the end marker func (s SVGElement) MarkerEnd(value string) SVGElement { s.e.Attr("marker-end", value) return s } // SVGLine creates a line element func SVGLine(x1, y1, x2, y2 float64) SVGElement { e := element.NewElementNS(svgNS, "line") e.Attr("x1", fmt.Sprintf("%f", x1)) e.Attr("y1", fmt.Sprintf("%f", y1)) e.Attr("x2", fmt.Sprintf("%f", x2)) e.Attr("y2", fmt.Sprintf("%f", y2)) return SVGElement{e} } // SVGRect creates a rect element func SVGRect(x, y, width, height float64) SVGElement { e := element.NewElementNS(svgNS, "rect") e.Attr("x", fmt.Sprintf("%f", x)) e.Attr("y", fmt.Sprintf("%f", y)) e.Attr("width", fmt.Sprintf("%f", width)) e.Attr("height", fmt.Sprintf("%f", height)) return SVGElement{e} } // SVGCircle creates a circle element func SVGCircle(cx, cy, r float64) SVGElement { e := element.NewElementNS(svgNS, "circle") e.Attr("cx", fmt.Sprintf("%f", cx)) e.Attr("cy", fmt.Sprintf("%f", cy)) e.Attr("r", fmt.Sprintf("%f", r)) return SVGElement{e} } // SVGText creates a text element func SVGText(text string, x, y float64) SVGElement { e := element.NewElementNS(svgNS, "text") e.Attr("x", fmt.Sprintf("%f", x)) e.Attr("y", fmt.Sprintf("%f", y)) e.Text(text) return SVGElement{e} } // SVGGroup creates a g (group) element func SVGGroup() SVGElement { return SVGElement{element.NewElementNS(svgNS, "g")} } // OnClick adds a click handler to the SVG element func (s SVGElement) OnClick(fn func()) SVGElement { s.e.On("click", fn) return s } // OnClickWithEvent adds a click handler with event access func (s SVGElement) OnClickWithEvent(fn func(js.Value)) SVGElement { s.e.OnWithEvent("click", fn) return s } // DataAttr sets a data attribute (data-{name}="{value}") func (s SVGElement) DataAttr(name, value string) SVGElement { s.e.Attr("data-"+name, value) return s } // ID sets the id attribute func (s SVGElement) ID(id string) SVGElement { s.e.Attr("id", id) return s } // Cursor sets the CSS cursor property func (s SVGElement) Cursor(value string) SVGElement { s.e.Cursor(value) return s } // FontSize sets the font-size attribute func (s SVGElement) FontSize(value string) SVGElement { s.e.Attr("font-size", value) return s } // FontFamily sets the font-family attribute func (s SVGElement) FontFamily(value string) SVGElement { s.e.Attr("font-family", value) return s } // TextAnchor sets the text-anchor attribute (start, middle, end) func (s SVGElement) TextAnchor(value string) SVGElement { s.e.Attr("text-anchor", value) return s } // DominantBaseline sets the dominant-baseline attribute func (s SVGElement) DominantBaseline(value string) SVGElement { s.e.Attr("dominant-baseline", value) return s }