{"id":13422998,"url":"https://github.com/tkaratug/livewire-smart-table","last_synced_at":"2025-03-17T16:11:50.234Z","repository":{"id":43654758,"uuid":"272236690","full_name":"tkaratug/livewire-smart-table","owner":"tkaratug","description":"An advanced datatable component for Laravel Livewire.","archived":false,"fork":false,"pushed_at":"2023-02-19T15:18:31.000Z","size":1465,"stargazers_count":92,"open_issues_count":0,"forks_count":14,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-03-02T13:11:54.003Z","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/tkaratug.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","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}},"created_at":"2020-06-14T16:06:48.000Z","updated_at":"2024-10-30T20:08:18.000Z","dependencies_parsed_at":"2025-02-17T11:47:58.197Z","dependency_job_id":null,"html_url":"https://github.com/tkaratug/livewire-smart-table","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tkaratug%2Flivewire-smart-table","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tkaratug%2Flivewire-smart-table/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tkaratug%2Flivewire-smart-table/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tkaratug%2Flivewire-smart-table/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tkaratug","download_url":"https://codeload.github.com/tkaratug/livewire-smart-table/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244066185,"owners_count":20392406,"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-07-30T23:01:05.094Z","updated_at":"2025-03-17T16:11:50.190Z","avatar_url":"https://github.com/tkaratug.png","language":"PHP","funding_links":[],"categories":["Datatables","Packages / Plugins"],"sub_categories":[],"readme":"# Livewire Smart Table\nAn advanced, dynamic datatable component with pagination, sorting, and searching including json data.\n\n![Livewire Smart Table Demo](demo/livewire-smart-table.gif)\n\n## Installation\n\nYou can install the package via composer:\n\n```bash\ncomposer require tkaratug/livewire-smart-table\n```\n\n## Requirements\nThis package uses livewire/livewire (https://laravel-livewire.com/) under the hood.\n\nIt also uses Tailwind (https://tailwindcss.com) for base styling.\n\nPlease make sure you include both of these dependencies before using this component.\n\n## Usage\nIn order to use this component, you must create a new Livewire component that extends from `LivewireSmartTable`\n\nYou can use `make:livewire` to create a new component. For example.\n\n```\nphp artisan make:livewire UserList\n```\n\nIn the `UserList` class, instead of extending from the base Livewire Component class, extend from `LivewireSmartTable` class.\nAlso, remove the render method. You'll have a class similar to this snippet. \n\nIn this class, you must define columns that you want to show in a table.\n\n```php\nclass UserList extends LivewireSmartTable\n{\n    $columns = [\n        'id' =\u003e [\n            'type' =\u003e 'string', // column type\n            'name' =\u003e 'Id', // column header\n            'class' =\u003e 'text-danger', // column class\n        ],\n        'name' =\u003e [\n            'type' =\u003e 'string',\n            'name' =\u003e 'Name',\n        ],\n        'email' =\u003e [\n            'type' =\u003e 'string',\n            'name' =\u003e 'E-Mail',\n        ],\n    ];\n}\n```\n\nKeys of columns array must be the same as column names in database table or key of a json object.\n\nTo render the component in a view, just use the Livewire tag or include syntax.\n\n```blade\n\u003clivewire:user-list :query=\"$query\" /\u003e\n```\n\n`$query` must be instance of an **Eloquent Collection**.\n\nFor example, create a `UserController` class, select users to show in a table and pass them to a view file.\n\n````php\nclass UserController extends Controller\n{\n    public function index()\n    {\n        $users = App\\User::where('is_active', '=', true)-\u003eget();\n\n        return view('users', ['users' =\u003e $users]);\n    }\n}\n````\n\nThen in `users.blade.php` use Livewire tag and give users to `query` attribute.\n```\n\u003clivewire:user-list :query=\"$users\" /\u003e\n```\n\n## Column Properties\n### ```string```\nIt is used for showing data as string in HTML table.\n\n### ```link```\nIt is used for showing data as link in HTML table. \n\nIn addition to type, you must define a `url` to redirect when clicked.\n```php\n$columns = [\n    'profile' =\u003e [\n        'type' =\u003e 'link',\n        'url' =\u003e 'http://example.com/users/{id}/profile',\n        'target' =\u003e '_blank'\n    ],\n];\n```\n\nIt is also possible to give parameters to the URL. All you need to do is give the column name containing the data you want to pass to the url in curly braces.\n\nLet's say you have a database table contains blog posts and each post has a slug. To show post titles in html table as a link, you need to define column as follows:\n```php\n'title' =\u003e [\n    'type' =\u003e 'link',\n    'url' =\u003e 'http://example.com/posts/{slug}',\n];\n```\nThe component is smart enough to find the `slug` field of current record and give it to the url.\n\n### ```json```\nIt is used for showing data from json columns. If you have a json column in your database table, you can show values from it in html table.\n\nLet's say you have a json column named `contact` in your database table and contains address details in it.\n\n`{\"address\":{\"country\":\"Turkey\",\"city\":\"Istanbul\",\"state\":\"Besiktas\"}}`\n\nTo show just the city in html table, you need to define column as follows:\n```php\n'city' =\u003e [\n    'type' =\u003e 'json',\n    'name' =\u003e 'City', // Text for column header\n    'from' =\u003e 'contact', // field that contains json data in a db table\n    'value' =\u003e 'address.city' // nested json value\n];\n```\nIt will find the json data from `contact` column, and take city value inside address key then show it on the table.\n\n### ```actions```\nIt is used for showing action links for each row in html table. \n\nYou need to give `element` and `url` keys for the html element of the link and url to redirect.\n\n```php\n'actions' =\u003e [\n    'type' =\u003e 'actions',\n    'name' =\u003e 'Actions', // Text for column header\n    'actions' =\u003e [\n        [\n            'element' =\u003e '\u003cbutton\u003eView\u003c/button\u003e',\n            'url' =\u003e 'http://example.com/users/{id}/profile'\n        ],\n        [\n            'element' =\u003e '\u003cbutton\u003eEdit\u003c/button\u003e',\n            'url' =\u003e 'http://example.com/users/{id}/edit'\n        ],\n    ]\n];\n```\n\n## Publishing Views\nYou can also publish the view files to customize them.\n\nAll you need to do is running the following command. Then the views will be copied into `/resources/views/vendor/livewire-smart-table` directory.\n\n```bash\nphp artisan vendor:publish --tag=livewire-smart-table-views\n```\n\n## Testing\n\n```bash\ncomposer test\n```\n\n## Security\n\nIf you discover any security related issues, please email tkaratug@hotmail.com.tr instead of using the issue tracker.\n\n## Credits\n\n- [Turan Karatuğ](https://github.com/tkaratug)\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE.md) for more information.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftkaratug%2Flivewire-smart-table","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftkaratug%2Flivewire-smart-table","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftkaratug%2Flivewire-smart-table/lists"}