{"id":35473568,"url":"https://github.com/vardumper/slim-ux-twig-component","last_synced_at":"2026-01-13T23:01:05.101Z","repository":{"id":332064014,"uuid":"1126983958","full_name":"vardumper/slim-ux-twig-component","owner":"vardumper","description":"Symfony UX Twig Component integration for Slim Framework","archived":false,"fork":false,"pushed_at":"2026-01-12T08:02:10.000Z","size":226,"stargazers_count":0,"open_issues_count":2,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-01-12T17:56:37.120Z","etag":null,"topics":["slim","slim-framework","slim4","slimphp","twig","twig-components"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vardumper.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"github":["vardumper"],"buy_me_a_coffee":"vardumper","custom":["https://paypal.me/vardumper"]}},"created_at":"2026-01-02T23:58:25.000Z","updated_at":"2026-01-12T08:02:13.000Z","dependencies_parsed_at":"2026-01-12T18:02:07.253Z","dependency_job_id":null,"html_url":"https://github.com/vardumper/slim-ux-twig-component","commit_stats":null,"previous_names":["vardumper/slim-ux-twig-component"],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/vardumper/slim-ux-twig-component","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vardumper%2Fslim-ux-twig-component","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vardumper%2Fslim-ux-twig-component/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vardumper%2Fslim-ux-twig-component/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vardumper%2Fslim-ux-twig-component/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vardumper","download_url":"https://codeload.github.com/vardumper/slim-ux-twig-component/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vardumper%2Fslim-ux-twig-component/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28399295,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-13T14:36:09.778Z","status":"ssl_error","status_checked_at":"2026-01-13T14:35:19.697Z","response_time":56,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["slim","slim-framework","slim4","slimphp","twig","twig-components"],"created_at":"2026-01-03T11:26:39.170Z","updated_at":"2026-01-13T23:01:05.077Z","avatar_url":"https://github.com/vardumper.png","language":"PHP","funding_links":["https://github.com/sponsors/vardumper","https://buymeacoffee.com/vardumper","https://paypal.me/vardumper"],"categories":[],"sub_categories":[],"readme":"\u003ctable align=\"center\" style=\"border-collapse:collapse !important; border:none !important;\"\u003e\n  \u003ctr style=\"border:0px none; border-top: 0px none !important;\"\u003e\n    \u003ctd align=\"center\" valign=\"middle\" style=\"padding:0 1rem; border:none !important;\"\u003e\n      \u003ca href=\"https://www.w3.org/TR/2011/WD-html5-20110405/\" target=\"_blank\"\u003e\n        \u003cimg src=\"https://vardumper.github.io/extended-htmldocument/html5_logo-with-wordmark.svg\" style=\"display:block; height:90px; width:auto; max-width:300px;\" alt=\"HTML5 Logo\" /\u003e\n      \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd align=\"center\" valign=\"middle\" style=\"padding:0 1rem; border:none !important;\"\u003e\n      \u003ca href=\"https://www.slimframework.com/\" target=\"_blank\"\u003e\n        \u003cimg src=\"https://vardumper.github.io/extended-htmldocument/slim.png\" style=\"display:block; height:100px; width:auto; max-width:220px;\" alt=\"Slim Framework Logo\" /\u003e\n      \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\u003ch1 align=\"center\"\u003eSlim UX Twig Component\u003c/h1\u003e\n\n\u003cp dir=\"auto\" align=\"center\"\u003e\u003ca href=\"https://packagist.org/packages/vardumper/slim-ux-twig-component\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/1cb1d589a8e7dbd3b472c9aba54cb8249143d9ddb181d27b6b4d76b47e3dd752/68747470733a2f2f706f7365722e707567782e6f72672f76617264756d7065722f736c696d2d75782d747769672d636f6d706f6e656e742f762f737461626c65\" alt=\"Latest Stable Version\" data-canonical-src=\"https://poser.pugx.org/vardumper/slim-ux-twig-component/v/stable\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://packagist.org/packages/vardumper/slim-ux-twig-component\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/e1d931cd82d815f27573be5ab2809bbd081f04c80d63cc99c7b6c0ea1f4981d2/68747470733a2f2f706f7365722e707567782e6f72672f76617264756d7065722f736c696d2d75782d747769672d636f6d706f6e656e742f646f776e6c6f616473\" alt=\"Total Downloads\" data-canonical-src=\"https://poser.pugx.org/vardumper/slim-ux-twig-component/downloads\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://dtrack.erikpoehler.us/projects/4d0cd6c8-6c59-4d4a-8096-b503045a06b9\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/8c55b58f7b2bc4b69e4274eda7d2c902817c3d573e0236f504101b52a9c83f25/68747470733a2f2f64747261636b2e6572696b706f65686c65722e75732f6170692f76312f62616467652f76756c6e732f70726f6a6563742f34643063643663382d366335392d346434612d383039362d6235303330343561303662393f6170694b65793d6f64745f4a354f4b7a394a6357704b416e717a383077687854767741336f516a47424779\" alt=\"Vulnerabilities for slim-ux-twig-component\" data-canonical-src=\"https://dtrack.erikpoehler.us/api/v1/badge/vulns/project/4d0cd6c8-6c59-4d4a-8096-b503045a06b9?apiKey=odt_J5OKz9JcWpKAnqz80whxTvwA3oQjGBGy\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\u003c/p\u003e\n\nA small integration to make building and using **[Twig Components](https://symfony.com/bundles/ux-twig-component/current/index.html)** easy in Slim Framework. It provides a custom Runtime and allows configuration of component paths as well as passing in more Twig namespaces/paths. As a caveat, installing this package, does pull in a number of Symfony packages.\nMakes use of [`vardumper/extended-htmldocument`](https://github.com/vardumper/extended-htmldocument) which adds improved HTML5 support to PHP - used for HTML5 attribute validation via Immutable Attribute Enums when using the pre-built Twig Components that are included in this package (for example `\u003ctwig:A href=\"#\" role=\"button\"\u003eInline Button\u003c/twig:A\u003e`). \nAlso uses [`vardumper/html5-twig-component-bundle`](https://github.com/vardumper/html5-twig-component-bundle) which holds these pre-built Twig Components for all HTML5 elements.   \n\n## Features\n\n - Works with Slim 4+ with and without DI Container\n - Includes pre-made Twig Components for all HTML5 elements that are fully typesafe and support Alpine.js, ARIA, WCAG and HTML Living Standards.\n - Supports class-based as well as anonymous Twig Components\n - Supports `\u003ctwig:Alert type=\"success\" /\u003e`, `{{ component('Alert', { type: 'success'}) }}` and\n `{{ component 'Alert' with { type: 'success'} }}` syntaxes\n\n\n## Requirements\n - PHP 8.4+\n - `slim/twig-view` for Twig Rendering\n\n## Installation\n```bash\ncomposer require vardumper/slim-ux-twig-component\n```\n\n## Slim Setup\n\nAfter you register Twig (`slimphp/twig-view`) in your application bootstrap, call the register method of `SlimTwigComponent` like so:\n\n```php\nuse Slim\\Views\\Twig;\nuse Vardumper\\SlimTwigComponent\\SlimTwigComponent;\n\n$twig = Twig::create(__DIR__ . '/../templates', [\n    'cache' =\u003e  __DIR__ . '/../var/cache/twig',\n]);\n\nSlimTwigComponent::register(\n    twig: $twig,\n    // optional:\n    namespacePaths: [\n        'AdditionalNamespace' =\u003e __DIR__ . '../path/to/twig-component',\n    ],\n    // optional:\n    componentPaths: [\n        'App\\\\Twig\\\\Component\\\\' =\u003e __DIR__ . '/../src/Twig/Component',\n    ],\n);\n```\n\nBy default, only Twig's main namepsace (usually a `templates/` or `view/` folder) is registered by the SlimTwigComponent class. Internally, the paths for the pre-made HTML5 Twig Components are registered. \nUse the optional `$namespacePaths` and `$componentPaths` to provide an array of additional folders and namespaces.\n\nYou can now add Anonymous components inside `templates/components`. For example: add an `Alert.html.twig` file:\n```twig\n\u003ctwig:Span class=\"alert alert-{{ type|default('success') }}\"\u003e{{ message }}\u003c/twig:Span\u003e\n```\n\nNow inside your Twig templates you can render components:\n\n```twig\n{% component 'Alert' with { type: 'warning', message: 'Something happened!' } %}\n{% component('Alert', { type: 'success', message: 'All good!' }) %}\n\u003ctwig:Alert type=\"success\" message=\"Super duper!\" /\u003e\n```\n\nBesides from strings, you can also pass objects and arrays to Twig Components. Learn more about Twig Components in the [Symfony Documentation](https://symfony.com/bundles/ux-twig-component/current/index.html#component-html-syntax).\n```twig\n\u003ctwig:Alert :object='{ \"key\": \"value\" }' /\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvardumper%2Fslim-ux-twig-component","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvardumper%2Fslim-ux-twig-component","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvardumper%2Fslim-ux-twig-component/lists"}