PHPackages                             tnt-freskim-veliu/livewire-spotlight-search - 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. [Search & Filtering](/categories/search)
4. /
5. tnt-freskim-veliu/livewire-spotlight-search

ActiveLibrary[Search & Filtering](/categories/search)

tnt-freskim-veliu/livewire-spotlight-search
===========================================

Laravel Livewire spotlight search component

1.0.5(3y ago)318MITPHPPHP ^7.4|^8.1

Since Jun 12Pushed 3y ago1 watchersCompare

[ Source](https://github.com/tnt-freskim-veliu/livewire-spotlight-search)[ Packagist](https://packagist.org/packages/tnt-freskim-veliu/livewire-spotlight-search)[ RSS](/packages/tnt-freskim-veliu-livewire-spotlight-search/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (6)DependenciesVersions (8)Used By (0)

Livewire Spotlight Search
=========================

[](#livewire-spotlight-search)

This package allows you to build a Livewire spotlight search.

Installation
------------

[](#installation)

You can install the package via composer:

```
composer require tnt-freskim-veliu/livewire-spotlight-search
```

Requirements
------------

[](#requirements)

This package uses `livewire/livewire` () under the hood.

It also uses TailwindCSS () for base styling, and Alpine JS () for reactivity.

Please make sure you include all of them dependencies before using this component.

Usage
-----

[](#usage)

In order to use this component, first you have to include script directive: `@livewireSpotlightSearchScript`

and then you can put the component: ``

after you have to publish config file:

```
php artisan vendor:publish --tag=livewire-spotlight-search-config
```

in the config you have to fill searchable key with classes that implements `Searchable` contract.

Example you can declare the UserSearch class that will handle the search.

```
return [
    'searchable' => 'App\SpotlightSearch\UserSearch'
];
```

Each class must include these methods like in example:

```
class UserSearch implements Searchable
{
    public function search(string $query): array
    {
        return User::query()
               ->where('name', 'LIKE', "%$query%")
               ->take(25)
               ->get()
               ->toArray();
    }

    public function group()
    {
        return "Users";
    }

    public function onSelect($id, Component $component)
    {
        //handle logic when the item is clicked
    }
}
```

The search modal can be open in many ways: `Cmd+k``Cmd+/` or by dispatching a browser event with name `open-spotlight`.

Please don't forget to change `tailwind.config.js` content part, by adding: `./vendor/tnt-freskim-veliu/resources/views/*.blade.php`, so tailwind will recognise the classes that we use.

Currently we support the dark mode and light mode by passing: `:on-dark-mode="bool""`

TODO
----

[](#todo)

- Add functionality to navigate inside items with keyup and keydown.
- Add command that will create spotlight search classes

### Changelog

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.

Contributing
------------

[](#contributing)

Please see [CONTRIBUTING](CONTRIBUTING.md) for details.

### Security

[](#security)

If you discover any security related issues, please email  or use the issue tracker.

Credits
-------

[](#credits)

- [Freskim Veliu](https://github.com/tnt-freskim-veliu)
- [All Contributors](../../contributors)

License
-------

[](#license)

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

###  Health Score

27

—

LowBetter than 49% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity10

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity61

Established project with proven stability

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

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 ~0 days

Total

7

Last Release

1430d ago

Major Versions

0.1 → 1.0.02022-06-12

### Community

Maintainers

![](https://www.gravatar.com/avatar/fc6af5a5a469b4804d8d71c8e98c422fd73efa608dc411f45b7b390d2af02998?d=identicon)[tnt-freskim-veliu](/maintainers/tnt-freskim-veliu)

---

Top Contributors

[![tnt-freskim-veliu](https://avatars.githubusercontent.com/u/74197546?v=4)](https://github.com/tnt-freskim-veliu "tnt-freskim-veliu (17 commits)")

---

Tags

livewirespotlight-searchsearchlivewirefreskim-veliulivewire-spotlight-search

### Embed Badge

![Health badge](/badges/tnt-freskim-veliu-livewire-spotlight-search/health.svg)

```
[![Health](https://phpackages.com/badges/tnt-freskim-veliu-livewire-spotlight-search/health.svg)](https://phpackages.com/packages/tnt-freskim-veliu-livewire-spotlight-search)
```

###  Alternatives

[elasticsearch/elasticsearch

PHP Client for Elasticsearch

5.3k178.3M943](/packages/elasticsearch-elasticsearch)[ruflin/elastica

Elasticsearch Client

2.3k50.4M203](/packages/ruflin-elastica)[solarium/solarium

PHP Solr client

93532.7M98](/packages/solarium-solarium)[opensearch-project/opensearch-php

PHP Client for OpenSearch

15024.3M65](/packages/opensearch-project-opensearch-php)[marcorieser/statamic-live-search

A Statamic Live Search realized with Laravel Livewire.

2210.5k](/packages/marcorieser-statamic-live-search)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)