BoxBox

BoxBox[expr_Boxes | _String, decorator_, opts___]

is a low-level box used to decorate expr visibly with custom HTML/JS elements in StandardForm.

This is used by Ket, Frame, Style and other editable decorations

the expression is editable
a common WL editor is spawned inside
only the container of the editor can be decorated (see Head)

decorator must be a frontend symbol (i.e., executed by WLJS Interpreter) and must be defined in advance

Options

`Head`

Provides the head symbol of the wrapper expression, which will be hidden from the inner editor. It comes in handy when you need to preserve the original form of the expression during editing

Use Head option to keep the wrapping expression

`"String"`

Default is false. If it is set to True, double quotes will be cut and a simplified version of a widget will be used.

`"HeadString"`

Only works if "String" -> True. Specifies the opening sequence of a string that will not be shown in the view.

`"TailString"`

Only works if "String" -> True. The same as above, but for the ending sequence.

Examples

Change the display value and call arbitrary WLJS function

This is a dummy example

special /: MakeBoxes[special, StandardForm] := BoxBox["1+1", Alert["Hi"]]

special

Note that here Alert is a JavaScript function that lives only on the frontend (see Alert).

Styling expression using JS

You can define your own style for cell boxes. The visible DOM element with an expression in it is provided as element property of env object:

.js
core.MyStyler = async (args, env) => {
  env.element.style.boxShadow = "1px 1px 5px black";
}

wrapper /: MakeBoxes[wrapper[expr_], StandardForm] := With[{
  b = MakeBoxes[expr, StandardForm]
},
  BoxBox[b, MyStyler, Head->wrapper]
]

and then try

wrapper[1/2]

The neat thing is that you can edit the inner expression

Supported output forms

StandardForm

BoxBox

On this page