moodle_local_treestudyplan/amd/build/vue-hsluv-picker.min.js

define("local_treestudyplan/vue-hsluv-picker",["exports","./hsluvpicker"],(function(_exports,_hsluvpicker){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0;var _default={name:"hsluv-picker",props:{value:{type:String,default:"#cccccc"},nodisplay:{type:Boolean,default:!1},displaysize:{type:String,default:300},horizontal:{type:Boolean,default:!1}},watch:{value:function(newVal){newVal!=this.currentcolor&&(this.$refs.picker.dispatchEvent(new CustomEvent("updatecolor",{detail:newVal})),this.currentcolor=newVal)}},data:function(){return{currentcolor:""}},methods:{onColorChange:function(event){this.currentcolor=event.detail,this.$emit("input",event.detail)}},mounted:function(){this.currentcolor=this.value,(0,_hsluvpicker.InitializePicker)(this.$refs.picker,this.value)},template:'\n        <div ref="picker" @colorchange="onColorChange" :class="\'vue-hsluv-picker\'+(horizontal?\' horizontal\':\'\')">\n            <div v-if="!nodisplay" class="display">\n                <canvas :height="displaysize" :width="displaysize"></canvas>\n            </div>\n            <table class=\'picker\'>\n                <tr class="control-h">\n                    <td class="cell-input">\n                        <input type="number" min="0" max="360" step="any" class="counter counter-hue" tabindex="0"/>\n                    </td>\n                    <td><div class="range-slider"></div></td>\n                    <td class="picker-label">H</td>\n                </tr>\n                <tr class="control-s">\n                    <td class="cell-input">\n                        <input type="number" step="any" min="0" max="100" class="counter counter-saturation"/>\n                    </td>\n                    <td><div class="range-slider"></div></td>\n                    <td class="picker-label">S</td>\n                </tr>\n                <tr class="control-l">\n                    <td class="cell-input">\n                        <input type="number" step="any" min="0" max="100" class="counter counter-lightness"/>\n                    </td>\n                    <td><div class="range-slider"></div></td>\n                    <td class="picker-label">L</td>\n                </tr>\n                <tr>\n                    <td class="cell-input cell-input-hex">\n                        <input ref="input" class="input-hex" pattern="#?[0-9a-fA-F]{6}"/>\n                    </td>\n                    <td><div class="swatch"></div></td>\n                    <td></td>\n                </tr>\n            </table>\n        </div>\n    </div>\n'};return _exports.default=_default,_exports.default}));

//# sourceMappingURL=vue-hsluv-picker.min.js.map