chmod-checkbox
v0.0.41
Published
Simple and ready to use chmod based checkbox web component with StencilJS
Downloads
36
Readme
Chmod Checkbox comes with three (3) animated checkbox which includes READ, WRITE and EXECUTE values. These text values are customizable. It has built-in chmod calculator for each value.
Fundamental CHMOD Architecture
| Value | R | W | X | Description | | ----- | --- | --- | --- | ------------- | | 0 | 0 | 0 | 0 | NO_PERMISSION | | 1 | 1 | 0 | 0 | READ | | 2 | 0 | 1 | 0 | WRITE | | 3 | 1 | 1 | 0 | READ/WRITE | | 4 | 0 | 0 | 1 | EXECUTE | | 5 | 1 | 0 | 1 | READ/EXECUTE | | 6 | 0 | 1 | 1 | WRITE/EXECUTE | | 7 | 1 | 1 | 1 | ALL |
Installation
Script tag (Recommended: Painless)
- Put a script tag similar to this
<script src="https://unpkg.com/chmod-checkbox@latest/dist/chmod-checkbox.js"></script>
in the head of your index.html - Then you can use the element anywhere in your template, JSX, html etc
Node Modules
- Run
npm install chmod-checkbox --save
- Put a script tag similar to this
<script src='node_modules/chmod-checkbox/dist/chmod-checkbox.js'></script>
in the head of your index.html - Then you can use the element anywhere in your template, JSX, html etc
In a stencil-starter app
- Run
npm install chmod-checkbox --save
- Add an import to the npm packages
import chmod-checkbox;
- Then you can use the element anywhere in your template, JSX, html etc
Usage
<chmod-checkbox permission="0" />
How to get value from a prop?
document.querySelectorAll("chmod-checkbox")[0].base
document.querySelectorAll("chmod-checkbox")[0].permission
document.querySelectorAll("chmod-checkbox")[0].first
document.querySelectorAll("chmod-checkbox")[0].middle
document.querySelectorAll("chmod-checkbox")[0].last
Configuration - Props
| Property | Type | Default | Description | | ---------- | :----: | :-----: | --------------------------------- | | permission | number | 0 | get the changing permission value |
Future Plans
- [x] ~~LICENSE~~
- [ ] Customizable colors
- [ ] Make another web-component with just animated checkbox and implement it on this library
- [ ] Write an article about the lib on Medium
Author
FreakyCoder, [email protected]
License
WebComponent Chmod Checkbox is available under the MIT license. See the LICENSE file for more info.