SPHPlayground API
sphplayground sphplayground

HTML component factories

HTML component factories ease the process of building visual layouts with SPHPlayground.

Tags: A General component factory

SPHPlayground implements almost all HTML tags as PHP classes and thus the Tags factory can ofcourse create them.

Tags::a(?string $href = null, Stringable|string|int|float|null $content = null, ?string $target = null):A
HTML tag:<a>
Tags::nav(Stringable|string|int|float|null $content = null):Nav
HTML tag:<nav>
Tags::map(string $name):Map
HTML tag:<map name="foo">
Tags::rectangle(int $x1 = 0, int $y1 = 0, int $x2 = 0, int $y2 = 0):Rectangle
HTML tag:<area shape="rect" coords="x1,y1,x2,y2">
Tags::polygon(int ... $coord):Polygon
HTML tag:<area coords="" shape="poly">
Tags::circle(int $x = 0, int $y = 0, int $radius = 0):Circle
HTML tag:<area shape="circle" coords="x,y,radius">

Tags::html(?Head $head = null, ?Body $body = null):Html
HTML tag:<html>
Tags::body(Stringable|string|int|float|null $content = null):Body
HTML tag:<body>
Tags::template(Stringable|string|int|float|null $content = null):Template
HTML tag:<template>

Tags::form(?string $action = null, ?string $method = null, Stringable|string|int|float|null $content = null):Form
HTML tag:<form>
Tags::label(Stringable|string|int|float|null $content = null, Labelable|string|null $for = null):Label
HTML tag:<label>
Tags::legend(Stringable|string|int|float|null $content = null):Legend
HTML tag:<legend>
Tags::fieldset(Stringable|string|int|float|null $content = null, Legend|string|null $legend = null):Fieldset
HTML tag:<fieldset>
Tags::pushButton(Stringable|string|null $content = null, ?string $name = null, string|int|float|null $value = null):PushButton
HTML tag:<button type="button">
Tags::resetButton(Stringable|string|null $content = null, ?string $name = null, string|int|float|null $value = null):ResetButton
HTML tag:<button type="reset">
Tags::submitButton(Stringable|string|null $content = null, ?string $name = null, string|int|float|null $value = null):SubmitButton
HTML tag:<button type="submit">
Tags::resetInput(?string $content = null):ResetInput
HTML tag:<input type="reset">
Tags::submitInput(string|int|float|null $value = null, ?string $name = null):SubmitInput
HTML tag:<input type="submit">
Tags::hiddenInput(?string $name = null, string|int|float|null $value = null):HiddenInput
HTML tag:<input type="hidden">
Tags::textInput(?string $name = null, string|int|float|null $value = null):TextInput
HTML tag:<input type="text">
Tags::emailInput(?string $name = null, ?string $value = null):EmailInput
HTML tag:<input type="email">
Tags::telephoneInput(?string $name = null, ?string $value = null):TelephoneInput
HTML tag:<input type="tel">
Tags::passwordInput(?string $name = null, ?string $value = null):PasswordInput
HTML tag:<input type="password">
Tags::radioInput(?string $name = null, string|int|float|null $value = null, bool $checked = false):Radiobox
HTML tag:<input type="radio">
Tags::checkbox(?string $name = null, string|int|float|null $value = null, bool $checked = false):Checkbox
HTML tag:<input type="checkbox">
Tags::numberInput(?string $name = null, string|int|float|null $value = null):NumberInput
HTML tag:<input type="number">
Tags::textarea(?string $name = null, string|int|float|null $content = null):Textarea
HTML tag:<textarea>
Tags::select(?string $name = null, ?iterable $options = null):Select
HTML tag:<select>
Tags::optgroup(?string $label = null):Optgroup
HTML tag:<optgroup>
Tags::datalist(Option|string|int|float ... $option):Datalist
HTML tag:<datalist>
Tags::option(string|int|float|null $value = null, string|int|float|null $content = null):Option
HTML tag:<option>
Tags::meter(float $min = 0.0, float $max = 1.0, ?float $low = null, ?float $high = null, ?float $optimum = null):Meter
HTML tag:<meter>
Tags::output(?string $name = null, string|int|float|null $value = null):Output
HTML tag:<output>
Tags::progress(?float $max = 1.0, ?float $value = null):Progress
HTML tag:<progress>

Tags::div(Stringable|string|int|float|null $content = null):Div
HTML tag:<div>
Tags::main(Stringable|string|int|float|null $content = null):Main
HTML tag:<main>
Tags::header(Stringable|string|int|float|null $content = null):Header
HTML tag:<header>
Tags::section(Stringable|string|int|float|null $content = null):Section
HTML tag:<section>
Tags::article(Stringable|string|int|float|null $content = null):Article
HTML tag:<article>
Tags::aside(Stringable|string|int|float|null $content = null):Aside
HTML tag:<aside>
Tags::footer(Stringable|string|int|float|null $content = null):Footer
HTML tag:<footer>

Tags::head():Head
HTML tag:<head>
Tags::title(string $title):Title
HTML tag:<title>
Tags::base(?string $href, ?string $target = null):Base
HTML tag:<base>
Tags::style(?string $css = null, ?string $media = null):Style
HTML tag:<style>
Tags::link(string $rel, string $href):Link
HTML tag:<link>

Tags::ul():Ul
HTML tag:<ul>
Tags::ol():Ol
HTML tag:<ol>
Tags::li(Stringable|string|int|float|null $content = null):Li
HTML tag:<li>
Tags::dl():Dl
HTML tag:<dl>
Tags::dt(Stringable|string|int|float|null $content = null):Dt
HTML tag:<dt>
Tags::dd(Stringable|string|int|float|null $content = null):Dd
HTML tag:<dd>

Tags::externalScript(string $src):ExternalScript
HTML tag:<script src="foo">
Tags::inlineScript(?string $code = null):InlineScript
HTML tag:<script>
Tags::noscript(Stringable|string|int|float|null $content = null):Noscript
HTML tag:<noscript>

Tags::img(string $src = '', string $alt = ''):Img
HTML tag:<img>
Tags::picture(Img|string|null $img = null, Source ... $source):Picture
HTML tag:<picture>
Tags::figure(Img|string|null $img = null, Stringable|string|null $caption = null):Figure
HTML tag:<figure>
Tags::figcaption(Stringable|string|null $caption = null):FigCaption
HTML tag:<figcaption>
Tags::canvas():Canvas
HTML tag:<canvas>

Tags::iframe(?string $src = null):Iframe
HTML tag:<iframe>
Tags::embed(?string $src = null, ?string $type = null):Embed
HTML tag:<embed>
Tags::audio():Audio
HTML tag:<audio>
Tags::source(string $src, ?string $type = null):Source
HTML tag:<source>
Tags::track(string $src):Track
HTML tag:<track>
Tags::video():Video
HTML tag:<video>
Tags::object(string $src, ?string $type = null):ObjectTag
HTML tag:<object>
Tags::param(?string $name = null, string|int|float|null $value = null):Param
HTML tag:<param>

Tags::table(?Tbody $tbody = null, ?Thead $thead = null, ?Tfoot $tfoot = null):Table
HTML tag:<table>
Tags::caption(string|int|float|null $content = null):Caption
HTML tag:<caption>
Tags::thead():Thead
HTML tag:<thead>
Tags::tbody():Tbody
HTML tag:<tbody>
Tags::tfoot():Tfoot
HTML tag:<tfoot>
Tags::tr():Tr
HTML tag:<tr>
Tags::th(Stringable|string|int|float|null $content = null, ?string $scope = null):Th
HTML tag:<th>
Tags::td(Stringable|string|int|float|null $content = null):Td
HTML tag:<td>

Tags::bdi(Stringable|string|int|float|null $content = null):Bdi
HTML tag:<small>
Tags::bdo(Stringable|string|int|float|null $content = null):Bdo
HTML tag:<small>
Tags::br():Br
HTML tag:<br>
Tags::cite(Stringable|string|int|float|null $content = null):Cite
HTML tag:<cite>
Tags::kbd(Stringable|string|int|float|null $content = null):Kbd
HTML tag:<kbd>
Tags::sup(Stringable|string|int|float|null $content = null):Sup
HTML tag:<sup>
Tags::blockquote(Stringable|string|int|float|null $content = null, ?string $cite = null):Blockquote
HTML tag:<blockquote>
Tags::hr():Hr
HTML tag:<hr>
Tags::address(Stringable|string|int|float|null $content = null):Address
HTML tag:<address>
Tags::i(Stringable|string|int|float|null $content = null):I
HTML tag:<i>
Tags::p(Stringable|string|int|float|null $content = null):P
HTML tag:<p>
Tags::small(Stringable|string|int|float|null $content = null):Small
HTML tag:<small>
Tags::span(Stringable|string|int|float|null $content = null):Span
HTML tag:<span>
Tags::strong(Stringable|string|int|float|null $content = null):Strong
HTML tag:<strong>
Tags::time(?mixed $content = null):Time
HTML tag:<time>
Tags::wbr():Wbr
HTML tag:<wbr>
Tags::code(Stringable|string|int|float|null $content = null):Code
HTML tag:<code>
Tags::pre(Stringable|string|int|float|null $content = null):Pre
HTML tag:<pre>
Tags::var(Stringable|string|int|float|null $content = null):Variable
HTML tag:<var>

Tags::h1(Stringable|string|int|float|null $content = null):H1
HTML tag:<h1>
Tags::h2(Stringable|string|int|float|null $content = null):H2
HTML tag:<h2>
Tags::h3(Stringable|string|int|float|null $content = null):H3
HTML tag:<h3>
Tags::h4(Stringable|string|int|float|null $content = null):H4
HTML tag:<h4>
Tags::h5(Stringable|string|int|float|null $content = null):H5
HTML tag:<h5>
Tags::h6(Stringable|string|int|float|null $content = null):H6
HTML tag:<h6>

This div contain a <p> tag

This <p> tag contains a <span> tag

Forms: A Form component factory

Forms creates visual components for HTML form building

Forms::form(?string $action = null, ?string $method = null, Stringable|string|int|float|null $content = null):Form
HTML tag:<form>
Forms::label(Stringable|string|int|float|null $content = null, Labelable|string|null $for = null):Label
HTML tag:<label>
Forms::fieldset(Stringable|string|int|float|null $content = null, Legend|string|null $legend = null):Fieldset
HTML tag:<fieldset>
Forms::legend(Stringable|string|int|float|null $content = null):Legend
HTML tag:<legend>

Forms::hidden(?string $name = null, string|int|float|null $value = null):HiddenInput
HTML tag:<input type="hidden">
Forms::file(?string $name = null, ?string $accept = null, bool $allowMultiple = false):FileInput
HTML tag:<input type="file">
Forms::text(?string $name = null, string|int|float|null $value = null):TextInput
HTML tag:<input type="text">
Forms::search(?string $name = null, string|int|float|null $value = null):SearchInput
HTML tag:<input type="search">
Forms::email(?string $name = null, ?string $value = null):EmailInput
HTML tag:<input type="email">
Forms::password(?string $name = null, ?string $value = null):PasswordInput
HTML tag:<input type="password">
Forms::number(?string $name = null, string|int|float|null $value = null):NumberInput
HTML tag:<input type="number">
Forms::slider(?string $name = null, ?float $min = null, ?float $max = null, ?float $step = null, ?float $value = null):SliderInput
HTML tag:<input type="range">
Forms::color(?string $name = null, string $value = '#000000'):ColorInput
HTML tag:<input type="color" value="#000000">
Forms::time(?string $name = null, Time|string|null $value = null, bool $useSeconds = false):TimeInput
HTML tag:<input type="time">
Forms::datetime(?string $name = null, DateTimeInterface|DateTime|string|null $value = null, bool $allowSeconds = false):DateTimeInput
HTML tag:<input type="datetime-local">
Forms::radio(?string $name = null, string|int|float|null $value = null, bool $checked = false):Radiobox
HTML tag:<input type="radio">
Forms::checkbox(?string $name = null, string|int|float|null $value = null, bool $checked = false):Checkbox
HTML tag:<input type="checkbox">
Forms::textarea(?string $name = null, string|int|float|null $content = null):Textarea
HTML tag:<textarea>

Forms::select(?string $name = null, ?iterable $options = null):Select
HTML tag:<select>
Forms::optgroup(?string $label = null):Optgroup
HTML tag:<optgroup>
Forms::option(string|int|float|null $value = null, string|int|float|null $content = null):Option
HTML tag:<option>
Forms::datalist(Option|string|int|float ... $option):Datalist
HTML tag:<datalist>

Forms::reset(Stringable|string|null $content = null, ?string $name = null, string|int|float|null $value = null):ResetButton
HTML tag:<button type="reset">
Forms::resetInput(?string $content = null):ResetInput
HTML tag:<input type="reset">
Forms::submit(Stringable|string|null $content = null, ?string $name = null, string|int|float|null $value = null):SubmitButton
HTML tag:<button type="submit">
Forms::submitInput(string|int|float|null $value = null, ?string $name = null):SubmitInput
HTML tag:<input type="submit">
Forms::button(Stringable|string|null $content = null, ?string $name = null, string|int|float|null $value = null):PushButton
HTML tag:<button type="button">

Forms::meter(float $min = 0.0, float $max = 1.0, ?float $low = null, ?float $high = null, ?float $optimum = null):Meter
HTML tag:<meter>
Forms::output(?string $name = null, string|int|float|null $value = null):Output
HTML tag:<output>
Forms::progress(?float $max = 1.0, ?float $value = null):Progress
HTML tag:<progress>