Skip to content

Commit

Permalink
Add docs Title::class. (#287)
Browse files Browse the repository at this point in the history
  • Loading branch information
terabytesoftw committed Feb 13, 2024
1 parent b05cf7f commit 6ae5c67
Show file tree
Hide file tree
Showing 17 changed files with 271 additions and 42 deletions.
1 change: 1 addition & 0 deletions docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ The following tags are currently supported:
- [section](/docs/tag/Section.md)
- [span](/docs/tag/Span.md)
- [svg](/docs/tag/Svg.md)
- [title](/docs/tag/Title.md)

## Forms

Expand Down
2 changes: 2 additions & 0 deletions docs/tag/ButtonToggle.md
Original file line number Diff line number Diff line change
Expand Up @@ -135,6 +135,7 @@ The following methods are available for customizing the `HTML` output:
| `iconContent()` | Set the `content` for the `icon` element. |
| `iconFilePath()` | Set the `file path` for the `icon` element. |
| `iconTag()` | Set the `tag` for the `icon` element. |
| `render()` | Generates the `HTML` output. |
| `template()` | Set the `template` for the `button-toggle` element. |
| `toggle()` | Set enable or disable the `toggle`. |
| `toggleAttributes()` | Set multiple `attributes` for the `toggle` element. |
Expand All @@ -145,3 +146,4 @@ The following methods are available for customizing the `HTML` output:
| `togglePrefix()` | Set the `prefix` for the `toggle` element. |
| `toggleSuffix()` | Set the `suffix` for the `toggle` element. |
| `toggleTag()` | Set the `tag` for the `toggle` element. |
| `widget()` | Instantiates the `ButtonToggle::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Div.md
Original file line number Diff line number Diff line change
Expand Up @@ -117,4 +117,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `div` element. |
| `end()` | End the `div` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Div::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Footer.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,4 +116,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `footer` element. |
| `end()` | End the `footer` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Footer::class`. |
2 changes: 1 addition & 1 deletion docs/tag/H.md
Original file line number Diff line number Diff line change
Expand Up @@ -121,4 +121,4 @@ The following methods are available for customizing the `HTML` output:
| `render()` | Generates the `HTML` output. |
| `tagName()`| Set the `tag` name. |
| | Alowed values: `h1`, `h2`, `h3`, `h4`, `h5`, `h6`. For default value its `h1`. |
| `widget()` | Instantiates the `Body::class`. |
| `widget()` | Instantiates the `H::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Head.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,4 +115,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `head` element. |
| `end()` | End the `head` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Head::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Header.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,4 +116,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `header` element. |
| `end()` | End the `header` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Header::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Html.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,4 +115,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `html` element. |
| `end()` | End the `html` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Html::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Nav.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,4 +116,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `nav` element. |
| `end()` | End the `nav` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Nav::class`. |
2 changes: 1 addition & 1 deletion docs/tag/P.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,4 +116,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `p` element. |
| `end()` | End the `p` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `P::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Section.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,4 +115,4 @@ The following methods are available for customizing the `HTML` output:
| `begin() `| Start the `section` element. |
| `end()` | End the `section` element, and generate the `HTML` output. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Body::class`. |
| `widget()`| Instantiates the `Section::class`. |
44 changes: 19 additions & 25 deletions docs/tag/Span.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
# Span

The `<span>` `HTML` element represents a generic inline container for phrasing content, which doesn't inherently
represent anything. It can be used to group elements for styling purposes (using the class or id attributes), or
because they share attribute values, such as lang. It should be used only when no other semantic element is
appropriate.
The `<span>` `HTML` element represents a generic inline container for phrasing content, which doesn't inherently
represent anything. It can be used to group elements for styling purposes (using the class or id attributes), or
because they share attribute values, such as lang. It should be used only when no other semantic element is
appropriate.

`<span>` is very much like a `<div>` element, but `<div>` is a block-level element whereas a `<span>` is an inline
element.
Expand All @@ -16,14 +16,6 @@ Instantiate the `Span` class using `Span::widget()`.
$span = Span::widget();
```

Or, block style instantiation.

```php
<?= Span::begin() ?>
// ... content to be wrapped by `div` element
<?= Span::end() ?>
```

## Setting Attributes

Use the provided methods to set specific attributes for the a element.
Expand All @@ -47,14 +39,6 @@ If you want to include content within the `div` tag, use the `content` method.
$span->content('My content');
```

Or, use `begin()` and `end()` methods to wrap content.

```php
<?= Span::begin() ?>
My content
<?= Span::end() ?>
```

## Rendering

Generate the `HTML` output using the `render` method, for simple instantiation.
Expand Down Expand Up @@ -109,8 +93,18 @@ comprehensive examples.

The following methods are available for customizing the `HTML` output:

| Method | Description |
| ----------- | ------------------------------------------------------------------------------------------------------ |
| `render()` | Generates the `HTML` output. |
| `template()`| Set the template for the `HTML` output. |
| `widget()` | Instantiates the `Body::class`. |
| Method | Description |
| ---------------------------- | ------------------------------------------------------------------------------------- |
| `prefix()` | Add text before the `a` element. |
| `prefixContainer()` | Set enabled or disabled for the `prefix-container` element. |
| `prefixContainerAttributes()`| Set `attributes` for the `prefix-container` element. |
| `prefixContainerClass()` | Set the `class` attribute for the `prefix-container` element. |
| `prefixContainerTag()` | Set the `tag` for the `prefix-container` element. |
| `render()` | Generates the `HTML` output. |
| `suffix()` | Add text after the `a` element. |
| `suffixContainer()` | Set enabled or disabled for the `suffix-container` element. |
| `suffixContainerAttributes()`| Set `attributes` for the `suffix-container` element. |
| `suffixContainerClass()` | Set the `class` attribute for the `suffix-container` element. |
| `suffixContainerTag()` | Set the `tag` for the `suffix-container` element. |
| `template()` | Set the template for the `HTML` output. |
| `widget()` | Instantiates the `Span::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Svg.md
Original file line number Diff line number Diff line change
Expand Up @@ -100,4 +100,4 @@ The following methods are available for customizing the `HTML` output:
| ----------- | ------------------------------------------------------------------------------------------------------ |
| `filePath()`| Set the file path for the `HTML` output. |
| `render()` | Generates the `HTML` output. |
| `widget()` | Instantiates the `Body::class`. |
| `widget()` | Instantiates the `Svg::class`. |
2 changes: 1 addition & 1 deletion docs/tag/Tag.md
Original file line number Diff line number Diff line change
Expand Up @@ -101,4 +101,4 @@ The following methods are available for customizing the `HTML` output:
| `tagName()` | Set the tag name for the `HTML` output. |
| `template()` | Set the template for the `HTML` output. |
| `tokenValues()`| Set the token values for the `HTML` output. |
| `widget()` | Instantiates the `Body::class`. |
| `widget()` | Instantiates the `Tag::class`. |
113 changes: 113 additions & 0 deletions docs/tag/Title.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
# Title

The `<title>` `HTML` element defines the document's title shown in a browser's title bar or a page's tab.

It only contains text; tags within the element are ignored.

## Basic Usage

Instantiate the `Title` class using `Title::widget()`.

```php
$title = Title::widget();
```

Or, block style instantiation.

```php
<?= Title::begin() ?>
// ... content to be wrapped by `div` element
<?= Title::end() ?>
```

## Setting Attributes

Use the provided methods to set specific attributes for the a element.

```php
// setting class attribute
$title->class('container');
```

Or, use the `attributes` method to set multiple attributes at once.

```php
$title->attributes(['class' => 'container', 'style' => 'background-color: #eee;']);
```

## Adding Content

If you want to include content within the `div` tag, use the `content` method.

```php
$title->content('My content');
```

Or, use `begin()` and `end()` methods to wrap content.

```php
<?= Title::begin() ?>
My content
<?= Title::end() ?>
```

## Rendering

Generate the `HTML` output using the `render` method, for simple instantiation.

```php
$html = $title->render();
```

Or, use the magic `__toString` method.

```php
$html = (string) $title;
```

## Common Use Cases

Below are examples of common use cases:

```php
// adding multiple attributes
$title->class('external')->content('My content');

// using data attributes
$title->dataAttributes(['analytics' => 'trackClick']);
```

Explore additional methods for setting various attributes such as `lang`, `name`, `style`, `title`, etc.

## Attributes

Refer to the [Attribute Tests](https://github.com/php-forge/html/blob/main/tests/Title/AttributeTest.php) for
comprehensive examples.

The following methods are available for setting attributes:

| Method | Description |
| ----------------- | ------------------------------------------------------------------------------------------------ |
| `attributes()` | Set multiple `attributes` at once. |
| `class()` | Set the `class` attribute. |
| `content()` | Set the `content` within the `div` element. |
| `dataAttributes()`| Set multiple `data-attributes` at once. |
| `id()` | Set the `id` attribute. |
| `lang()` | Set the `lang` attribute. |
| `name()` | Set the `name` attribute. |
| `style()` | Set the `style` attribute. |
| `title()` | Set the `title` attribute. |

## Custom methods

Refer to the [Custom Methods Tests](https://github.com/php-forge/html/blob/main/tests/Title/CustomMethodTest.php) for
comprehensive examples.

The following methods are available for customizing the `HTML` output:

| Method | Description |
| --------- | -------------------------------------------------------------------------------------------------------- |
| `begin()` | Initializes the `Title` widget. |
| `end()` | Finalizes the `Title` widget. |
| `render()`| Generates the `HTML` output. |
| `widget()`| Instantiates the `Title::class`. |
115 changes: 115 additions & 0 deletions tests/Title/AttributeTest.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
<?php

declare(strict_types=1);

namespace PHPForge\Html\Tests\Title;

use PHPForge\Html\Title;
use PHPForge\Support\Assert;
use PHPUnit\Framework\TestCase;

/**
* @psalm-suppress PropertyNotSetInConstructor
*/
final class AttributeTest extends TestCase
{
public function testAttributes(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title class="value">
</title>
HTML,
Title::widget()->attributes(['class' => 'value'])->render()
);
}

public function testClass(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title class="value">
</title>
HTML,
Title::widget()->class('value')->render()
);
}

public function testContent(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title>
value
</title>
HTML,
Title::widget()->content('value')->render()
);
}

public function testDataAttributes(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title data-value="value">
</title>
HTML,
Title::widget()->dataAttributes(['value' => 'value'])->render()
);
}

public function testId(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title id="value">
</title>
HTML,
Title::widget()->id('value')->render()
);
}

public function testLang(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title lang="value">
</title>
HTML,
Title::widget()->lang('value')->render()
);
}

public function testName(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title name="value">
</title>
HTML,
Title::widget()->name('value')->render()
);
}

public function testStyle(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title style="value">
</title>
HTML,
Title::widget()->style('value')->render()
);
}

public function testTitle(): void
{
Assert::equalsWithoutLE(
<<<HTML
<title title="value">
</title>
HTML,
Title::widget()->title('value')->render()
);
}
}

0 comments on commit 6ae5c67

Please sign in to comment.