{"id":20504485,"url":"https://github.com/tiknil/bs-blade-forms","last_synced_at":"2026-04-07T16:00:44.230Z","repository":{"id":248540866,"uuid":"828975268","full_name":"tiknil/bs-blade-forms","owner":"tiknil","description":"Collection of blade components for building form using bootstrap","archived":false,"fork":false,"pushed_at":"2026-02-24T08:20:38.000Z","size":174,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"main","last_synced_at":"2026-03-28T00:52:39.449Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/tiknil.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","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}},"created_at":"2024-07-15T13:56:33.000Z","updated_at":"2026-02-24T08:20:09.000Z","dependencies_parsed_at":"2025-04-13T20:50:23.661Z","dependency_job_id":"da774f52-032d-4756-b1e8-269369e3ca2b","html_url":"https://github.com/tiknil/bs-blade-forms","commit_stats":null,"previous_names":["tiknil/bs-blade-forms"],"tags_count":20,"template":false,"template_full_name":null,"purl":"pkg:github/tiknil/bs-blade-forms","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tiknil%2Fbs-blade-forms","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tiknil%2Fbs-blade-forms/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tiknil%2Fbs-blade-forms/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tiknil%2Fbs-blade-forms/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tiknil","download_url":"https://codeload.github.com/tiknil/bs-blade-forms/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tiknil%2Fbs-blade-forms/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31518642,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-07T03:10:19.677Z","status":"ssl_error","status_checked_at":"2026-04-07T03:10:13.982Z","response_time":105,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: 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":[],"created_at":"2024-11-15T19:38:23.105Z","updated_at":"2026-04-07T16:00:44.206Z","avatar_url":"https://github.com/tiknil.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Blade Form Components Library\n\n![GitHub Actions](https://github.com/tiknil/bs-blade-forms/actions/workflows/main.yml/badge.svg)\n[![Latest Version on Packagist](https://img.shields.io/packagist/v/tiknil/bs-blade-forms.svg?style=flat-square)](https://packagist.org/packages/tiknil/bs-blade-forms)\n[![Total Downloads](https://img.shields.io/packagist/dt/tiknil/bs-blade-forms.svg?style=flat-square)](https://packagist.org/packages/tiknil/bs-blade-forms)\n\nOpinionated library designed to streamline the process of building forms in Laravel applications by leveraging Blade\ncomponents and Boostrap utilities.\n\n- [Key Features](#key-features)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Examples](#examples)\n- [Components](#components)\n  - [SearchSelect](#searchselect)\n  - [Autocomplete](#autocomplete)\n  - [MultiSelect](#multiselect)\n  - [Select](#select)\n  - [Input](#input)\n  - [Textarea](#textarea)\n  - [Checkbox](#checkbox)\n  - [Radio](#radio)\n\n### Key Features\n\n- **Reduced boilerplate**: Minimize repetitive code and simplify the form-building process\n- **Advanced Select Components**: Utilize `SearchSelect` and `MultiSelect` for enhanced and complex selection input\n  needs, providing a better user experience.\n- **Automatic Old Input Handling**: Automatically manage [old input](https://laravel.com/docs/validation#repopulating-forms) based on the field name, ensuring form\n  repopulation is seamless.\n- - **Automatic Form model binding**: Automatically binds to a model and populate the form with the corrisponding field\n- **Livewire Support**: Fully integrate with Livewire by forwarding tags (e.g., `wire:model`) to the underlying\n  input/select\n  elements.\n\n### Installation\n\nYou can install the package via composer:\n\n```bash\ncomposer require tiknil/bs-blade-forms\n```\n\nJS/CSS assets should be automatically published alongside the default laravel libraries assets. Alternatively, publish\nthem using:\n\n```bash\nphp artisan vendor:publish --tag=bs-blade-forms:assets\n```\n\n\u003e [!NOTE]  \n\u003e Boostrap is not imported automatically by the library. We assume you are already using it on your page and it is\n\u003e already available\n\n### Usage\n\nThe advanced select elements (SearchSelect / MultiSelect) requires some additional assets to be included. Add this\nbetween your page `head` tag:\n\n```php\n\u003chead\u003e\n    ...\n    {{ BsBladeForms::assets() }}\n\u003c/head\u003e\n```\n\nIn your blade templates, use the provided components:\n\n```bladehtml\n\n\u003cx-bs::search-select label=\"Your country\" name=\"country\" :options=\"$countries\" required/\u003e\n\n\u003cx-bs::multi-select label=\"Pick your countries\" name=\"countries\" :options=\"$countries\" required/\u003e\n\n\u003cx-bs::input label=\"Full Name\" name=\"name\" :value=\"$user-\u003ename\"/\u003e\n```\n\n#### Examples\n\nGo from:\n\n```html\n\u003cform action=\"{{ route('users.edit', ['id' =\u003e $user-\u003eid]) }}\" method=\"POST\"\u003e\n    @csrf\n    @method('patch')\n\n    \u003clabel for=\"name\" class=\"form-label\"\u003e{{ __('user.name') }}\u003c/label\u003e\n    \u003cinput type=\"text\"\n           class=\"form-control\"\n           id=\"name\"\n           name=\"name\"\n           value=\"{{ old('name', $user-\u003ename) }}\"\n\n    /\u003e\n\n    \u003clabel for=\"role\" class=\"form-label\"\u003e{{ __('user.role') }}\u003c/label\u003e\n    \u003cselect name=\"role\" id=\"role\" class=\"form-select\"\u003e\n        \u003coption value=\"\"\u003e-- Select a role --\u003c/option\u003e\n        @foreach($roles as $key =\u003e $label)\n            \u003coption value=\"{{ $key }}\"\n                    @selected(old('role', $user-\u003erole) === $key)\n            \u003e\n            {{ $label }}\n            \u003c/option\u003e\n        @endforeach\n    \u003c/select\u003e\n\n    \u003cdiv class=\"form-check\"\u003e\n        \u003cinput type=\"checkbox\"\n               class=\"form-check-input\"\n               value=\"1\"\n               name=\"newsletter\"\n               id=\"newsletter\"\n               @checked(old('newsletter', $user-\u003enewsletter) === '1') /\u003e\n        \u003clabel class=\"form-check-label\" for=\"newsletter\"\u003e\n            Subscribe to newsletter\n        \u003c/label\u003e\n    \u003c/div\u003e\n\u003c/form\u003e\n```\n\nTo:\n\n```bladehtml\n\u003cx-bs::form :model=\"$user\" method=\"PATCH\" action=\"{{ route('users.edit', ['id' =\u003e $user-\u003eid]) }}\"\u003e\n    \u003cx-bs::input\n        :label=\"__('user.name)\"\n        name=\"name\"\n    /\u003e\n\n    \u003cx-bs::select\n        :label=\"__('user.role')\"\n        name=\"role\"\n        :options=\"$roles\"\n        empty-option=\"-- Select a role --\"\n    /\u003e\n\n    \u003cx-bs::checkbox\n        name=\"newsletter\"\n        label=\"Subscribe to newsletter\"\n    /\u003e\n\u003c/x-bs::form\u003e\n```\n\n## Components\n\n#### Form\n\nRenders a form, with optional modal binding.\n\n```bladehtml\n\n\u003cx-bs::form :model=\"$model\" method=\"PATCH\" action=\"{{ route(...) }}\"\u003e\n...\n\u003c/x-bs::form\u003e\n```\n\nAutomatically adds `@csrf` and `@method(...)` when required.\n\nWhen a `model` is provided, `x-bs::` components will automatically use the model corresponding field as default value.\n\n#### SearchSelect\n\nRenders a single selection element with a research bar for filtering the options.\n\n```bladehtml\n\n\u003cx-bs::search-select\n    label=\"Your country\"\n    name=\"country\"\n    :value=\"$user-\u003ecountry\"\n    :options=\"$countries\"\n    icon=\"bi bi-map\"\n    required\n    allow-clear\n/\u003e\n```\n\n\u003e [!IMPORTANT]  \n\u003e Include `{{ BsBladeForms::assets() }}` in the page head for this component to work\n\n| Attribute          | Type              | Description                                                                                                                                                                                         |\n| ------------------ | ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --- |\n| name               | string            | _Required_. Name of the select element                                                                                                                                                              |\n| options            | array, Collection | The options to display on the select.                                                                                                                                                               |\n| fetch-url          | string            | An url to fetch for available options (to use with big data). The library will add a `q` querystring param with the searched string. Response should be a json in the `{ [value]: [label] }` format |\n| value              | string, int       | The initial selected value                                                                                                                                                                          |     |\n| required           | bool              | Set the select element as required (form can't be submitted without selection)                                                                                                                      |     |\n| placeholder        | string            | Element placeholder when no option is selected                                                                                                                                                      |\n| label              | string            | If present, renders a `Label` above the element                                                                                                                                                     |\n| icon               | string            | If present, renders an `IconGroup` around the element                                                                                                                                               |\n| allow-clear        | bool              | Allows the user to clear the selected option                                                                                                                                                        |\n| empty-value        | string            | The value to submit when no option is selected                                                                                                                                                      |\n| search-placeholder | string            | The placeholder of the search input                                                                                                                                                                 |\n| \\*                 |                   | Additional attributes will be forwarded to the underlying element.                                                                                                                                  |\n\n#### Autocomplete\n\nRenders an input field with dropdown suggestions that can be filtered by typing.\n\n```bladehtml\n\u003cx-bs::autocomplete\n    label=\"Your country\"\n    name=\"country\"\n    :value=\"$user-\u003ecountry\"\n    :options=\"$countries\"\n    icon=\"bi bi-map\"\n    placeholder=\"Start typing...\"\n    required\n    allow-clear\n/\u003e\n```\n\n\u003e [!IMPORTANT]  \n\u003e Include `{{ BsBladeForms::assets() }}` in the page head for this component to work\n\n| Attribute   | Type              | Description                                                                                                                                                                                         |\n| ----------- | ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --- |\n| name        | string            | _Required_. Name of the select element                                                                                                                                                              |\n| options     | array, Collection | The options to display in the dropdown.                                                                                                                                                             |\n| fetch-url   | string            | An url to fetch for available options (to use with big data). The library will add a `q` querystring param with the searched string. Response should be a json in the `{ [value]: [label] }` format |\n| value       | string, int       | The initial selected value                                                                                                                                                                          |     |\n| required    | bool              | Set the element as required (form can't be submitted without selection)                                                                                                                             |     |\n| placeholder | string            | Input placeholder text when no option is selected                                                                                                                                                   |\n| label       | string            | If present, renders a `Label` above the element                                                                                                                                                     |\n| icon        | string            | If present, renders an `IconGroup` around the element                                                                                                                                               |\n| allow-clear | bool              | Allows the user to clear the selected option                                                                                                                                                        |\n| empty-value | string            | The value to submit when no option is selected                                                                                                                                                      |\n| \\*          |                   | Additional attributes will be forwarded to the underlying element.                                                                                                                                  |\n\n#### MultiSelect\n\nRenders a multiple selection element with a research bar for filtering the options.\n\n```bladehtml\n\n\u003cx-bs::multi-select\n    label=\"Which countries you visited?\"\n    name=\"countries\"\n    :value=\"['US', 'DE', 'IT']\"\n    :options=\"$countries\"\n    icon=\"bi bi-map\"\n    required\n/\u003e\n```\n\n\u003e [!IMPORTANT]  \n\u003e Include `{{ BsBladeForms::assets() }}` in the page head for this component to work\n\n| Attribute          | Type              | Description                                                                                                                                                                                         |\n| ------------------ | ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| name               | string            | _Required_. Name of the select element                                                                                                                                                              |\n| options            | array, Collection | The options to display on the select.                                                                                                                                                               |\n| fetch-url          | string            | An url to fetch for available options (to use with big data). The library will add a `q` querystring param with the searched string. Response should be a json in the `{ [value]: [label] }` format |\n| value              | array             | The initial selected values                                                                                                                                                                         |\n| required           | bool              | Set the select element as required (form can't be submitted without selection)                                                                                                                      |\n| placeholder        | string            | Element placeholder when no option is selected                                                                                                                                                      |\n| label              | string            | If present, renders a `Label` above the element                                                                                                                                                     |\n| icon               | string            | If present, renders an `IconGroup` around the element                                                                                                                                               |\n| search-placeholder | string            | The placeholder of the search input                                                                                                                                                                 |\n| select-buttons     | bool              | Whether or not to show \"select all\" and \"unselect all\" buttons (default true)                                                                                                                       |\n| \\*                 |                   | Additional attributes will be forwarded to the underlying element.                                                                                                                                  |\n\n#### Select\n\n```bladehtml\n\n\u003cx-bs::select\n    label=\"Your country\"\n    name=\"country\"\n    :value=\"$user-\u003ecountry\"\n    :options=\"$countries\"\n    icon=\"bi bi-map\"\n    empty-option=\"No answer\"\n    required\n/\u003e\n```\n\n| Attribute    | Type              | Description                                                                             |\n| ------------ | ----------------- | --------------------------------------------------------------------------------------- | --- |\n| name         | string            | _Required_. Name of the select element                                                  |\n| options      | array, Collection | The options to display on the select.                                                   |\n| value        | string            | The initial selected values                                                             |     |\n| required     | bool              | Set the select element as required (form can't be submitted without selection)          |     |\n| label        | string            | If present, renders a `Label` above the element                                         |\n| icon         | string            | If present, renders an `IconGroup` around the element                                   |\n| empty-option | string            | When present, an additional option with empty string as value is added with this label. |\n| \\*           |                   | Additional attributes will be forwarded to the underlying element.                      |\n\n#### Input\n\n```bladehtml\n\n\u003cx-bs::input\n    type=\"email\"\n    label=\"Your email\"\n    name=\"email\"\n    :value=\"$user-\u003eemail\"\n    icon=\"bi bi-envelop\"\n    required\n/\u003e\n```\n\n| Attribute | Type   | Description                                                        |\n| --------- | ------ | ------------------------------------------------------------------ |\n| name      | string | _Required_. Name of the input element                              |\n| value     | string | The initial value                                                  |\n| label     | string | If present, renders a `Label` above the element                    |\n| icon      | string | If present, renders an `IconGroup` around the element              |\n| type      | string | Type of the input (`text` by default)                              |\n| \\*        |        | Additional attributes will be forwarded to the underlying element. |\n\n#### Textarea\n\n```bladehtml\n\n\u003cx-bs::textarea\n    label=\"Notes\"\n    name=\"notes\"\n    :value=\"$user-\u003enotes\"\n    required\n/\u003e\n```\n\n| Attribute | Type   | Description                                                        |\n| --------- | ------ | ------------------------------------------------------------------ | --- |\n| name      | string | _Required_. Name of the textarea element                           |\n| value     | string | The initial value                                                  |     |\n| label     | string | If present, renders a `Label` above the element                    |\n| \\*        |        | Additional attributes will be forwarded to the underlying element. |\n\n#### Checkbox\n\n```bladehtml\n\n\u003cx-bs::checkbox\n    label=\"Enable\"\n    name=\"enabled\"\n    @checked($user-\u003eenabled)\n/\u003e\n```\n\n\u003e [!NOTE]  \n\u003e When the form is submitted, a parameter is submitted even when the checkbox is not checked!\n\u003e The parameter submitted has value `1` when the checkbox is checked, `0` otherwise\n\n| Attribute        | Type   | Description                                                            |\n| ---------------- | ------ | ---------------------------------------------------------------------- |\n| name             | string | _Required_. Name of the element                                        |\n| label            | string | If present, renders a `Label` aside the input checkbox                 |\n| checked          | bool   | Initial checked value (default `false`)                                |\n| value            | string | The value submitted when the checkbox is checked (default `1`)         |\n| false-value      | string | The value submitted when the checkbox is not checked (default `0`)     |\n| send-false-value | bool   | Send the false value when the checkbox is not checked (default `true`) |\n| \\*               |        | Additional attributes will be forwarded to the underlying element.     |\n\n#### Radio\n\n```bladehtml\n\n\u003cx-bs::radio\n    label=\"Contact choice\"\n    name=\"contact_choice\"\n    value=\"email\"\n    @checked($user-\u003econtact_choice === 'email')\n/\u003e\n```\n\n| Attribute | Type   | Description                                                        |\n| --------- | ------ | ------------------------------------------------------------------ |\n| name      | string | _Required_. Name of the element                                    |\n| label     | string | If present, renders a `Label` aside the input radio                |\n| checked   | bool   | Initial checked value (default `false`)                            |\n| value     | string | The value submitted when the checkbox is checked                   |\n| \\*        |        | Additional attributes will be forwarded to the underlying element. |\n\n#### Label\n\nAll form components automatically include the `Label` component when the `label` attribute is present, but it can be used independently:\n\n```bladehtml\n\n\u003cx-bs::label name=\"email\"\u003e\n    User email\n\u003c/x-bs::label\u003e\n```\n\n### Changelog\n\nPlease see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.\n\n## Contributing\n\nPlease see [CONTRIBUTING](CONTRIBUTING.md) for details.\n\n### Security\n\nIf you discover any security related issues, please\nemail [balduzzi.giorgio@tiknil.com](mailto:balduzzi.giorgio@tiknil.com) instead of using the issue tracker.\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE.md) for more information.\n\n---\n\nThis package was generated using the [Laravel Package Boilerplate](https://laravelpackageboilerplate.com), following the\n[laravelpackage.com](https://laravelpackage.com) documentation.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftiknil%2Fbs-blade-forms","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftiknil%2Fbs-blade-forms","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftiknil%2Fbs-blade-forms/lists"}