| 1 | import Picker from './picker.js';
|
| 2 | class ColorPicker extends Picker {
|
| 3 | constructor(select, label) {
|
| 4 | super(select);
|
| 5 | this.label.innerHTML = label;
|
| 6 | this.container.classList.add('ql-color-picker');
|
| 7 | Array.from(this.container.querySelectorAll('.ql-picker-item')).slice(0, 7).forEach(item => {
|
| 8 | item.classList.add('ql-primary');
|
| 9 | });
|
| 10 | }
|
| 11 | buildItem(option) {
|
| 12 | const item = super.buildItem(option);
|
| 13 | item.style.backgroundColor = option.getAttribute('value') || '';
|
| 14 | return item;
|
| 15 | }
|
| 16 | selectItem(item, trigger) {
|
| 17 | super.selectItem(item, trigger);
|
| 18 | const colorLabel = this.label.querySelector('.ql-color-label');
|
| 19 | const value = item ? item.getAttribute('data-value') || '' : '';
|
| 20 | if (colorLabel) {
|
| 21 | if (colorLabel.tagName === 'line') {
|
| 22 | colorLabel.style.stroke = value;
|
| 23 | } else {
|
| 24 | colorLabel.style.fill = value;
|
| 25 | }
|
| 26 | }
|
| 27 | }
|
| 28 | }
|
| 29 | export default ColorPicker;
|
| 30 | |
| \ | No newline at end of file |