Nothing
inst/lib/bs-colorpicker/README.md
In bslib: Custom 'Bootstrap' 'Sass' Themes for 'shiny' and 'rmarkdown'
Bootstrap Colorpicker
Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4.
Install
You can get the latest version in many different ways:
- Downloading the tarball from npm the registry: https://registry.npmjs.org/bootstrap-colorpicker/-/bootstrap-colorpicker-3.2.0.tgz (you can change the version in the url to any released tag)
- Cloning using Git:
git clone https://github.com/itsjavi/bootstrap-colorpicker.git
- Installing via NPM:
npm install bootstrap-colorpicker
- Installing via Yarn:
yarn add bootstrap-colorpicker
- Installing via Composer:
composer require itsjavi/bootstrap-colorpicker
Note that the dist files are only distributed via the NPM and Yarn installations.
For the rest methods, you will need to generate the files initializing the project with yarn install
and then building the code using npm run build.
Versions
Colorpicker version
Compatible Bootstrap version
Dependencies
v2.x
Documentation
Bootstrap 3 or 4
- jQuery >= 1.10
- Bootstrap CSS (input addon)
v3.x
Documentation
Bootstrap 4 or without Bootstrap
- jQuery >= 2.1.0
- Bootstrap CSS (input addon, popover)
- Bootstrap JS Bundle (popover)
Note that the plugin may work without Bootstrap if your code is not using any of the mentioned Bootstrap
dependencies.
Examples
With Bootstrap
The Bootstrap JS dependency is optional and it is mainly needed for the popover support.
No Bootstrap CSS is required for the plugin to work.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
<div class="demo">
<h1>Bootstrap Colorpicker Demo (with Bootstrap)</h1>
<input id="demo-input" type="text" value="rgb(255, 128, 0)" />
</div>
<script src="//code.jquery.com/jquery-3.4.1.js"></script>
<script src="//unpkg.com/bootstrap@4.3.1/dist/js/bootstrap.bundle.min.js"></script>
<script src="dist/js/bootstrap-colorpicker.js"></script>
<script>
$(function () {
// Basic instantiation:
$('#demo-input').colorpicker();
// Example using an event, to change the color of the #demo div background:
$('#demo-input').on('colorpickerChange', function(event) {
$('#demo').css('background-color', event.color.toString());
});
});
</script>
</body>
Without Bootstrap
To use the plugin without Bootstrap, the popover option should be set to false or null and, depending on your implementation,
you will usually need to set inline to true and a container selector option.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
<div id="demo">
<h1>Bootstrap Colorpicker Demo (without Bootstrap)</h1>
<input type="text" value="rgb(255, 128, 0)" />
</div>
<script src="//code.jquery.com/jquery-3.4.1.js"></script>
<script src="dist/js/bootstrap-colorpicker.js"></script>
<script>
$(function() {
$('#demo').colorpicker({
popover: false,
inline: true,
container: '#demo'
});
});
</script>
</body>
Contributions
This project exists thanks to all the people who contribute.
Please read CONTRIBUTING
before sending a pull request or issue.
License
The MIT License (MIT).
Please see the License File for more information.
Credits
Written and maintained by Javi Aguilar and all other contributors.
Based on Stefan Petre's color picker (2013).
Thanks to JetBrains for supporting this project.
Try the bslib package in your browser
Any scripts or data that you put into this service are public.
bslib documentation built on Sept. 11, 2024, 7:49 p.m.
R Package Documentation
Browse R Packages
We want your feedback!
Note that we can't provide technical support on individual packages. You should contact the package authors for that.
Bootstrap Colorpicker
Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4.
Install
You can get the latest version in many different ways:
- Downloading the tarball from npm the registry: https://registry.npmjs.org/bootstrap-colorpicker/-/bootstrap-colorpicker-3.2.0.tgz (you can change the version in the url to any released tag)
- Cloning using Git:
git clone https://github.com/itsjavi/bootstrap-colorpicker.git - Installing via NPM:
npm install bootstrap-colorpicker - Installing via Yarn:
yarn add bootstrap-colorpicker - Installing via Composer:
composer require itsjavi/bootstrap-colorpicker
Note that the dist files are only distributed via the NPM and Yarn installations.
For the rest methods, you will need to generate the files initializing the project with yarn install
and then building the code using npm run build.
Versions
Colorpicker version Compatible Bootstrap version Dependencies v2.x Documentation Bootstrap 3 or 4- jQuery >= 1.10
- Bootstrap CSS (input addon)
- jQuery >= 2.1.0
- Bootstrap CSS (input addon, popover)
- Bootstrap JS Bundle (popover)
Note that the plugin may work without Bootstrap if your code is not using any of the mentioned Bootstrap dependencies.
Examples
With Bootstrap
The Bootstrap JS dependency is optional and it is mainly needed for the popover support. No Bootstrap CSS is required for the plugin to work.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
<div class="demo">
<h1>Bootstrap Colorpicker Demo (with Bootstrap)</h1>
<input id="demo-input" type="text" value="rgb(255, 128, 0)" />
</div>
<script src="//code.jquery.com/jquery-3.4.1.js"></script>
<script src="//unpkg.com/bootstrap@4.3.1/dist/js/bootstrap.bundle.min.js"></script>
<script src="dist/js/bootstrap-colorpicker.js"></script>
<script>
$(function () {
// Basic instantiation:
$('#demo-input').colorpicker();
// Example using an event, to change the color of the #demo div background:
$('#demo-input').on('colorpickerChange', function(event) {
$('#demo').css('background-color', event.color.toString());
});
});
</script>
</body>
Without Bootstrap
To use the plugin without Bootstrap, the popover option should be set to false or null and, depending on your implementation,
you will usually need to set inline to true and a container selector option.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
<div id="demo">
<h1>Bootstrap Colorpicker Demo (without Bootstrap)</h1>
<input type="text" value="rgb(255, 128, 0)" />
</div>
<script src="//code.jquery.com/jquery-3.4.1.js"></script>
<script src="dist/js/bootstrap-colorpicker.js"></script>
<script>
$(function() {
$('#demo').colorpicker({
popover: false,
inline: true,
container: '#demo'
});
});
</script>
</body>
Contributions
This project exists thanks to all the people who contribute.
Please read CONTRIBUTING before sending a pull request or issue.
License
The MIT License (MIT). Please see the License File for more information.
Credits
Written and maintained by Javi Aguilar and all other contributors.
Based on Stefan Petre's color picker (2013).
Thanks to JetBrains for supporting this project.
Try the bslib package in your browser
Any scripts or data that you put into this service are public.
R Package Documentation
Browse R Packages
We want your feedback!
Note that we can't provide technical support on individual packages. You should contact the package authors for that.
Embedding an R snippet on your website
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.