{"id":18674242,"url":"https://github.com/simtabi/gechemba","last_synced_at":"2025-07-03T02:03:53.595Z","repository":{"id":57051514,"uuid":"428711029","full_name":"simtabi/gechemba","owner":"simtabi","description":"Bootstrap 5 components for Laravel Livewire.","archived":false,"fork":false,"pushed_at":"2021-11-16T15:32:05.000Z","size":14,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-05-18T11:07:32.768Z","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":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/simtabi.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-11-16T15:31:33.000Z","updated_at":"2022-03-26T19:56:06.000Z","dependencies_parsed_at":"2022-08-24T03:40:49.989Z","dependency_job_id":null,"html_url":"https://github.com/simtabi/gechemba","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/simtabi/gechemba","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/simtabi%2Fgechemba","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/simtabi%2Fgechemba/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/simtabi%2Fgechemba/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/simtabi%2Fgechemba/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/simtabi","download_url":"https://codeload.github.com/simtabi/gechemba/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/simtabi%2Fgechemba/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263245241,"owners_count":23436510,"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":[],"created_at":"2024-11-07T09:18:07.211Z","updated_at":"2025-07-03T02:03:53.554Z","avatar_url":"https://github.com/simtabi.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Laravel Livewire Forms\n\nLaravel Livewire form component with declarative Bootstrap 5 fields and buttons.\n\n## Requirements\n\n- Bootstrap 5\n\n## Installation\n\n```console\ncomposer require simtabi/gechemba\n```\n\n## Usage\n\nMake a new form:\n\n```console\nphp artisan make:form users.create-user-form\n```\n\nDeclare fields:\n\n```php\npublic function fields()\n{\n    return [\n        Input::make('name', 'Name'),\n        Input::make('email', 'Email')-\u003etype('email'),\n        Input::make('password', 'Password')-\u003etype('password'),\n    ];\n}\n```\n\nDeclare buttons:\n\n```php\npublic function buttons()\n{\n    return [\n        Button::make('Create User')-\u003eclick('createUser'),\n        Button::make('Cancel', 'secondary')-\u003eurl('/'),\n    ];\n}\n```\n\nDeclare rules:\n\n```php\npublic function rules()\n{\n    return [\n        'name' =\u003e ['required', 'string', 'max:255'],\n        'email' =\u003e ['required', 'string', 'email', 'max:255', 'unique:users'],\n        'password' =\u003e ['required', 'string', 'min:8'],\n    ];\n}\n```\n\nDeclare an action (notice the use of `-\u003eclick('createUser')` in the button example above:\n\n```php\npublic function createUser()\n{\n    $this-\u003evalidate();\n\n    User::create([\n        'name' =\u003e $this-\u003edata('name'),\n        'email' =\u003e $this-\u003edata('email'),\n        'password' =\u003e Hash::make($this-\u003edata('password')),\n    ]);\n\n    return redirect('/');\n}\n```\n\n## Full Page Forms\n\nCreate a full page form by specifying a `title`, `layout` and `route` to use:\n\n```php\nclass Login extends FormComponent\n{\n    public $title = 'Login';\n    public $layout = 'layouts.card';\n\n    public function route()\n    {\n        return Route::get('/login', static::class)\n            -\u003ename('login')\n            -\u003emiddleware('guest');\n    }\n```\n\nThe `route` method is made available by using my [laravel-livewire-routes](https://github.com/simtabi/laravel-livewire-routes) package.\n\n## Setting Initial Data\n\nYou can set the initial form data / defaults via the `data` array property in your component `mount` method:\n\n```php\nclass UpdateUserForm extends FormComponent\n{\n    public $title = 'Update User';\n    \n    public function route()\n    {\n        return Route::get('/users/update/{user}', static::class)\n            -\u003ename('users.update')\n            -\u003emiddleware('auth');\n    }\n    \n    public function mount(User $user)\n    {\n        $this-\u003edata = $user-\u003etoArray();\n    }\n```\n\n## Accessing Data\n\nUse the `data` method in the component to access current form data (you can use dot notation for array values):\n\n```php\npublic function createUser()\n{\n    User::create([\n        'name' =\u003e $this-\u003edata('name'),\n        'email' =\u003e $this-\u003edata('email'),\n        'likes_turtles' =\u003e $this-\u003edata('answers.likes_turtles'),\n    ]);\n}\n```\n\n## Data Binding\n\nMost fields allow you to change the way livewire binds data via helper methods that are chained to fields e.g.:\n\n```php\nInput::make('name', 'Name'), // defaults to defer\nInput::make('name', 'Name')-\u003einstant(), // bind on keyup \nInput::make('name', 'Name')-\u003edefer(), // bind on action \nInput::make('name', 'Name')-\u003elazy(), // bind on change\nInput::make('name', 'Name')-\u003edebounce(500), // bind after 500ms delay \n```\n\n## Sizing\n\nMany fields also allow you to specify a size for the input e.g.:\n\n```php\nInput::make('name', 'Name'), // defaults to normal sizing\nInput::make('name', 'Name')-\u003esmall(), // small sizing\nInput::make('name', 'Name')-\u003elarge(), // large sizing\n```\n\n## Disabling\n\nSome fields allow you to disable or set them to readonly, and even plaintext for inputs:\n\n```php\nInput::make('name', 'Name')-\u003edisabled(),\nInput::make('name', 'Name')-\u003ereadonly(),\nInput::make('name', 'Name')-\u003eplaintext(),\n```\n\n## Helper Text\n\nSpecify helper text for a field by using the `help` method:\n\n```php\nInput::make('name', 'Name')-\u003ehelp('Please tell us your name!'),\n```\n\n## Available Fields\n\n### Alert `($message, $style = 'success')`\n\nAn alert box.\n\n```php\nAlert::make('It worked!'),\nAlert::make('Something bad happened.', 'danger'),\nAlert::make('Something else happened.')-\u003edismissible(),\n```\n\nThe `$style` parameter accepts a bootstrap alert style e.g. `success`, `danger`, `primary`, etc. Use the `dismissible` method to make the alert dismissible.\n\nAvailable methods: `dismissible`\n\n### Arrayable `($name, $label = null)`\n\nAn array of fields.\n\n```php\nArrayable::make('locations', 'Locations')-\u003efields([\n    Input::make('city')-\u003eplaceholder('City'),\n    Select::make('state')-\u003eplaceholder('State')-\u003eoptions(['FL', 'TX']),\n]),\n```\n\nAvailable methods: `fields`, `help`, `disabled`\n\n### Button `($label = 'Submit', $style = 'primary')`\n\nA button used for actions and links.\n\n```php\nButton::make('Register')-\u003eclick('register'),\nButton::make('Already registered?', 'secondary')-\u003eroute('login'),\nButton::make('Go back home', 'link')-\u003eurl('/'),\n```\n\nThe `$style` parameter accepts a bootstrap button style e.g. `primary`, `outline-secondary`, `link`, etc. Use the `block` method to make a button full width.\n\nAvailable methods: `block`, `click`, `href`, `route`, `url`\n\n### Checkbox `($name, $label)`\n\nA checkbox field.\n\n```php\nCheckbox::make('accept', 'I accept the terms'),\nCheckbox::make('accept', 'I accept')-\u003ehelp('Please accept our terms'),\nCheckbox::make('active', 'This user is active')-\u003eswitch(),\n```\n\nUse the `switch` method to style the checkbox as a switch.\n\nAvailable methods: `switch`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`\n\n### Checkboxes `($name, $label = null)`\n\nAn array of checkbox fields.\n\n```php\nCheckboxes::make('colors', 'Colors')-\u003eoptions(['Red', 'Green', 'Blue']),\n```\n\nAvailable methods: `options`, `switch`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`\n\n### Color `($name, $label = null)`\n\nA color picker field.\n\n```php\nColor::make('hair_color', 'Hair Color'),\n```\n\nAvailable methods: `small`, `large`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`, `readonly`\n\n### Conditional\n\nA statement used to conditionally show fields.\n\n```php\nConditional::if($this-\u003edata('color') == 'green', [\n    Input::make('green', 'Green'),\n])-\u003eelseif($this-\u003edata('color') == 'blue', [\n    Input::make('blue', 'Blue'),\n])-\u003eelse([\n    Input::make('red', 'Red'),\n]),\n```\n\nAvailable methods: `if`, `elseif`, `else`\n\n### DynamicComponent `($name, $attrs = [])`\n\nA field used to display dynamic third-party components.\n\n```php\nDynamicComponent::make('honey'),\nDynamicComponent::make('honey', ['recaptcha' =\u003e true]),\n```\n\nThis would translate to `\u003cx-honey/\u003e` and `\u003cx-honey recaptcha=\"recaptcha\"/\u003e` in your form.\n\n### File `($name, $label = null)`\n\nA file upload field.\n\n```php\nFile::make('avatar', 'Avatar'),\nFile::make('photos', 'Photos')-\u003emultiple(),\nFile::make('documents', 'Documents')-\u003emultiple()-\u003edisk('s3'),\n```\n\nUse the `multiple` method to allow multiple file uploads. Optionally specify the filesystem disk to use via the `disk` method (used for linking to files, defaults to the filesystem config `default`).\n\nAvailable methods: `disk`, `multiple`, `help`, `disabled`\n\n### Input `($name, $label = null)`\n\nAn input field.\n\n```php\nInput::make('name', 'Name'),\nInput::make('phone')-\u003eplaceholder('Phone')-\u003etype('tel'),\nInput::make('email', 'Email')-\u003etype('email')-\u003elarge(),\nInput::make('price', 'Price')-\u003etype('number')-\u003eappend('$')-\u003eprepend('.00'),\n```\n\nThe `type` method accepts a standard HTML input type. As with other inputs, use `small` or `large` to resize an input. Input fields also support appends/prepends, and even plaintext.\n\nAvailable methods: `small`, `large`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`, `readonly`, `placeholder`, `type`, `append`, `prepend`, `plaintext`\n\n### Radio `($name, $label = null)`\n\nA radio field.\n\n```php\nRadio::make('gender', 'Gender')-\u003eoptions(['Male', 'Female']),\n```\n\nAvailable methods: `options`, `switch`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`\n\n### Select `($name, $label = null)`\n\nA select dropdown field.\n\n```php\nSelect::make('color', 'Color')-\u003eoptions(['Red', 'Green', 'Blue']),\nSelect::make('color', 'Color')-\u003eoptions([\n    '#ff0000' =\u003e 'Red',\n    '#00ff00' =\u003e 'Green',\n    '#0000ff' =\u003e 'Blue',\n])-\u003einstant(),\nSelect::make('user_id', 'User')-\u003eoptions(User::pluck('name', 'id')-\u003etoArray()),\n```\n\nAvailable methods: `options`, `small`, `large`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`, `placeholder`\n\n### Textarea `($name, $label = null)`\n\nA textarea field.\n\n```php\nInput::make('bio', 'Biography'),\nInput::make('bio', 'Biography')-\u003erows(5),\n```\n\nAvailable methods: `small`, `large`, `help`, `instant`, `defer`, `lazy`, `debounce`, `disabled`, `readonly`, `placeholder`, `rows`\n\n### View `($name, $data = [])`\n\nUsed to render a custom Blade view inside the form.\n\n```php\nView::make('custom-view', ['hello' =\u003e 'world']),\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsimtabi%2Fgechemba","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsimtabi%2Fgechemba","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsimtabi%2Fgechemba/lists"}