包简介

Complete Design System for Laravel & Livewire 4 — 70+ Blade components, 5 Livewire components, Tailwind CSS v4, Alpine.js, dark mode, and fully customizable design tokens.

README 文档

README

Wirestack UI

Système de design complet pour Laravel & Livewire 4
70+ composants Blade · 5 composants Livewire · Tailwind CSS v4 · Mode sombre natif

À propos

Wirestack UI est un système de design clé en main pour les applications Laravel & Livewire. Il fournit une bibliothèque de composants cohérents, accessibles et entièrement personnalisables, propulsés par Tailwind CSS v4 et Alpine.js.

70+ composants Blade — boutons, formulaires, cartes, navigation, tableaux, modales…
5 composants Livewire — Modal, Drawer, Toast, DataTable, CommandPalette
Design tokens — personnalisation globale via variables CSS sans toucher aux composants
Mode sombre natif — prise en charge complète light / dark / system
Auto-découverte — aucune configuration manuelle du service provider

Installation

composer require darken10/wirestack

Le service provider est auto-découvert par Laravel. Aucune déclaration manuelle n'est nécessaire.

Consultez le guide d'installation complet → pour configurer les assets CSS, les directives Blade et les composants Livewire globaux.

Démarrage rapide

Ajoutez les directives dans votre layout principal :

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    @wsStyles
    @vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body>

    {{ $slot }}

    <livewire:ws::toast />

    @wsScripts
</body>
</html>

Puis utilisez les composants dans vos vues :

<x-ws::button variant="solid" color="primary" icon="plus">
    Créer un projet
</x-ws::button>

<x-ws::alert color="success" dismissible>
    Vos modifications ont été enregistrées.
</x-ws::alert>

<x-ws::card variant="elevated">
    <x-ws::card-header title="Tableau de bord" />
    <x-ws::card-body>
        Contenu de la carte...
    </x-ws::card-body>
</x-ws::card>

Documentation

Sujet	Lien
Installation	docs/installation.md
Configuration	docs/configuration.md
Design Tokens	docs/design-tokens.md
Directives Blade	docs/directives.md
API JavaScript	docs/javascript-api.md
Théming & Mode sombre	docs/theming.md

Composants Blade

Catégorie	Documentation
Atomes — Button, Badge, Avatar, Spinner…	docs/components/atoms.md
Formulaires — Input, Select, Toggle…	docs/components/forms.md
Mise en page — Card, Container, Stack…	docs/components/layout.md
Navigation — Breadcrumb, Pagination, Nav…	docs/components/navigation.md
Feedback — Alert, Progress, Skeleton…	docs/components/feedback.md
Données — Table, Stat, Timeline, Code…	docs/components/data-display.md
Interactifs — Dropdown, Tabs, Accordion…	docs/components/interactive.md

Composants Livewire

Composant	Documentation
Modal	docs/livewire/modal.md
Drawer	docs/livewire/drawer.md
Toast	docs/livewire/toast.md
DataTable	docs/livewire/datatable.md
CommandPalette	docs/livewire/command-palette.md

Prérequis

Dépendance	Version minimale
PHP	8.2+
Laravel	11.x ou 12.x
Livewire	4.x
Tailwind CSS	v4
Alpine.js	inclus avec Livewire 4

Contribuer

Les contributions sont les bienvenues. Merci de consulter CHANGELOG.md pour l'historique des versions et d'ouvrir une issue avant de soumettre une pull request majeure.

Licence

Wirestack UI est un logiciel open-source distribué sous licence MIT. Voir LICENSE.md.

darken10/wirestack 适用场景与选型建议

darken10/wirestack 是一款基于 PHP 开发的 Composer 扩展包，目前已累计 2 次下载、GitHub Stars 达 1，最近一次更新时间为 2026 年 04 月 01 日，在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向：「components」「laravel」「blade」「alpine」「design-system」「tailwindcss」等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 darken10/wirestack 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。

围绕 darken10/wirestack 我们能提供哪些服务？

定制开发 / 二次开发

基于 darken10/wirestack 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ：316430983 微信：yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

与 darken10/wirestack 相关的其它包

同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：

components/webfontloader 2

Web Font Loader gives you added control when using linked fonts via @font-face.

arc/xml 27

Ariadne Component Library: xml writer and parser Component

arc/cache 1

Ariadne Component Library: Cache Component

arc/config 0

Ariadne Component Library: hierarchical configuration management Component

arc/grants 1

Ariadne Component Library: user and group rights management Component

arc/events 0

Ariadne Component Library: W3C style events Component

darken10/wirestack

包简介

关键字：