{"id":18408631,"url":"https://github.com/artyuum/html-element","last_synced_at":"2025-04-07T09:32:58.964Z","repository":{"id":56949919,"uuid":"179324649","full_name":"artyuum/html-element","owner":"artyuum","description":"A PHP library giving you the ability to generate HTML elements in an object oriented way.","archived":false,"fork":false,"pushed_at":"2022-06-30T08:05:17.000Z","size":69,"stargazers_count":5,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-22T16:02:37.372Z","etag":null,"topics":["html","html-element","library","php7","php8"],"latest_commit_sha":null,"homepage":"https://packagist.org/packages/artyuum/html-element","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/artyuum.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-04-03T16:03:50.000Z","updated_at":"2025-01-05T16:58:36.000Z","dependencies_parsed_at":"2022-08-21T03:10:21.639Z","dependency_job_id":null,"html_url":"https://github.com/artyuum/html-element","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artyuum%2Fhtml-element","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artyuum%2Fhtml-element/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artyuum%2Fhtml-element/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artyuum%2Fhtml-element/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/artyuum","download_url":"https://codeload.github.com/artyuum/html-element/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247626499,"owners_count":20969315,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["html","html-element","library","php7","php8"],"created_at":"2024-11-06T03:20:04.792Z","updated_at":"2025-04-07T09:32:58.625Z","avatar_url":"https://github.com/artyuum.png","language":"PHP","readme":"# HtmlElement\nA PHP library giving you the ability to generate HTML elements in an object oriented way.\n\n## Why did I create this ?\nI used to work on a non-MVC PHP project and sometimes I needed to output few lines of HTML directly from the functions.\nHaving to mix HTML code in PHP code was inconsistent to me and it was hard to keep the code easily readable and easy to maintain in the longterm because of the crazy and ugly concatenations. \nThat's why I came up with the idea of generating HTML elements directly in PHP. (of course if you need to create many HTML elements, you should consider using a templating engine instead)    \nThere are few existing libraries on Packagist that have the same purpose but I wasn't really satisfied and I also wanted to create my own library for fun \u0026 learning purpose.\n\n## Features\n* Supports self-closing tags. (e.g input tag)\n* Supports boolean attributes. (e.g required attribute)\n\n## Requirements\n* PHP ^7.4 or PHP ^8.0\n* Composer\n\n## Installation\n```\ncomposer require artyuum/html-element\n```\n\n## Examples\n### Simple\nA simple DIV element with some attributes \u0026 a content.\n\n```php\nuse Artyum\\HtmlElement\\Element;\nuse Artyum\\HtmlElement\\Attribute;\n\n$divElement = new Element('div');\n\n$divElement\n    -\u003eaddAttributes(\n        new Attribute('title', 'This is an editable DIV with a red background color'),\n        new Attribute('style', [\n                'width: 100px',\n                'height: 100px',\n                'background-color: red'\n        ]),\n        new Attribute('contenteditable', true)\n    )\n    -\u003eaddContent('This is an editable DIV with a red background color.')\n;\n\necho $divElement;\n// or \necho $divElement-\u003etoHtml();\n```\n\n**Output** \n```html\n\u003cdiv title=\"This is an editable DIV with a red background color\" style=\"width: 100px;height: 100px;background-color: red;\" contenteditable\u003e\n    This is an editable DIV with a red background color.\n\u003c/div\u003e\n```\n\n### Advanced\nAn example of a login form that contains children.\n\n```php\nuse Artyum\\HtmlElement\\Element;\nuse Artyum\\HtmlElement\\Attribute;\n\n$formElement = new Element('form');\n$divElement = new Element('div');\n$labelElement = new Element('label');\n$usernameInputElement = new Element('input');\n$passwordInputElement = new Element('input');\n$buttonElement = new Element('button');\n$spanElement = new Element('span');\n\n$formElement\n    -\u003eaddAttributes(\n        new Attribute('action', '/login'),\n        new Attribute('method', 'post')\n    )\n    -\u003eaddContent(\n        $divElement\n            -\u003eaddAttributes(new Attribute('class', 'form-group'))\n            -\u003eaddContent(\n                $labelElement\n                    -\u003eaddAttributes(new Attribute('for', 'username'))\n                    -\u003eaddContent('Username'),\n                $usernameInputElement\n                    -\u003eaddAttributes(\n                        new Attribute('type', 'text'),\n                        new Attribute('class', 'form-control'),\n                        new Attribute('id', 'username'),\n                        new Attribute('name', 'username'),\n                        new Attribute('placeholder', 'Username'),\n                        new Attribute('style', [\n                            'border: none',\n                            'background-color: rgba(100, 100, 255, .1)'\n                        ]),\n                        new Attribute('required', true)\n                    ),\n                $passwordInputElement\n                    -\u003eaddAttributes(\n                        new Attribute('type', 'password'),\n                        new Attribute('class', 'form-control'),\n                        new Attribute('id', 'password'),\n                        new Attribute('name', 'password'),\n                        new Attribute('placeholder', 'Password'),\n                        new Attribute('style', [\n                            'border: none',\n                            'background-color' =\u003e 'rgba(100, 100, 255, .1)'\n                        ]),\n                        new Attribute('required', true)\n                    ),\n                $buttonElement\n                    -\u003eaddAttributes(new Attribute('type', 'submit'))\n                    -\u003eaddContent(\n                        $spanElement\n                            -\u003eaddAttributes(new Attribute('class', 'fa fa-sign-in-alt'))\n                            -\u003eaddContent('Login')\n                    )\n            )\n    );\n\necho $formElement;\n// or\necho $formElement-\u003etoHtml();\n```\n\n**Output**\n```html\n\u003cform action=\"/login\" method=\"post\"\u003e\n    \u003cdiv class=\"form-group\"\u003e\n        \u003clabel for=\"username\"\u003eUsername\u003c/label\u003e\n        \u003cinput type=\"text\" class=\"form-control\" id=\"username\" name=\"username\" placeholder=\"Username\" style=\"border: none;background-color: rgba(100, 100, 255, .1)\" required\u003e\n        \u003cinput type=\"password\" class=\"form-control\" id=\"password\" name=\"password\" placeholder=\"Password\" style=\"border: none;rgba(100, 100, 255, .1)\" required\u003e\n        \u003cbutton type=\"submit\"\u003e\u003cspan class=\"fa fa-sign-in-alt\"\u003eLogin\u003c/span\u003e\u003c/button\u003e\n    \u003c/div\u003e\n\u003c/form\u003e\n```\n\n## API\n\n### Artyum\\HtmlElement\\Element\nWhen instantiating the `Element` class, you can optionally provide the name of the element as first argument, and an array of options as second argument.\n```php\n__construct(?string $name = null, ?array $options = null)\n```  \n\n---\nGets the HTML code of the element.\n```php\ntoHtml(): string\n```  \nIf you call this method without setting the name property first, a `LogicException` will be thrown.\n\nNote that you can also simply `echo` the instance and it will internally call the `toHtml()` method. This is possible thanks to the `__toString()` magic method.  \n\n**Example**  \n```php\n// both will return the same result\necho $element-\u003etoHtml();\necho $element;\n```\n\n---\nGets the name of the element.\n```php\ngetName(): ?string\n```\n\n---\nSets the name of the element.\n```php\nsetName(string $name): self\n```\n\n---\nGets the options of the element.\n```php\ngetOptions(): ?array\n```\n\n---\nSets the options of the element.\n```php\nsetOptions(array $options): self\n```\n\n**Available options :**  \n\n| Name      | Type    | Description                                         |\n|-----------|---------|-----------------------------------------------------|\n| autoclose | boolean | Whether the element should have closing tag or not. |\n\n---\nGets the attributes assigned to the element.\n```php\ngetAttributes(): Attribute[]\n```\n\n---\nAdds one or multiple attributes to the element.\n```php\naddAttributes(... Attribute $attribute): self\n```  \nThanks to the splat operator (...), you can pass as much argument as you want. You can also call this method multiple times to add additional attributes.\n\n---\nReturns the content of the element.\n```php\ngetContent(): ?string\n```\n\n---\nAdds one or multiple contents to the element. You can pass a string, an integer, a float or an instance of the Element class.  \n```php\naddContent(...$content): self\n```  \n\n### Artyum\\HtmlElement\\Attribute\nWhen instantiating the `Attribute` class, you must provide the name of the attribute and its value. You can optinally pass the separator that will be used to separate the values if you pass an array of values. \n```php\n__construct(?string $name = null, mixed $value = null, string $separator = ';')\n```  \n\n---\nGets the name.\n```php\ngetName(): ?string\n```\n\n---\nSets the name.\n```php\nsetName(string $name): self\n```\n\n---\nGets the value.\n```php\ngetValue(): mixed\n```\n\n---\nSets the value.\n```php\nsetValue(mixed $value): self\n```\n\n---\nGets the separator.\n```php\ngetSeparator(): string\n```\n\n---\nSets the attribute values separator.\n```php\nsetSeparator(string $separator): self\n```\n\n---\nBuilds \u0026 returns the HTML representation of the attribute.\n```php\nbuild(): string\n```\nIf you call this method without setting the name or the value property first, a `LogicException` will be thrown.\n\nYou can also `echo` the instance and it will internally call the `build()` method.\n\n\n## Changelog\nThis library follows [semantic versioning](https://semver.org/).\n\n* **4.0.0** - (2021-05-13)\n  * Set Attribute class constructor arguments as optional\n  * Added the name and value setter in Attribute\n  * Now throwing an exception if the name or the value is not set when calling build() on Attribute\n  * Set Element class constructor arguments as optional\n  * Added name setter in Element\n  * Now throwing an exception if the name is not set when calling toHtml() on Element\n  * **Now compatible with PHP 8**\n\n* **3.0.0** - (2020-09-21)\n    * Renamed HtmlElement to Element.\n    * Added a new Attribute class.\n    * Renamed setContent to addContent().\n    * Removed setName() and made $name required when instantiating the Element class.\n    * Removed native support of style attribute in favor of a new way to handle attributes using the Attribute class.\n    * Removed WrongAttributeValueException in favor of InvalidArgumentException.\n    * addAttributes() can now accept one or multiple arguments.\n    * Updated tests according to the new changes.\n\n* **2.0.1** - (2020-01-22)\n    * Simplified buildAttributes() \u0026 validateAttributes() methods.\n    * Added proper validation for attribute with an array as value.\n    * Updated tests to be easier to debug.\n\n* **2.0.0** - (2019-12-29)\n    * Re-arranged the code.\n    * Now requiring PHP 7.2 or above.\n    * Removed an unneeded exception and added a new one.\n    * Renamed `setAttributes()` to `addAttributes()` and implemented the ability to merge attributes.\n    * Renamed `build()` to `toHtml()` (more explicit).\n    * Added the ability to set an array as the attribute's value (for the \"style\" attribute).\n    * The name of the element is now being automatically trimmed to remove any space around.\n    * Fixed the return type for methods that can return a null value.\n    * `setContent()` now accepts integer and float values.\n    * It's no longer required to pass the name of the element in the constructor when instantiating.\n    * Added `setName()` \u0026 `setOptions()` methods.\n\n* **1.1.0** - (2019-05-05)\n    * You can now pass an array of $options[] to the constructor when instantiating the HtmlElement class.\n\n* **1.0.0** - (2019-05-04)\n    * The library is fully functional and ready to use.\n\n## Contributing\nIf you'd like to contribute, please fork the repository and make changes as you'd like. Be sure to follow the same coding style \u0026 naming used in this library to produce a consistent code.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fartyuum%2Fhtml-element","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fartyuum%2Fhtml-element","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fartyuum%2Fhtml-element/lists"}