https://github.com/yardinternet/brave-components
Collection of logic-heavy components used in Brave projects.
https://github.com/yardinternet/brave-components
Last synced: 3 months ago
JSON representation
Collection of logic-heavy components used in Brave projects.
- Host: GitHub
- URL: https://github.com/yardinternet/brave-components
- Owner: yardinternet
- License: mit
- Created: 2025-02-25T14:54:40.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-12-05T12:14:33.000Z (7 months ago)
- Last Synced: 2025-12-14T16:55:56.257Z (7 months ago)
- Language: PHP
- Homepage:
- Size: 522 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# Brave components
[](https://github.com/yardinternet/brave-components/actions/workflows/format-php.yml)
[](https://github.com/yardinternet/brave-components/actions/workflows/phpstan.yml)
[](https://github.com/yardinternet/brave-components/actions/workflows/run-tests.yml)
[](https://github.com/yardinternet/brave-components/actions/workflows/badges.yml)
[](https://github.com/yardinternet/brave-components/actions/workflows/badges.yml)
Collection of logic-heavy components used in Brave projects.
## Requirements
- [Sage](https://github.com/roots/sage) >= 10.0
- [Acorn](https://github.com/roots/acorn) >= 4.0
## Installation
To install this package using Composer, follow these steps:
1. Install this package with Composer:
```sh
composer require yard/brave-components
```
2. Run the Acorn WP-CLI command to discover this package:
```shell
wp acorn package:discover
```
You can publish the config file with:
```shell
wp acorn vendor:publish --provider="Yard\Brave\ComponentsServiceProvider"
```
To only publish the views, run:
```shell
wp acorn vendor:publish --provider="Yard\Brave\ComponentsServiceProvider" --tag="views"
```
## Components
### Back Button
Shows a back button that determines its link and text by checking the parent page. If the post has no parent, it sets the link to a predefined parent page slug or defaults to "javascript:history.back();".
Usage:
```blade
```
### Breadcrumb
Generate a breadcrumb based on the current page. Also adds posts added through the `parent-page` supports feature. Usage:
```blade
```
Or pass your own collection of items to show a custom breadcrumb:
```blade
```
### Dialog
Usage:
```blade
Open dialog
This is the content of the dialog.
Close dialog
```
### Pattern Content
Shows the content of a pattern by its slug. You can find the slug (post name) using the `wp post get` CLI command and providing the post ID.
Usage:
```blade
```
Configure the admin behavior of each pattern in the `components.php` config file to automatically save them as drafts (thus hiding them from the pattern inserter), prevent their deletion, and add custom labels in the admin view.
### Read Speaker
Adds a ReadSpeaker button on specific places with the component and automatically adds it to the content of H1 blocks in the post content. Make sure to configure the `readSpeaker` settings in the `components.php` config file to set your customer ID and other options.
Usage:
```blade
```
## About us
[](https://www.yard.nl/werken-bij/)