package html_of_jsx

  1. Overview
  2. Docs
Render HTML with JSX

Install 

dune-project
 Dependency

github.com Readme Changelog MIT License Edit opam file Versions (6)

Authors

  1. D
    David Sancho <dsnxmoreno@gmail.com>

Maintainers

  1. D
    David Sancho <dsnxmoreno@gmail.com>

Sources

html_of_jsx-0.0.6.tbz
sha256=7f4aeaaa9df466b72ab2bf14bcc1b908789c67187781cb4c78ee5eb7d22697d8
sha512=31ef6fa8e80dac79d8806c08a64a5cb600f703309417bff917bfc8a6b72237383493eb3c13aade3059b17f0e3102aeba9cb358934c6f1541749ea9443037d791

doc/html_of_jsx/JSX/index.html

Module JSXSource

JSX module

The JSX module provides a set of functions and render HTML elements in a declarative manner, similar to JSX in Reason or React.js.

  let html: string = JSX.render(
    <div>
      <h1> {JSX.string("Hello, World!")} </h1>
    </div>
  );
Sourcetype element

An abstract type that represents a JSX.element

Sourceval render : element -> string

Render a JSX.element as a string.

This function takes a JSX.element and converts it into its corresponding HTML string representation.

  let html: string = JSX.render(
    <div>
      <h1> {JSX.string("Hello, World!")} </h1>
    </div>
  );

  Printf.printf "%s" html; /* <div><h1>Hello, World!</h1></div> */
Sourceval float : float -> element

Helper to render a float.

This function helps in rendering a float value as a JSX element.

  let element : JSX.element = JSX.float 3.14
Sourceval fragment : element list -> element
  • deprecated Use JSX.list instead
Sourceval int : int -> element

Helper to render an integer.

This function helps in rendering an integer value as a JSX element.

  let element : JSX.element = JSX.int 42
Sourceval list : element list -> element

Helper to render a list of elements.

This function takes a list of JSX elements and returns a single JSX element that contains all of them. This is useful for rendering dynamic lists of elements.

  let element : JSX.element =
    JSX.list
      [ JSX.string "Item 1"; JSX.string "Item 2"; JSX.string "Item 3" ]
Sourcetype attribute = string * [ `Bool of bool | `Int of int | `Float of float | `String of string ]

Represents an attribute of an HTML element. It consists of a name and a value which can be of several types.

This is used by the ppx to create the attributes of the HTML element, and rarely used directly.

Sourceval node : string -> attribute list -> element list -> element

The function to create an HTML DOM Node.

It takes a tag name, a list of attributes, and a list of child elements to create an HTML node.

  let link : JSX.element =
    JSX.node
      ( "a",
        [ ("href", `String "https://ocaml.org") ],
        [ JSX.string "OCaml" ] )
Sourceval null : element

Helper to represent nullability in JSX.

This is useful to represent and pattern match against null or empty elements.

  let element : JSX.element = JSX.null
Sourceval string : string -> element

Helper to represent an element as a string.

This function allows you to directly render a string as a JSX element.

  let element : JSX.element = JSX.string "Hello, World!"
Sourceval text : string -> element

A deprecated function to render a text string.

This function is deprecated in favor of JSX.string.

  let element : JSX.element = JSX.text "Hello, World!"
  • deprecated Use JSX.string instead
Sourceval unsafe : string -> element

Helper to bypass HTML encoding and treat output as unsafe. This can lead to HTML escaping problems, XSS injections, and other security concerns. Use with caution.

A common use case for bypassing the HTML encoding is to render a script o style tag.

  let content: string = "Raw HTML" in
  let script: JSX.element = <script> content </script>
Sourcemodule Debug : sig ... end