README

为 Laravel Blade 和 Livewire 提供的 Grizzly UI 组件。

您可以使用这些组件的几种方式

直接从 composer 包中 - (例如 <x-input ...>)
通过将 blade 组件复制到您的项目 - (例如 <x-input ...>)

无论哪种方式，都建议包含 Tailwind 插件以获得最佳体验。

安装

要求

此包是为 Laravel、Livewire 和 Tailwind CSS 构建的，它需要

Laravel 10.x
Livewire 3.x
Tailwind CSS 3.x (如果使用 Tailwind 插件)
Tailwind CSS 表单插件

如何安装

将存储库添加到您的 composer.json 文件

此步骤是临时的（因为此包尚未在 Packagist 上发布），一旦发布，将予以删除。

"repositories": [
    {
        "type": "git",
        "url": "https://github.com/bearly-ui/ui"
    }
],

使用 composer 安装包和 Tailwind CSS 表单插件

composer require bearly/ui:dev-main
npm i --save-dev @tailwindcss/forms

接下来，将 Tailwind 插件添加到您的 tailwind.config.js 文件。

import forms from '@tailwindcss/forms'
import bearUI from './vendor/bearly/ui/ui'

// Currently Bear UI only supports ESM -- PRs welcome!
export default {
    // This is a workaround right now until I figure out how to get the
    // Tailwind plugin to configure its own content path automatically
    content: [
        // ...
        './vendor/bearly/ui/resources/**/*.blade.php'
    ],
    // ...
    plugins: [forms, bearUI],
}

运行构建并开始使用组件

npm run dev

直接从包中，或复制到您的项目中。

用法

使用组件

您可以直接从包中使用组件，通过在它们前面添加 x-ui:: 前缀

<x-input />

复制组件

进行中

开发设置

安装依赖项

克隆存储库并安装依赖项

git clone git@github.com:bearly-ui/ui.git
cd ./ui
npm install
composer install

运行测试

安装依赖项后，您应该能够使用 ./vendor/bin/phpunit 运行测试

bearly / ui

维护者

详细信息