Improved content in repos
This commit is contained in:
parent
739212fec5
commit
375ee1de02
3 changed files with 6 additions and 79 deletions
BIN
img/content/ember-select-light-tailwind-animated.gif
Normal file
BIN
img/content/ember-select-light-tailwind-animated.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 52 KiB |
|
@ -1,20 +1,18 @@
|
|||
---
|
||||
tags: repos
|
||||
title: ember-select-light
|
||||
description: Ember Select Light is an Ember Addon focused on simplicity. Just powerful enough to offer expected baseline functionality while being easy to implement, style, and make accessible.
|
||||
description: The simplest Ember <select> there is.
|
||||
date: 2020-11-05
|
||||
pinned: true
|
||||
---
|
||||
|
||||
[Fork from Github](https://github.com/ember-a11y/ember-select-light)
|
||||
|
||||
# Ember-Select-Light
|
||||
ember-select-light is an Ember Addon focused on simplicity. Just powerful enough to offer expected baseline functionality while being easy to implement, style, and make accessible.
|
||||
|
||||
   [](https://badge.fury.io/js/ember-select-light) [](https://emberobserver.com/addons/ember-select-light)
|
||||

|
||||
|
||||
Ember-Select-Light is an Ember Addon focused on simplicity. Just powerful enough to offer expected baseline functionality while being easy to implement, style, and make accessible.
|
||||
|
||||
This addon is [Octane ready](https://emberjs.com/editions/octane/) and follows [ember-component-pattern's for how to best write a Select Element](https://emberjs-1.gitbook.io/ember-component-patterns/form-components/select-element).
|
||||
This addon is [Octane ready](https://emberjs.com/editions/octane/) and follows [ember-component-pattern's for how to best write a Select Element](https://emberjs-1.gitbook.io/ember-component-patterns/form-components/select-element). Additionally, it was coded completely with TDD (Test-Driven Design) so you can expect quality test coverage!
|
||||
|
||||
## Getting Started
|
||||
|
||||
|
@ -31,74 +29,5 @@ ember install ember-select-light
|
|||
@change={{action "handleChange"}} />
|
||||
```
|
||||
|
||||
#### With an array of objects...
|
||||
|
||||
```handlebars
|
||||
<SelectLight
|
||||
@options=(array
|
||||
(hash value="shortfin" label="Shortfin Shark")
|
||||
(hash value="mako" label="Mako Shark")
|
||||
) />
|
||||
```
|
||||
|
||||
`value` and `label` will be the default object keys used unless `@valueKey="...` and/or `@displayKey="...` are used respectively, like so...
|
||||
|
||||
```handlebars
|
||||
<SelectLight
|
||||
@options=(array
|
||||
(hash myValue="shortfin" myLabel="Shortfin Shark")
|
||||
(hash myValue="mako" myLabel="Mako Shark")
|
||||
)
|
||||
@valueKey="myValue"
|
||||
@displayKey="myLabel" />
|
||||
```
|
||||
|
||||
#### As a Yield
|
||||
|
||||
```handlebars
|
||||
<SelectLight>
|
||||
<option value="clown">Clown Fish</option>
|
||||
<option value="cat">Cat Fish</option>
|
||||
</SelectLight>
|
||||
```
|
||||
|
||||
### Other arguments
|
||||
|
||||
Other arguments are spread onto the `<select ...attributes` as you'd expect, allowing you to use common attributes such as `disabled`, `tabindex` and of course `class`.
|
||||
|
||||
```handlebars
|
||||
<SelectLight class="my-select" disabled="true" />
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Upgrading
|
||||
|
||||
See [the upgrading guide for how to upgrade from previous versions](./UPGRADE.md).
|
||||
|
||||
---
|
||||
|
||||
## Running
|
||||
|
||||
* `ember serve`
|
||||
* Visit your app at [http://localhost:4200](http://localhost:4200).
|
||||
|
||||
### Linting
|
||||
|
||||
* `npm run lint:hbs`
|
||||
* `npm run lint:js`
|
||||
* `npm run lint:js -- --fix`
|
||||
|
||||
## Contributing
|
||||
|
||||
We love pull requests from everyone. By participating in this project, you agree to abide by the [code of conduct](./code-of-conduct.md) and is subject to the [project license](./LICENSE.md).
|
||||
|
||||
Clone this repo, make your changes with test coverage, push up a fork and [submit a pull request](https://github.com/sharpshark28/ember-select-light/compare).
|
||||
|
||||
Soon after some primary contributors will review your code and submit feedback and hopefully click the fancy green approve button. Any test and linting failures should be caught during the pull request continuous integration environment and human eyes here after.
|
||||
|
||||
## Running Tests
|
||||
|
||||
* `npm run test` (Runs `ember try:each` to test your addon against multiple Ember versions)
|
||||
* or `ember test`
|
||||
[Far more examples are available on GitHub](https://github.com/ember-a11y/ember-select-light).
|
||||
|
||||
|
|
|
@ -6,9 +6,7 @@ date: 2020-03-21
|
|||
pinned: true
|
||||
---
|
||||
|
||||
[Fork from Gitlab](https://gitlab.com/gaiety/sortable-recipes)
|
||||
|
||||
#  Sortable-Recipes
|
||||
[Fork from GitLab](https://gitlab.com/gaiety/sortable-recipes)
|
||||
|
||||
[ Watch the talk here](https://gaiety.life/a11y-first-and-everyone-wins)
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue