rakoitde/cialpineui
Composer 安装命令：
composer require rakoitde/cialpineui
包简介
CodeIgniter 4 Cell Component based on AlpineJS
README 文档
README
CiAlpineUI is a library for CodeIgniter 4 that provides an elegant way to build UI components (Cells) powered by Alpine.js. It is designed to seamlessly integrate dynamic front-end behavior within your CodeIgniter 4 applications.
Features
- Component-based architecture for CodeIgniter 4.
- Fully integrated with Alpine.js for lightweight interactivity.
Installation
composer require rakoitde/cialpineui
Or if you are developing locally:
git clone https://github.com/rakoitde/cialpineui.git
cd cialpineui
composer install
Requirements
- PHP 8.3+
- CodeIgniter 4
Usage
- Create new Cell
php spark make:uicomponent New
Modify New Component:
<?php namespace App\Cells; use Rakoitde\CiAlpineUI\Cells\CiAlpineUiComponent; class NewCell extends CiAlpineUiComponent { public $count = 0; public function increment() { $this->count++; } public function decrement() { $this->count--; } }
- Modify New View (
app/Cells/new.php):
<div <?= $this->getXTags() ?>> <button x-on:click="$cell.increment">++</button> <span x-text="count"></span> <button x-on:click="$cell.decrement">--</button> <input type="text" x-model="count"> </div>
- Include AlpineJS, CiAlpineUiJs and the New component in your layout
<!doctype html>
<head>
<title>CiAlpineUi</title>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
</head>
<body>
<?= view_cell('App\Cells\NewCell') ?>
<?= $this->include('Rakoitde\CiAlpineUI\Views\CiAlpineUiJs') ?>
</body>
</html>
- Rendered component
<div x-data="{'count':0}" x-component="NewCell">
<button x-on:click="$cell.increment">++</button>
<span x-text="count">0</span>
<button x-on:click="$cell.decrement">--</button>
<input type="text" x-model="count">
</div>
Development
Scripts available:
composer analyze # Static analysis (phpstan, psalm, rector) composer test # Run PHPUnit tests composer cs # Check coding style composer cs-fix # Fix coding style
License
This project is licensed under the MIT License.
Contributing
Contributions, issues, and feature requests are welcome! Feel free to check issues page if you want to contribute.
Roadmap
- Publish initial stable version
- Expand documentation and examples
- Create a set of common UI components
统计信息
- 总下载量： 41
- 月度下载量： 0
- 日度下载量： 0
- 收藏数： 1
- 点击次数： 0
- 依赖项目数： 0
- 推荐数： 0
其他信息
- 授权协议： MIT
- 更新时间： 2025-04-27