PHPackages pod-point/form-components - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Templating & Views](/categories/templating) 4. / 5. pod-point/form-components AbandonedLibrary[Templating & Views](/categories/templating) pod-point/form-components ========================= Commonly used form components to make it easier and more flexible to create forms in Blade views v4.0.0(2y ago)18.1k2[1 PRs](https://github.com/Pod-Point/form-components/pulls)MITPHPPHP ^7.4 || ^8.1 Since Jun 19Pushed 2y ago2 watchersCompare [ Source](https://github.com/Pod-Point/form-components)[ Packagist](https://packagist.org/packages/pod-point/form-components)[ RSS](/packages/pod-point-form-components/feed)WikiDiscussions master Synced 1mo ago READMEChangelog (10)Dependencies (2)Versions (18)Used By (0) Form Components =============== [](#form-components) Commonly used form components to make it easier and more flexible to create forms in [Blade](https://laravel.com/docs/master/blade) views. It is intended to be usable by anyone. For ease of use by [Pod Point](https://pod-point.com) staff, when classes are not specified they default to those used in the [Pod Point UI toolkit](https://github.com/Pod-Point/pod-point-ui-toolkit). Editing ------- [](#editing) To edit this project, clone the repository: ``` git clone git@github.com:Pod-Point/form-components.git ``` Install the PHP dependencies: ``` cd form-components composer install ``` Laravel installation -------------------- [](#laravel-installation) More commonly, you'll want to import these components for use in Laravel applications (or other frameworks that use Blade). To install it using Composer, require the package: ``` composer require pod-point/form-components:^3.0 ``` Then in Laravel, include the service provider in your `config/app.php` file: ``` PodPoint\FormComponents\FormComponentsServiceProvider::class, ``` Usage ----- [](#usage) You can insert components into Blade views using the `form::` package prefix. ### Examples [](#examples) Button ``` @include('form::_components.button', [ 'name' => 'myButton', // optional, sets name and id 'element' => 'button', // optional, defaults to button 'text' => 'Submit', 'attributes' => [ // optional 'type' => 'submit', 'disabled' => true, ... ], 'classes' => [ // optional 'input' => 'myInputClass', // button - defaults to 'btn' ], ]) @include('form::_components.button', [ 'element' => 'a', 'text' => 'Cancel', 'attributes' => [ // optional 'href' => 'http://somewhere', ... ], ]) ``` Checkbox ``` @include('form::_components.checkbox', [ 'name' => 'myCheckbox', // sets name and id 'labelText' => 'Choose option(s)', // optional 'options' => [ 'option1' => 'Option 1', 'option2' => 'Option 2', ], 'values' => ['option1'], // optional default selected values 'attributes' => [ // optional 'disabled' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // outermost container div - defaults to 'form__group' 'label' => 'myLabelClass', // span that appears above all checkboxes - defaults to 'form__label' 'inputContainer' => 'myInputContainerClass', // label element container wrapping around each checkbox - defaults to 'checkbox form__field' 'input' => 'myInputClass', // input checkbox element - defaults to 'form__control' ], ]) ``` File upload ``` @include('form::_components.file-upload', [ 'name' => 'myUpload', // sets name and id 'labelText' => 'Upload your file', // optional 'attributes' => [ // optional 'disabled' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // container div - defaults to 'form__group' 'label' => 'myLabelClass', // label that appears above input - defaults to 'form__label' 'input' => 'myInputClass', // input file upload element - defaults to 'form__control form__field' ], ]) ``` Text/password input ``` @include('form::_components.input', [ 'name' => 'myTextbox', // sets name and id 'type' => 'text', // optional, defaults to 'text' 'value' => 'Some text', // optional default value 'labelText' => 'Type here', // optional 'explanation' => 'Explanation copy', // optional 'attributes' => [ // optional 'placeholder' => 'A hint to the user', 'required' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // container div - defaults to 'form__group' 'label' => 'myLabelClass', // label that appears above input - defaults to 'form__label' 'input' => 'myInputClass', // input element - defaults to 'form__control form__field' ], ]) ``` Radio button(s) ``` @include('form::_components.radio', [ 'name' => 'myRadio', // sets name and id 'labelText' => 'Choose an option', // optional 'options' => [ 'option1' => 'Option 1', 'option2' => 'Option 2', ], 'value' => 'option1', // optional default selected value 'attributes' => [ // optional 'disabled' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // outermost container div - defaults to 'form__group' 'label' => 'myLabelClass', // span that appears above all radio buttons - defaults to 'form__label' 'inputContainer' => 'myInputContainerClass', // label element container wrapping around each radio button - defaults to 'radio form__field' 'input' => 'myInputClass', // input radio element - defaults to 'form__control' ], ]) ``` Select dropdown ``` @include('form::_components.select', [ 'name' => 'mySelect', // sets name and id 'labelText' => 'Choose an option', 'options' => [ 'option1' => 'Option 1', 'option2' => 'Option 2', ], 'value' => 'option1', // optional default selected value 'attributes' => [ // optional 'required' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // outermost container div - defaults to 'form__group' 'label' => 'myLabelClass', // label that appears above input - defaults to 'form__label' 'inputContainer' => 'myInputContainerClass', // div container wrapping around select - defaults to 'select form__field' 'input' => 'myInputClass', // select element - defaults to 'form__control' ], ]) ``` Textarea ``` @include('form::_components.textarea', [ 'name' => 'myTextarea', // sets name and id 'labelText' => 'Type here', // optional 'value' => 'Some text', // optional default value 'attributes' => [ // optional 'placeholder' => 'A hint to the user', 'required' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // container div - defaults to 'form__group' 'label' => 'myLabelClass', // label that appears above input - defaults to 'form__label' 'input' => 'myInputClass', // textarea element - defaults to 'form__control form__field' ], ]) ``` Grouped typeahead select (Please note this depends on the [typeahead](https://pod-point.github.io/pod-point-ui-toolkit/typeahead.html) JS file) ``` @include('form::_components.grouped-typeahead', [ 'name' => 'phoneNumber', // sets name and of the number field 'countryName' => 'country', // sets name and id of the country select field 'labelText' => 'Type here', // optional 'options' => $countryCodeOptions, 'value' => 'GB', 'attributes' => [ 'required' => true, ... ], 'classes' => [ // optional 'formGroup' => 'myFormGroupClass', // outermost container div - defaults to 'form__group' 'label' => 'myLabelClass', // label that appears above input - defaults to 'form__label' ], ]) ``` ### Attributes [](#attributes) Some key attributes e.g. `name` can be set directly (see examples above for each component). For all components, any additional attributes can be set using the `attributes` array. These are optional. `attributes` can take text values where needed, e.g. ``` ... 'attributes' => [ 'type' => 'submit', ], ... ``` or they can take boolean values - if a boolean value is used the attribute will be included if true e.g. `` or omitted if false e.g. `` ``` ... 'attributes' => [ 'disabled' => true, ], ... ``` ### Classes [](#classes) For all components, all `classes` are optional. If an element's class is not specified, it defaults to the appropriate class(es) from the Pod Point UI toolkit - see each component below for details. If you want an element to have no class set at all, set that element's class to `''` e.g. ``` ... 'classes' => [ 'input' => '', ], ... ``` ### Health Score 38 — LowBetter than 85% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity24 Limited adoption so far Community14 Small or concentrated contributor base Maturity80 Battle-tested with a long release history Bus Factor2 2 contributors hold 50%+ of commits How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~147 days Recently: every ~520 days Total 16 Last Release 1049d ago Major Versions v1.0.6 → v2.0.02017-09-11 v2.0.0 → v3.0.02017-09-13 v3.2.3 → v4.0.02023-07-05 PHP version history (2 changes)v1.0PHP >=7.0.0 v4.0.0PHP ^7.4 || ^8.1 ### Community Maintainers ![](https://www.gravatar.com/avatar/9ce40bc096123bdd8dabab907d789c0de2ebd015fc4d1a11b692faa85be8e4ec?d=identicon)[pod-point](/maintainers/pod-point) --- Top Contributors [![mikefrancis](https://avatars.githubusercontent.com/u/1672610?v=4)](https://github.com/mikefrancis "mikefrancis (3 commits)")[![threesquared](https://avatars.githubusercontent.com/u/892142?v=4)](https://github.com/threesquared "threesquared (3 commits)")[![adteulade](https://avatars.githubusercontent.com/u/8091741?v=4)](https://github.com/adteulade "adteulade (1 commits)")[![cfpinto](https://avatars.githubusercontent.com/u/11293388?v=4)](https://github.com/cfpinto "cfpinto (1 commits)") --- Tags blade-viewsformslaravellaravel-5-packagesoftware-teamphplaravelcomponentsbladeform ### Code Quality TestsPHPUnit ### Embed Badge ![Health badge](/badges/pod-point-form-components/health.svg) ``` [![Health](https://phpackages.com/badges/pod-point-form-components/health.svg)](https://phpackages.com/packages/pod-point-form-components) ``` ### Alternatives [area17/blast Storybook for Laravel Blade 308664.1k](/packages/area17-blast)[tomsix/laravel-components-library A collection of pre-made Blade components for Laravel 7.x and up 613.1k](/packages/tomsix-laravel-components-library) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)