PHPackages next-tech/moonshine-lunar-chat - 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. [Utility & Helpers](/categories/utility) 4. / 5. next-tech/moonshine-lunar-chat ActiveLibrary[Utility & Helpers](/categories/utility) next-tech/moonshine-lunar-chat ============================== Chat UI components for MoonShine 4 v1.0.3(3mo ago)1038↓50%MITPHPPHP ^8.2 Since Feb 8Pushed 3mo agoCompare [ Source](https://github.com/NextTech-coder/moonshine-lunar-chat)[ Packagist](https://packagist.org/packages/next-tech/moonshine-lunar-chat)[ RSS](/packages/next-tech-moonshine-lunar-chat/feed)WikiDiscussions 1.x Synced 1mo ago READMEChangelog (4)Dependencies (1)Versions (3)Used By (0) [![LunarChat](https://camo.githubusercontent.com/2349451299c1a7e01f80378790368b43cbfcb4a99693fd5e8a175de9aed0b5da/68747470733a2f2f62616e6e6572732e6265796f6e64636f2e64652f4c756e6172253230436861742e706e673f7468656d653d6461726b267061636b6167654d616e616765723d636f6d706f7365722b72657175697265267061636b6167654e616d653d6e6578742d746563682532466d6f6f6e7368696e652d6c756e61722d63686174267061747465726e3d617263686974656374267374796c653d7374796c655f31266465736372697074696f6e3d436861742b55492b636f6d706f6e656e74732b666f722b4d6f6f6e7368696e652b34266d643d312673686f7757617465726d61726b3d3026666f6e7453697a653d313030707826696d616765733d6d6f6f6e)](https://camo.githubusercontent.com/2349451299c1a7e01f80378790368b43cbfcb4a99693fd5e8a175de9aed0b5da/68747470733a2f2f62616e6e6572732e6265796f6e64636f2e64652f4c756e6172253230436861742e706e673f7468656d653d6461726b267061636b6167654d616e616765723d636f6d706f7365722b72657175697265267061636b6167654e616d653d6e6578742d746563682532466d6f6f6e7368696e652d6c756e61722d63686174267061747465726e3d617263686974656374267374796c653d7374796c655f31266465736372697074696f6e3d436861742b55492b636f6d706f6e656e74732b666f722b4d6f6f6e7368696e652b34266d643d312673686f7757617465726d61726b3d3026666f6e7453697a653d313030707826696d616765733d6d6f6f6e) About ----- [](#about) Lunar Chat is a chat UI component for MoonShine 4 that allows you to display chat messages, handle multiple content blocks, and integrate real-time updates via WebSockets. ``` [ 'id' => 1, // ID for message 'author_id' => rand(1, 9999), // ID the author 'sent' => true, // Boolean indicating whether the message was sent by the current user (true) or received (false) 'author' => 'John Doe', // The display name of the author of the message 'time' => now()->format('H:i'), // Timestamp of the message in "hours:minutes" format 'blocks' => [ ['type' => 'paragraph', 'contents' => ['Hello, how are you today?']], // Each block represents a part of the message. // 'type' can be 'paragraph', 'image', etc. // 'contents' is an array of strings that make up the block. ], 'avatar' => 'https://i.pravatar.cc/150?img=11', // URL for the author's avatar image ] ``` [![Preview](preview/preview.png)](preview/preview.png) Features -------- [](#features) - Multiple content blocks per message (paragraphs) - Customizable title and placeholder - WebSocket support for real-time chat - Private/public chat mode - Fully type-safe with `ChatMessageCollection` and `ChatMessageObject` Install ------- [](#install) ``` composer require next-tech/moonshine-lunar-chat ``` ### Publish assets (JS & CSS): [](#publish-assets-js--css) ``` php artisan vendor:publish --tag=moonshine-lunar-chat-assets ``` Usage ----- [](#usage) ``` use NextTech\MoonShineLunarChat\Components\LunarChat; use NextTech\MoonShineLunarChat\Collections\ChatMessageCollection; // Create a ChatMessageCollection first $messages = ChatMessageCollection::fromArray($data); // Configure the chat component LunarChat::make(title: 'Team Chat', placeholder: 'Type your message...') ->messages($messages) // Pass the collection of messages (ChatMessageCollection) ->websocket('chat-channel', 'NewMessageEvent') // Connect a WebSocket: channel and event for real-time messages ->private() // Make the chat private (for single user or restricted group) ->action('sendMessage') // Set the action name for sending messages through the form ->user(auth()->id()); // Set the current user's ID ``` ``` use NextTech\MoonShineLunarChat\Components\LunarChat; use NextTech\MoonShineLunarChat\Collections\ChatMessageCollection; protected function components(): iterable { $messages = ChatMessageCollection::fromArray([ [ 'id' => 1, 'author_id' => 123, 'sent' => true, 'author' => 'John Doe', 'time' => now()->format('H:i'), 'blocks' => [ ['type' => 'paragraph', 'contents' => ['Hello, how are you today?']], ], 'avatar' => 'https://i.pravatar.cc/150?img=11', ], [ 'id' => 2, 'author_id' => 456, 'sent' => false, 'author' => 'Jane Smith', 'time' => now()->addMinute()->format('H:i'), 'blocks' => [ ['type' => 'paragraph', 'contents' => ['Hi John! I\'m good, thanks.']], ], 'avatar' => 'https://i.pravatar.cc/150?img=12', ], ]); return [ LunarChat::make(title: 'Team Chat', placeholder: 'Type your message...') ->messages($messages) ->websocket('chat-channel', 'NewMessageEvent'), ]; } ``` ### Example with multiple blocks [](#example-with-multiple-blocks) ``` [ 'sent' => true, 'author' => 'John Doe', 'time' => now()->format('H:i'), 'blocks' => [ [ 'type' => 'paragraph', 'contents' => ['I\'m doing well.'], ], [ 'type' => 'paragraph', 'contents' => ['Today is very busy.'], ], ], ] ``` Creating a Single Message ------------------------- [](#creating-a-single-message) You can create a single chat message using the `ChatMessageObject` and add it to a `ChatMessageCollection`. This is useful if you want to dynamically append messages instead of passing an array all at once. ``` use NextTech\MoonShineLunarChat\Collections\ChatMessageCollection; use NextTech\MoonShineLunarChat\DataTransferObject\ChatMessageObject; use NextTech\MoonShineLunarChat\DataTransferObject\ChatBlockObject; $message = new ChatMessageObject( 'id' => 2, 'author_id' => 456, 'sent' => false, 'author' => 'Jane Smith', 'time' => now()->addMinute()->format('H:i'), blocks: [ new ChatBlockObject('paragraph', ['Hello, how are you today?']) ], avatar: 'https://i.pravatar.cc/150?img=11' ); // Create a collection and add the message $collection = new ChatMessageCollection(); $collection->addMessage($message); ``` Example: Label / Divider message -------------------------------- [](#example-label--divider-message) If you want to add a label or system message, you can create a message with a `label` block: ``` $labelMessage = [ 'label' => '--- Lunar Chat ---' ]; $collection->addMessage($labelMessage); ``` ### Notes [](#notes) - `blocks` can contain multiple paragraphs, images, or other content types. - `Label messages` are rendered differently in the chat UI but are still valid ChatMessageObject. - Using `addMessage()` ensures type safety and allows IDE autocomplete for message properties. WebSocket Integration --------------------- [](#websocket-integration) Lunar Chat supports real-time updates via WebSockets, using Laravel Echo (Pusher or compatible driver). This allows your chat to automatically update when new messages arrive. ### Requirements [](#requirements) - Laravel Echo must be available in the frontend (`window.Echo`) - A WebSocket backend (Pusher, Soketi, Laravel Reverb, etc.) - Events in Laravel broadcasting new messages ### Initialize Lunar Chat with WebSocket [](#initialize-lunar-chat-with-websocket) ``` use NextTech\MoonShineLunarChat\Collections\ChatMessageCollection; use NextTech\MoonShineLunarChat\Components\LunarChat; $messages = ChatMessageCollection::fromArray($data); LunarChat::make(title: 'Team Chat', placeholder: 'Type your message...') ->messages($messages) ->websocket('chat-channel', 'NewMessageEvent'); // { if (message.sent && message.author_id === this.userId) { return; } this.handleIncomingMessage(message); }); } catch (error) { console.error('Subscribe error:', error); this.showToast('Failed to subscribe to channel', 'error'); } } ``` ### Notes [](#notes-1) - The event payload must contain the same structure (`id`, `authorId`, `sent`, `author`, `time`, `blocks`, `avatar`) as in your PHP array. ### Health Score 41 — FairBetter than 89% of packages Maintenance82 Actively maintained with recent releases Popularity17 Limited adoption so far Community6 Small or concentrated contributor base Maturity47 Maturing project, gaining track record 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 ~1 days Total 3 Last Release 92d ago PHP version history (2 changes)v1.0.0PHP ^8.4 v1.0.3PHP ^8.2 ### Community Maintainers ![](https://www.gravatar.com/avatar/f107ca64c3e5a7d076056c6cc89e53f92caee9736641addc580b59871dc3f8aa?d=identicon)[NextTech-coder](/maintainers/NextTech-coder) --- Top Contributors [![NextTech-coder](https://avatars.githubusercontent.com/u/172751968?v=4)](https://github.com/NextTech-coder "NextTech-coder (16 commits)") --- Tags laravelmoonshinemoonshine-laravelphp ### Embed Badge ![Health badge](/badges/next-tech-moonshine-lunar-chat/health.svg) ``` [![Health](https://phpackages.com/badges/next-tech-moonshine-lunar-chat/health.svg)](https://phpackages.com/packages/next-tech-moonshine-lunar-chat) ``` PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)