jakeydevs/form-components
Composer 安装命令:
composer require jakeydevs/form-components
包简介
Opinionated laravel form components based on Tailwind UI
README 文档
README
Package of inputs and design elements for forms based on Tailwind UI - very opinionated!
Install
composer require jakeydevs/form-components
Then you'll need to publish the components so Tailwind can pick up the styles:
php artisan publish:vendor
Add a new stack to your page template which will let any Javascript be used. All included JS libraries are loaded from CDN's
@stack('forms-head')
@stack('forms-js')
Components
Form Sections
Used to provide design scaffolding around a form. The SLOT should be used for the form content
<x-form-components-section title="test" description="test descreiption" type="stacked" />
| Variable | Required - Default | Description |
|---|---|---|
| title | Yes | Form title |
| description | No - null | Form description |
| type | No - two-col | Design type - two-col or stacked |
Form Inputs
Main HTML input. Can be typed into different options (text, datetime-local, number etc)
<x-form-components-input name="published_at" type="datetime-local" label="Article Published Date" help="Help" :bind="@$article" :value="now()->subMinutes(10)"/>
| Variable | Required - Default | Description |
|---|---|---|
| name | Yes | The input name - will come through in POST |
| type | No - text | Type of input |
| label | No | Label text - if omitted, label is not rendered |
| help | No | Help text - if omitted, help is not rendered |
| bind | No | Model the value is binded to |
Any extra attributes are cast onto the Input directly such as required and value (default)
Select
Select box with dropdown
<x-form-components-select
name="select-model"
label="Models"
help="Eloquent"
:bind="@$article"
:options="$users"
track="name"
display="email"
:value="$users->last()->name"
/>
| Variable | Required - Default | Description |
|---|---|---|
| name | Yes | The input name - will come through in POST |
| options | Yes | Either an array or object |
| label | No | Label text - if omitted, label is not rendered |
| help | No | Help text - if omitted, help is not rendered |
| track | No - id | Will become the KEY if an object is used for options |
| display | No - text | Will become what is displayed if an object is used for options |
| bind | No | Model the value is binded to |
Any extra attributes are cast onto the SELECT directly such as required
Checkbox
Toggle box for checkbox
<x-form-components-checkbox name="active" label="Make article active" help="Help" :bind="@$article" />
| Variable | Required - Default | Description |
|---|---|---|
| name | Yes | The input name - will come through in POST |
| label | No | Label text - if omitted, label is not rendered |
| help | No | Help text - if omitted, help is not rendered |
| bind | No | Model the value is binded to |
Value can be used as a way of forcing the default
统计信息
- 总下载量: 77
- 月度下载量: 0
- 日度下载量: 0
- 收藏数: 0
- 点击次数: 11
- 依赖项目数: 0
- 推荐数: 0
其他信息
- 授权协议: Unknown
- 更新时间: 2021-11-14