pickit-color 1.0.4 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/README.md +56 -0
  2. package/dist/colorpicker.js +126 -6
  3. package/dist/colorpicker.min.js +2 -2
  4. package/dist/esm/index.js +53 -5
  5. package/dist/esm/l10n/de.js +10 -0
  6. package/dist/esm/l10n/en.js +10 -0
  7. package/dist/esm/l10n/index.js +3 -0
  8. package/dist/esm/l10n/sl.js +10 -0
  9. package/dist/esm/tsconfig.esm.tsbuildinfo +1 -1
  10. package/dist/index.d.ts +15 -0
  11. package/dist/l10n/de.d.ts +3 -0
  12. package/dist/l10n/en.d.ts +3 -0
  13. package/dist/l10n/index.d.ts +3 -0
  14. package/dist/l10n/sl.d.ts +3 -0
  15. package/package.json +20 -2
  16. package/src/index.ts +97 -5
  17. package/src/l10n/README.md +94 -0
  18. package/src/l10n/de.ts +13 -0
  19. package/src/l10n/en.ts +13 -0
  20. package/src/l10n/index.ts +17 -0
  21. package/src/l10n/sl.ts +13 -0
package/README.md CHANGED
@@ -10,6 +10,7 @@ A modern, lightweight, and accessible color picker with HSL/RGBA support, preset
10
10
  - 🎯 **Multiple Color Formats**: HEX, HEX8, RGB, RGBA, HSL, HSLA
11
11
  - 🎚️ **Slider Mode**: Individual sliders for H, S, L, A values
12
12
  - 🎨 **2D Picker**: Traditional saturation/lightness picker
13
+ - 🎯 **Live Theme Builder**: Target elements for live color updates
13
14
  - 📌 **Preset Colors**: With optional labels and list view
14
15
  - 👁️ **Screen Color Picker**: EyeDropper API + System ColorPicker fallback
15
16
  - 🔲 **Compact Mode**: Minimal button interface
@@ -108,10 +109,65 @@ const picker = colorpicker('#myInput', {
108
109
  <input data-colorpicker="format:hex,inputPreview:true">
109
110
  ```
110
111
 
112
+ ### Live Theme Builder
113
+
114
+ ```html
115
+ <!-- Update background color of target element -->
116
+ <div id="preview-box">Live Preview</div>
117
+ <input data-colorpicker="format:hex,target:#preview-box,property:background-color">
118
+
119
+ <!-- Update text color -->
120
+ <input data-colorpicker="format:hex,target:#preview-box,property:color">
121
+ ```
122
+
123
+ ### Multilanguage Support
124
+
125
+ ```html
126
+ <!-- Auto-detects from <html lang="de"> or browser language -->
127
+ <input data-colorpicker="format:hex">
128
+
129
+ <!-- Explicitly set language -->
130
+ <input data-colorpicker="format:hex,language:de">
131
+ ```
132
+
133
+ **Built-in Languages:** `en` (English), `de` (Deutsch), `sl` (Slovenščina)
134
+
135
+ **Contributing Translations:**
136
+
137
+ 1. Create a file in `src/l10n/` (e.g., `fr.ts`)
138
+ 2. Copy the `ColorPickerLanguage` interface structure
139
+ 3. Export in `src/l10n/index.ts`
140
+ 4. Submit a PR!
141
+
142
+ See [TRANSLATIONS.md](TRANSLATIONS.md) for the complete guide.
143
+
144
+ **Runtime Translation:**
145
+
146
+ ```javascript
147
+ import colorpicker, { ColorPicker } from 'pickit-color';
148
+
149
+ // Add French translation
150
+ ColorPicker.addTranslation('fr', {
151
+ hue: 'Teinte',
152
+ saturation: 'Saturation et luminosité',
153
+ lightness: 'Luminosité',
154
+ alpha: 'Alpha',
155
+ presets: 'Couleurs prédéfinies',
156
+ eyeDropper: 'Pipette à couleurs',
157
+ systemPicker: 'Sélecteur système'
158
+ });
159
+
160
+ // Check available languages
161
+ console.log(ColorPicker.getAvailableLanguages()); // ['en', 'de', 'sl', 'fr']
162
+ ```
163
+
111
164
  ## ⚙️ Options
112
165
 
113
166
  | Option | Type | Default | Description |
114
167
  |--------|------|---------|-------------|
168
+ | `previewTarget` | `string` | `''` | CSS selector of element to update with color |
169
+ | `previewProperty` | `string` | `'background-color'` | CSS property to update on target element |
170
+ | `language` | `string` | `auto` | UI language: `en`, `de`, `sl` or custom (auto-detects from HTML or browser) |
115
171
  | `format` | `string` | `'hex'` | Color format: `hex`, `hex8`, `rgb`, `rgba`, `hsl`, `hsla` |
116
172
  | `showAlpha` | `boolean` | `false` | Show alpha/transparency slider |
117
173
  | `defaultColor` | `string` | `'#3b82f6'` | Initial color if input is empty |
package/dist/colorpicker.js CHANGED
@@ -1,4 +1,4 @@
1
- /* Pickit Color v1.0.4, @license Donationware */
1
+ /* Pickit Color v1.2.0, @license Donationware */
2
2
  (function (global, factory) {
3
3
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
4
4
  typeof define === 'function' && define.amd ? define(['exports'], factory) :
@@ -63,11 +63,82 @@
63
63
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
64
64
  };
65
65
 
66
+ var en = {
67
+ hue: "Hue",
68
+ saturation: "Saturation and Lightness",
69
+ lightness: "Lightness",
70
+ alpha: "Alpha",
71
+ presets: "Preset colors",
72
+ eyeDropper: "Pick color from screen",
73
+ systemPicker: "System color picker"
74
+ };
75
+
76
+ var de = {
77
+ hue: "Farbton",
78
+ saturation: "Sättigung und Helligkeit",
79
+ lightness: "Helligkeit",
80
+ alpha: "Transparenz",
81
+ presets: "Vordefinierte Farben",
82
+ eyeDropper: "Farbe vom Bildschirm aufnehmen",
83
+ systemPicker: "System-Farbwähler"
84
+ };
85
+
86
+ var sl = {
87
+ hue: "Odtenek",
88
+ saturation: "Nasičenost in svetlost",
89
+ lightness: "Svetlost",
90
+ alpha: "Prosojnost",
91
+ presets: "Prednastavljene barve",
92
+ eyeDropper: "Izberi barvo z zaslona",
93
+ systemPicker: "Sistemski izbirnik barv"
94
+ };
95
+
96
+ /**
97
+ * Pickit Color - Language Files
98
+ *
99
+ * To contribute a translation:
100
+ * 1. Copy en.ts or any existing language file
101
+ * 2. Translate all strings
102
+ * 3. Export your language in this file
103
+ * 4. Submit a PR!
104
+ */
105
+ // Example for contributors:
106
+ // export { default as fr } from './fr';
107
+ // export { default as es } from './es';
108
+
109
+ var languages = /*#__PURE__*/Object.freeze({
110
+ __proto__: null,
111
+ en: en,
112
+ de: de,
113
+ sl: sl
114
+ });
115
+
66
116
  /**
67
117
  * Pickit Color Picker
68
118
  * An accessible, lightweight color picker inspired by flatpickr
69
119
  * Supports HSL, RGB, HEX formats with keyboard navigation
70
120
  */
121
+ // Initialize translations with built-in languages
122
+ var translations = {
123
+ en: en,
124
+ de: de,
125
+ sl: sl
126
+ };
127
+ function detectLanguage() {
128
+ // Try HTML lang attribute
129
+ var htmlLang = document.documentElement.lang;
130
+ if (htmlLang) {
131
+ var lang = htmlLang.split('-')[0].toLowerCase();
132
+ if (translations[lang])
133
+ return lang;
134
+ }
135
+ // Try browser language
136
+ var browserLang = navigator.language.split('-')[0].toLowerCase();
137
+ if (translations[browserLang])
138
+ return browserLang;
139
+ // Default to English
140
+ return 'en';
141
+ }
71
142
  var ColorPicker = /** @class */ (function () {
72
143
  function ColorPicker(element, options) {
73
144
  if (options === void 0) { options = {}; }
@@ -117,6 +188,9 @@
117
188
  inline: (_f = options.inline) !== null && _f !== void 0 ? _f : false,
118
189
  compact: (_g = options.compact) !== null && _g !== void 0 ? _g : false,
119
190
  inputPreview: (_h = options.inputPreview) !== null && _h !== void 0 ? _h : false,
191
+ previewTarget: options.previewTarget || "",
192
+ previewProperty: options.previewProperty || "background-color",
193
+ language: options.language || detectLanguage(),
120
194
  onChange: options.onChange || (function () { }),
121
195
  onOpen: options.onOpen || (function () { }),
122
196
  onClose: options.onClose || (function () { }),
@@ -124,16 +198,41 @@
124
198
  position: options.position || "auto",
125
199
  closeOnSelect: (_j = options.closeOnSelect) !== null && _j !== void 0 ? _j : true,
126
200
  ariaLabels: {
127
- hue: ((_k = options.ariaLabels) === null || _k === void 0 ? void 0 : _k.hue) || "Hue",
128
- saturation: ((_l = options.ariaLabels) === null || _l === void 0 ? void 0 : _l.saturation) || "Saturation and Lightness",
129
- lightness: ((_m = options.ariaLabels) === null || _m === void 0 ? void 0 : _m.lightness) || "Lightness",
130
- alpha: ((_o = options.ariaLabels) === null || _o === void 0 ? void 0 : _o.alpha) || "Alpha",
131
- presets: ((_p = options.ariaLabels) === null || _p === void 0 ? void 0 : _p.presets) || "Preset colors",
201
+ hue: ((_k = options.ariaLabels) === null || _k === void 0 ? void 0 : _k.hue) || translations[options.language || detectLanguage()].hue,
202
+ saturation: ((_l = options.ariaLabels) === null || _l === void 0 ? void 0 : _l.saturation) || translations[options.language || detectLanguage()].saturation,
203
+ lightness: ((_m = options.ariaLabels) === null || _m === void 0 ? void 0 : _m.lightness) || translations[options.language || detectLanguage()].lightness,
204
+ alpha: ((_o = options.ariaLabels) === null || _o === void 0 ? void 0 : _o.alpha) || translations[options.language || detectLanguage()].alpha,
205
+ presets: ((_p = options.ariaLabels) === null || _p === void 0 ? void 0 : _p.presets) || translations[options.language || detectLanguage()].presets,
132
206
  },
133
207
  };
134
208
  this.init();
135
209
  ColorPicker.instances.set(this.input, this);
136
210
  }
211
+ /**
212
+ * Add a custom translation for the ColorPicker
213
+ * @param langCode - Language code (e.g., 'fr', 'es', 'it')
214
+ * @param translation - Translation object with all required strings
215
+ * @example
216
+ * ColorPicker.addTranslation('fr', {
217
+ * hue: 'Teinte',
218
+ * saturation: 'Saturation et luminosité',
219
+ * lightness: 'Luminosité',
220
+ * alpha: 'Alpha',
221
+ * presets: 'Couleurs prédéfinies',
222
+ * eyeDropper: 'Pipette à couleurs',
223
+ * systemPicker: 'Sélecteur système'
224
+ * });
225
+ */
226
+ ColorPicker.addTranslation = function (langCode, translation) {
227
+ translations[langCode.toLowerCase()] = translation;
228
+ };
229
+ /**
230
+ * Get all available language codes
231
+ * @returns Array of language codes
232
+ */
233
+ ColorPicker.getAvailableLanguages = function () {
234
+ return Object.keys(translations);
235
+ };
137
236
  ColorPicker.prototype.init = function () {
138
237
  // Parse initial color
139
238
  var initialColor = this.input.value || this.options.defaultColor;
@@ -665,6 +764,14 @@
665
764
  if (updateInput) {
666
765
  this.input.value = this.formatColor(this.currentColor);
667
766
  this.options.onChange(this.input.value);
767
+ // Update preview target if configured
768
+ if (this.options.previewTarget) {
769
+ var target = document.querySelector(this.options.previewTarget);
770
+ if (target) {
771
+ var property = this.options.previewProperty || 'background-color';
772
+ target.style.setProperty(property, this.input.value);
773
+ }
774
+ }
668
775
  // Update compact button preview
669
776
  if (this.compactButton) {
670
777
  var preview_1 = this.compactButton.querySelector('.colorpicker-compact-preview');
@@ -1021,6 +1128,18 @@
1021
1128
  case 'inputPreview':
1022
1129
  options.inputPreview = value === 'true' || value === '1';
1023
1130
  break;
1131
+ case 'target':
1132
+ case 'previewTarget':
1133
+ options.previewTarget = value;
1134
+ break;
1135
+ case 'property':
1136
+ case 'previewProperty':
1137
+ options.previewProperty = value;
1138
+ break;
1139
+ case 'lang':
1140
+ case 'language':
1141
+ options.language = value;
1142
+ break;
1024
1143
  }
1025
1144
  });
1026
1145
  }
@@ -1066,6 +1185,7 @@
1066
1185
  exports.ColorPicker = ColorPicker;
1067
1186
  exports.default = colorpicker;
1068
1187
  exports.initColorPickers = initColorPickers;
1188
+ exports.languages = languages;
1069
1189
 
1070
1190
  Object.defineProperty(exports, '__esModule', { value: true });
1071
1191
 
package/dist/colorpicker.min.js CHANGED
@@ -1,2 +1,2 @@
1
- /* Pickit Color v1.0.4, @license Donationware */
2
- !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).colorpicker={})}(this,(function(t){"use strict";function e(t,e,o,n){return new(o||(o=Promise))((function(i,r){function s(t){try{l(n.next(t))}catch(t){r(t)}}function a(t){try{l(n.throw(t))}catch(t){r(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,a)}l((n=n.apply(t,e||[])).next())}))}function o(t,e){var o,n,i,r={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]},s=Object.create(("function"==typeof Iterator?Iterator:Object).prototype);return s.next=a(0),s.throw=a(1),s.return=a(2),"function"==typeof Symbol&&(s[Symbol.iterator]=function(){return this}),s;function a(a){return function(l){return function(a){if(o)throw new TypeError("Generator is already executing.");for(;s&&(s=0,a[0]&&(r=0)),r;)try{if(o=1,n&&(i=2&a[0]?n.return:a[0]?n.throw||((i=n.return)&&i.call(n),0):n.next)&&!(i=i.call(n,a[1])).done)return i;switch(n=0,i&&(a=[2&a[0],i.value]),a[0]){case 0:case 1:i=a;break;case 4:return r.label++,{value:a[1],done:!1};case 5:r.label++,n=a[1],a=[0];continue;case 7:a=r.ops.pop(),r.trys.pop();continue;default:if(!(i=r.trys,(i=i.length>0&&i[i.length-1])||6!==a[0]&&2!==a[0])){r=0;continue}if(3===a[0]&&(!i||a[1]>i[0]&&a[1]<i[3])){r.label=a[1];break}if(6===a[0]&&r.label<i[1]){r.label=i[1],i=a;break}if(i&&r.label<i[2]){r.label=i[2],r.ops.push(a);break}i[2]&&r.ops.pop(),r.trys.pop();continue}a=e.call(t,r)}catch(t){a=[6,t],n=0}finally{o=i=0}if(5&a[0])throw a[1];return{value:a[0]?a[1]:void 0,done:!0}}([a,l])}}}"function"==typeof SuppressedError&&SuppressedError;var n=function(){function t(e,o){var n,i,r,s,a,l,c,u,p,h,d,v,f,y;if(void 0===o&&(o={}),this.container=null,this.colorBox=null,this.hueSlider=null,this.saturationSlider=null,this.lightnessSlider=null,this.alphaSlider=null,this.hexInput=null,this.currentColor={h:0,s:100,l:50,a:1},this.isOpen=!1,this.saturationPointer=null,this.compactButton=null,this.inputPreview=null,this.announceTimeout=null,this.input="string"==typeof e?document.querySelector(e):e,!this.input)throw new Error("ColorPicker: Invalid element selector");var m=this.input.getAttribute("data-preset-colors"),b=m?m.split(",").map((function(t){return t.trim()})):null;this.options={defaultColor:o.defaultColor||"#3b82f6",format:o.format||"hex",showAlpha:null!==(n=o.showAlpha)&&void 0!==n&&n,sliderMode:null!==(i=o.sliderMode)&&void 0!==i&&i,eyeDropper:null!==(r=o.eyeDropper)&&void 0!==r&&r,presetColors:o.presetColors||b||["#ef4444","#f59e0b","#10b981","#3b82f6","#8b5cf6","#ec4899","#000000","#ffffff"],presetLabels:o.presetLabels||[],presetsOnly:null!==(s=o.presetsOnly)&&void 0!==s&&s,listView:null!==(a=o.listView)&&void 0!==a&&a,inline:null!==(l=o.inline)&&void 0!==l&&l,compact:null!==(c=o.compact)&&void 0!==c&&c,inputPreview:null!==(u=o.inputPreview)&&void 0!==u&&u,onChange:o.onChange||function(){},onOpen:o.onOpen||function(){},onClose:o.onClose||function(){},appendTo:o.appendTo||document.body,position:o.position||"auto",closeOnSelect:null===(p=o.closeOnSelect)||void 0===p||p,ariaLabels:{hue:(null===(h=o.ariaLabels)||void 0===h?void 0:h.hue)||"Hue",saturation:(null===(d=o.ariaLabels)||void 0===d?void 0:d.saturation)||"Saturation and Lightness",lightness:(null===(v=o.ariaLabels)||void 0===v?void 0:v.lightness)||"Lightness",alpha:(null===(f=o.ariaLabels)||void 0===f?void 0:f.alpha)||"Alpha",presets:(null===(y=o.ariaLabels)||void 0===y?void 0:y.presets)||"Preset colors"}},this.init(),t.instances.set(this.input,this)}return t.prototype.init=function(){var t=this.input.value||this.options.defaultColor;this.currentColor=this.parseColor(t),this.options.compact&&this.createCompactButton(),this.options.inputPreview&&!this.options.compact&&this.createInputPreview(),this.buildColorPicker(),this.setupEventListeners(),this.updateColorDisplay(),this.options.inline&&this.container&&(this.isOpen=!0,this.container.style.display="block",this.options.onOpen())},t.prototype.buildColorPicker=function(){var t,e=this;this.container=document.createElement("div"),this.container.className="colorpicker-container",this.options.presetsOnly&&this.container.classList.add("colorpicker-presets-only"),this.options.inline&&this.container.classList.add("colorpicker-inline"),this.container.setAttribute("role","dialog"),this.container.setAttribute("aria-label","Color picker"),this.container.style.display="none";var o='\n <div class="colorpicker-content">\n '.concat(this.options.presetsOnly?"":"\n ".concat(this.options.sliderMode?"":'\n <div class="colorpicker-saturation" \n role="slider" \n aria-label="'.concat(this.options.ariaLabels.saturation,'"\n aria-valuemin="0"\n aria-valuemax="100"\n aria-valuenow="').concat(this.currentColor.s,'"\n tabindex="0">\n <div class="colorpicker-saturation-overlay"></div>\n <div class="colorpicker-saturation-pointer" role="presentation"></div>\n </div>\n '),'\n \n <div class="colorpicker-controls">\n <div class="colorpicker-sliders').concat(this.options.sliderMode?" colorpicker-sliders-only":"",'">\n <div class="colorpicker-slider-group">\n <label for="colorpicker-hue">\n <span class="colorpicker-label">').concat(this.options.ariaLabels.hue,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-hue"\n class="colorpicker-slider colorpicker-hue-slider"\n min="0" \n max="360" \n value="').concat(this.currentColor.h,'"\n aria-label="').concat(this.options.ariaLabels.hue,'"\n tabindex="0"\n />\n </div>\n ').concat(this.options.sliderMode?'\n <div class="colorpicker-slider-group">\n <label for="colorpicker-saturation">\n <span class="colorpicker-label">'.concat(this.options.ariaLabels.saturation,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-saturation"\n class="colorpicker-slider colorpicker-saturation-slider"\n min="0" \n max="100" \n value="').concat(this.currentColor.s,'"\n aria-label="').concat(this.options.ariaLabels.saturation,'"\n tabindex="0"\n />\n </div>\n <div class="colorpicker-slider-group">\n <label for="colorpicker-lightness">\n <span class="colorpicker-label">').concat(this.options.ariaLabels.lightness,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-lightness"\n class="colorpicker-slider colorpicker-lightness-slider"\n min="0" \n max="100" \n value="').concat(this.currentColor.l,'"\n aria-label="').concat(this.options.ariaLabels.lightness,'"\n tabindex="0"\n />\n </div>\n '):"","\n ").concat(this.options.showAlpha?'\n <div class="colorpicker-slider-group">\n <label for="colorpicker-alpha">\n <span class="colorpicker-label">'.concat(this.options.ariaLabels.alpha,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-alpha"\n class="colorpicker-slider colorpicker-alpha-slider"\n min="0" \n max="100" \n value="').concat(100*this.currentColor.a,'"\n aria-label="').concat(this.options.ariaLabels.alpha,'"\n tabindex="0"\n />\n </div>\n '):"",'\n </div>\n \n <div class="colorpicker-preview">\n <div class="colorpicker-preview-color" role="presentation"></div>\n </div>\n </div>\n \n <div class="colorpicker-input-wrapper">\n <label for="colorpicker-hex">\n <span class="colorpicker-sr-only">Color value</span>\n </label>\n <div class="colorpicker-input-row">\n <input \n type="text" \n id="colorpicker-hex"\n class="colorpicker-input"\n placeholder="').concat(this.getPlaceholder(),'"\n aria-label="Color value in ').concat(this.options.format,' format"\n />\n ').concat(this.options.eyeDropper?"\n ".concat(this.supportsEyeDropper()?'\n <button \n type="button"\n class="colorpicker-eyedropper-btn"\n aria-label="Pick color from screen"\n title="Pick color from screen"\n >\n <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">\n <path d="M2 22l1-1"/>\n <path d="M8.5 16.5l-1-1"/>\n <path d="M17 3l4 4"/>\n <path d="M12 8l4 4"/>\n <path d="M3 21l9-9"/>\n <path d="M14.5 9.5l-1 1"/>\n <path d="M20 14l-8 8"/>\n </svg>\n </button>\n ':"",'\n <button \n type="button"\n class="colorpicker-system-picker-btn"\n aria-label="Open system color picker"\n title="Open system color picker"\n >\n <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">\n <circle cx="12" cy="12" r="10"/>\n <path d="M12 2v20"/>\n <path d="M2 12h20"/>\n <circle cx="12" cy="12" r="3"/>\n </svg>\n </button>\n <input \n type="color"\n class="colorpicker-system-picker-input"\n style="position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0;"\n />\n '):"","\n </div>\n </div>\n "),"\n \n ").concat(this.options.presetColors.length>0?'\n <div class="colorpicker-presets'.concat(this.options.listView?" colorpicker-presets-list":"",'" role="group" aria-label="').concat(this.options.ariaLabels.presets,'">\n ').concat(this.options.presetColors.map((function(t,o){var n=e.options.presetLabels[o]||"";return e.options.listView&&n?'\n <button \n type="button"\n class="colorpicker-preset colorpicker-preset-list-item" \n data-color="'.concat(t,'"\n aria-label="Select color ').concat(n,'"\n tabindex="').concat(0===o?"0":"-1",'"\n >\n <span class="colorpicker-preset-color" style="background-color: ').concat(t,'"></span>\n <span class="colorpicker-preset-label">').concat(n,"</span>\n </button>\n "):'\n <button \n type="button"\n class="colorpicker-preset" \n style="background-color: '.concat(t,'"\n data-color="').concat(t,'"\n aria-label="Select color ').concat(n||t,'"\n tabindex="').concat(0===o?"0":"-1",'"\n ></button>\n ')})).join(""),"\n </div>\n "):"","\n </div>\n ");this.container.innerHTML=o,this.colorBox=this.container.querySelector(".colorpicker-saturation"),this.saturationPointer=this.container.querySelector(".colorpicker-saturation-pointer"),this.hueSlider=this.container.querySelector(".colorpicker-hue-slider"),this.saturationSlider=this.container.querySelector(".colorpicker-saturation-slider"),this.lightnessSlider=this.container.querySelector(".colorpicker-lightness-slider"),this.alphaSlider=this.container.querySelector(".colorpicker-alpha-slider"),this.hexInput=this.container.querySelector(".colorpicker-input"),this.options.inline?(null===(t=this.input.parentNode)||void 0===t||t.insertBefore(this.container,this.input.nextSibling),this.input.style.display="none"):this.options.appendTo.appendChild(this.container)},t.prototype.createCompactButton=function(){var t,e=this;this.input.style.position="absolute",this.input.style.opacity="0",this.input.style.pointerEvents="none",this.input.style.width="0",this.input.style.height="0",this.compactButton=document.createElement("button"),this.compactButton.type="button",this.compactButton.className="colorpicker-compact-button",this.compactButton.setAttribute("aria-label","Select color"),this.compactButton.tabIndex=0;var o=document.createElement("span");o.className="colorpicker-compact-preview",o.style.backgroundColor=this.input.value||this.options.defaultColor,this.compactButton.appendChild(o),null===(t=this.input.parentNode)||void 0===t||t.insertBefore(this.compactButton,this.input.nextSibling),this.compactButton.addEventListener("click",(function(t){t.preventDefault(),t.stopPropagation(),e.toggle()})),this.compactButton.addEventListener("keydown",(function(t){"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),e.toggle())}))},t.prototype.createInputPreview=function(){var t,e=document.createElement("div");e.className="colorpicker-input-group",this.inputPreview=document.createElement("span"),this.inputPreview.className="colorpicker-input-preview",this.inputPreview.style.backgroundColor=this.input.value||this.options.defaultColor,null===(t=this.input.parentNode)||void 0===t||t.insertBefore(e,this.input),e.appendChild(this.inputPreview),e.appendChild(this.input),this.input.classList.add("colorpicker-has-preview")},t.prototype.supportsEyeDropper=function(){return"undefined"!=typeof window&&"EyeDropper"in window},t.prototype.openEyeDropper=function(){return e(this,void 0,Promise,(function(){var t,e;return o(this,(function(o){switch(o.label){case 0:if(!this.supportsEyeDropper())return[2];o.label=1;case 1:return o.trys.push([1,3,,4]),[4,(new EyeDropper).open()];case 2:return(t=o.sent()).sRGBHex&&(this.currentColor=this.parseColor(t.sRGBHex),this.input.value=t.sRGBHex,this.updateColorDisplay(),this.options.onChange(t.sRGBHex)),[3,4];case 3:return"AbortError"!==(e=o.sent()).name&&console.error("EyeDropper error:",e),[3,4];case 4:return[2]}}))}))},t.prototype.setupEventListeners=function(){var t,n,i,r,s=this;this.options.compact||(this.input.addEventListener("click",(function(){s.options.inline||s.toggle()})),this.input.addEventListener("keydown",(function(t){"Enter"!==t.key&&" "!==t.key||s.options.inline||(t.preventDefault(),s.toggle())}))),this.input.addEventListener("change",(function(){s.currentColor=s.parseColor(s.input.value),s.updateColorDisplay()})),this.hueSlider&&(this.hueSlider.addEventListener("input",(function(t){s.currentColor.h=parseInt(t.target.value),s.updateColorDisplay(),s.announceColorChange()})),this.hueSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.hueSlider,"h",0,360)}))),this.saturationSlider&&(this.saturationSlider.addEventListener("input",(function(t){s.currentColor.s=parseInt(t.target.value),s.updateColorDisplay(),s.announceColorChange()})),this.saturationSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.saturationSlider,"s",0,100)}))),this.lightnessSlider&&(this.lightnessSlider.addEventListener("input",(function(t){s.currentColor.l=parseInt(t.target.value),s.updateColorDisplay(),s.announceColorChange()})),this.lightnessSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.lightnessSlider,"l",0,100)}))),this.alphaSlider&&(this.alphaSlider.addEventListener("input",(function(t){s.currentColor.a=parseInt(t.target.value)/100,s.updateColorDisplay(),s.announceColorChange()})),this.alphaSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.alphaSlider,"a",0,100,!0)}))),this.colorBox&&(this.colorBox.addEventListener("mousedown",(function(t){return s.onSaturationMouseDown(t)})),this.colorBox.addEventListener("touchstart",(function(t){return s.onSaturationTouchStart(t)})),this.colorBox.addEventListener("keydown",(function(t){return s.onSaturationKeyDown(t)}))),this.hexInput&&this.hexInput.addEventListener("input",(function(t){var e=t.target.value.trim();s.isValidColor(e)&&(s.currentColor=s.parseColor(e),s.updateColorDisplay(!1))}));var a=null===(t=this.container)||void 0===t?void 0:t.querySelectorAll(".colorpicker-preset");a&&a.length>0&&a.forEach((function(t,e){t.addEventListener("click",(function(t){var e=t.currentTarget.dataset.color;s.currentColor=s.parseColor(e),s.updateColorDisplay(),s.options.closeOnSelect&&s.close()})),t.addEventListener("keydown",(function(t){var o=t.key,n=!1,i=e;switch(o){case"ArrowRight":case"ArrowDown":i=Math.min(a.length-1,e+1),n=!0;break;case"ArrowLeft":case"ArrowUp":i=Math.max(0,e-1),n=!0;break;case"Home":i=0,n=!0;break;case"End":i=a.length-1,n=!0;break;case"Enter":case" ":var r=t.currentTarget.dataset.color;s.currentColor=s.parseColor(r),s.updateColorDisplay(),s.options.closeOnSelect&&s.close(),n=!0}n&&(t.preventDefault(),i!==e&&(a.forEach((function(t,e){t.setAttribute("tabindex",e===i?"0":"-1")})),a[i].focus()))}))}));var l=null===(n=this.container)||void 0===n?void 0:n.querySelector(".colorpicker-eyedropper-btn");l&&l.addEventListener("click",(function(t){return e(s,void 0,void 0,(function(){return o(this,(function(e){switch(e.label){case 0:return t.preventDefault(),t.stopPropagation(),[4,this.openEyeDropper()];case 1:return e.sent(),[2]}}))}))}));var c=null===(i=this.container)||void 0===i?void 0:i.querySelector(".colorpicker-system-picker-btn"),u=null===(r=this.container)||void 0===r?void 0:r.querySelector(".colorpicker-system-picker-input");c&&u&&(u.value=this.formatColor(this.currentColor).substring(0,7),c.addEventListener("click",(function(t){t.preventDefault(),t.stopPropagation(),u.click()})),u.addEventListener("change",(function(){var t=u.value;s.currentColor=s.parseColor(t),s.input.value=t,s.updateColorDisplay(),s.options.onChange(t)}))),this.options.inline||document.addEventListener("mousedown",(function(t){var e;s.isOpen&&!(null===(e=s.container)||void 0===e?void 0:e.contains(t.target))&&t.target!==s.input&&s.close()})),document.addEventListener("keydown",(function(t){"Escape"===t.key&&s.isOpen&&!s.options.inline&&(s.close(),s.input.focus())}))},t.prototype.onSaturationMouseDown=function(t){var e=this;t.preventDefault(),this.updateSaturationFromMouse(t);var o=function(t){e.updateSaturationFromMouse(t)},n=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",n)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",n)},t.prototype.onSaturationTouchStart=function(t){var e=this;t.preventDefault();var o=t.touches[0];this.updateSaturationFromTouch(o);var n=function(t){t.preventDefault();var o=t.touches[0];e.updateSaturationFromTouch(o)},i=function(){document.removeEventListener("touchmove",n),document.removeEventListener("touchend",i)};document.addEventListener("touchmove",n,{passive:!1}),document.addEventListener("touchend",i)},t.prototype.updateSaturationFromTouch=function(t){if(this.colorBox){var e=this.colorBox.getBoundingClientRect(),o=Math.max(0,Math.min(t.clientX-e.left,e.width)),n=Math.max(0,Math.min(t.clientY-e.top,e.height));this.currentColor.s=o/e.width*100,this.currentColor.l=100-n/e.height*100,this.updateColorDisplay(),this.announceColorChange()}},t.prototype.handleSliderTouch=function(t,e,o,n,i,r){var s=this;void 0===r&&(r=!1);var a=function(t){var a=e.getBoundingClientRect(),l=Math.max(0,Math.min(t.clientX-a.left,a.width))/a.width,c=n+l*(i-n);s.currentColor[o]=r?c/100:Math.round(c),e.value=String(Math.round(c)),s.updateColorDisplay(),s.announceColorChange()},l=t.touches[0];a(l);var c=function(t){t.preventDefault();var e=t.touches[0];a(e)},u=function(){document.removeEventListener("touchmove",c),document.removeEventListener("touchend",u)};document.addEventListener("touchmove",c,{passive:!1}),document.addEventListener("touchend",u)},t.prototype.updateSaturationFromMouse=function(t){if(this.colorBox){var e=this.colorBox.getBoundingClientRect(),o=Math.max(0,Math.min(t.clientX-e.left,e.width)),n=Math.max(0,Math.min(t.clientY-e.top,e.height));this.currentColor.s=o/e.width*100,this.currentColor.l=100-n/e.height*100,this.updateColorDisplay(),this.announceColorChange()}},t.prototype.onSaturationKeyDown=function(t){var e=t.shiftKey?10:1,o=!1;switch(t.key){case"ArrowRight":this.currentColor.s=Math.min(100,this.currentColor.s+e),o=!0;break;case"ArrowLeft":this.currentColor.s=Math.max(0,this.currentColor.s-e),o=!0;break;case"ArrowUp":this.currentColor.l=Math.min(100,this.currentColor.l+e),o=!0;break;case"ArrowDown":this.currentColor.l=Math.max(0,this.currentColor.l-e),o=!0}o&&(t.preventDefault(),this.updateColorDisplay(),this.announceColorChange())},t.prototype.updateColorDisplay=function(t){var e;if(void 0===t&&(t=!0),this.colorBox&&(this.colorBox.style.backgroundColor="hsl(".concat(this.currentColor.h,", 100%, 50%)")),this.saturationPointer&&this.colorBox){var o=this.currentColor.s/100*100,n=100*(1-this.currentColor.l/100);this.saturationPointer.style.left="".concat(o,"%"),this.saturationPointer.style.top="".concat(n,"%")}this.saturationSlider&&(this.saturationSlider.style.background="linear-gradient(to right, hsl(".concat(this.currentColor.h,", 0%, 50%), hsl(").concat(this.currentColor.h,", 100%, 50%))")),this.lightnessSlider&&(this.lightnessSlider.style.background="linear-gradient(to right, hsl(".concat(this.currentColor.h,", ").concat(this.currentColor.s,"%, 0%), hsl(").concat(this.currentColor.h,", ").concat(this.currentColor.s,"%, 50%), hsl(").concat(this.currentColor.h,", ").concat(this.currentColor.s,"%, 100%))"));var i=null===(e=this.container)||void 0===e?void 0:e.querySelector(".colorpicker-preview-color");if(i&&(i.style.backgroundColor=this.toHSLString(this.currentColor)),this.hexInput&&t&&(this.hexInput.value=this.formatColor(this.currentColor)),this.hueSlider&&(this.hueSlider.value=String(this.currentColor.h)),this.saturationSlider&&(this.saturationSlider.value=String(this.currentColor.s)),this.lightnessSlider&&(this.lightnessSlider.value=String(this.currentColor.l)),this.alphaSlider&&(this.alphaSlider.value=String(100*this.currentColor.a)),t){if(this.input.value=this.formatColor(this.currentColor),this.options.onChange(this.input.value),this.compactButton){var r=this.compactButton.querySelector(".colorpicker-compact-preview");r&&(r.style.backgroundColor=this.toHSLString(this.currentColor))}this.inputPreview&&(this.inputPreview.style.backgroundColor=this.toHSLString(this.currentColor))}},t.prototype.formatColor=function(t){switch(this.options.format){case"hsl":return this.toHSLString(t);case"rgb":return this.toRGBString(this.hslToRgb(t));case"hex":default:return this.toHex(t)}},t.prototype.getPlaceholder=function(){switch(this.options.format){case"hsl":return this.options.showAlpha?"hsla(0, 0%, 0%, 1)":"hsl(0, 0%, 0%)";case"rgb":return this.options.showAlpha?"rgba(0, 0, 0, 1)":"rgb(0, 0, 0)";case"hex":default:return"#000000"}},t.prototype.parseColor=function(t){if((t=t.trim()).startsWith("#"))return this.hexToHsl(t);var e=t.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);if(e){var o={r:parseInt(e[1]),g:parseInt(e[2]),b:parseInt(e[3]),a:e[4]?parseFloat(e[4]):1};return this.rgbToHsl(o)}var n=t.match(/hsla?\((\d+),\s*(\d+)%,\s*(\d+)%(?:,\s*([\d.]+))?\)/);return n?{h:parseInt(n[1]),s:parseInt(n[2]),l:parseInt(n[3]),a:n[4]?parseFloat(n[4]):1}:this.currentColor},t.prototype.hexToHsl=function(t){t=t.replace("#","");var e=parseInt(t.substring(0,2),16)/255,o=parseInt(t.substring(2,4),16)/255,n=parseInt(t.substring(4,6),16)/255,i=8===t.length?parseInt(t.substring(6,8),16)/255:1;return this.rgbToHsl({r:255*e,g:255*o,b:255*n,a:i})},t.prototype.rgbToHsl=function(t){var e=t.r/255,o=t.g/255,n=t.b/255,i=Math.max(e,o,n),r=Math.min(e,o,n),s=0,a=0,l=(i+r)/2;if(i!==r){var c=i-r;switch(a=l>.5?c/(2-i-r):c/(i+r),i){case e:s=((o-n)/c+(o<n?6:0))/6;break;case o:s=((n-e)/c+2)/6;break;case n:s=((e-o)/c+4)/6}}return{h:Math.round(360*s),s:Math.round(100*a),l:Math.round(100*l),a:t.a}},t.prototype.hslToRgb=function(t){var e,o,n,i=t.h/360,r=t.s/100,s=t.l/100;if(0===r)e=o=n=s;else{var a=function(t,e,o){return o<0&&(o+=1),o>1&&(o-=1),o<1/6?t+6*(e-t)*o:o<.5?e:o<2/3?t+(e-t)*(2/3-o)*6:t},l=s<.5?s*(1+r):s+r-s*r,c=2*s-l;e=a(c,l,i+1/3),o=a(c,l,i),n=a(c,l,i-1/3)}return{r:Math.round(255*e),g:Math.round(255*o),b:Math.round(255*n),a:t.a}},t.prototype.toHex=function(t){var e=this.hslToRgb(t),o=function(t){return t.toString(16).padStart(2,"0")};if(this.options.showAlpha&&t.a<1){var n=Math.round(255*t.a);return"#".concat(o(e.r)).concat(o(e.g)).concat(o(e.b)).concat(o(n))}return"#".concat(o(e.r)).concat(o(e.g)).concat(o(e.b))},t.prototype.toHSLString=function(t){return this.options.showAlpha&&t.a<1?"hsla(".concat(t.h,", ").concat(t.s,"%, ").concat(t.l,"%, ").concat(t.a,")"):"hsl(".concat(t.h,", ").concat(t.s,"%, ").concat(t.l,"%)")},t.prototype.toRGBString=function(t){return this.options.showAlpha&&t.a<1?"rgba(".concat(t.r,", ").concat(t.g,", ").concat(t.b,", ").concat(t.a,")"):"rgb(".concat(t.r,", ").concat(t.g,", ").concat(t.b,")")},t.prototype.isValidHex=function(t){return/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(t)},t.prototype.isValidColor=function(t){return!!this.isValidHex(t)||(!!/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(,\s*[\d.]+\s*)?\)$/.test(t)||!!/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(,\s*[\d.]+\s*)?\)$/.test(t))},t.prototype.announceColorChange=function(){var t=this;this.announceTimeout||(this.announceTimeout=setTimeout((function(){var e,o=document.createElement("div");o.setAttribute("role","status"),o.setAttribute("aria-live","polite"),o.className="colorpicker-sr-only",o.textContent="Color changed to ".concat(t.formatColor(t.currentColor)),null===(e=t.container)||void 0===e||e.appendChild(o),setTimeout((function(){return o.remove()}),1e3),t.announceTimeout=null}),500))},t.prototype.open=function(){var t=this;!this.isOpen&&this.container&&(this.isOpen=!0,this.container.style.display="block",this.options.inline||this.positionPicker(),this.options.onOpen(),this.options.inline||setTimeout((function(){var e,o=null;(o=t.options.presetsOnly?null===(e=t.container)||void 0===e?void 0:e.querySelector(".colorpicker-preset"):t.options.sliderMode?t.hueSlider:t.colorBox)&&o.focus()}),0))},t.prototype.close=function(){this.isOpen&&this.container&&(this.isOpen=!1,this.options.inline||(this.container.style.display="none"),this.options.onClose())},t.prototype.toggle=function(){this.isOpen?this.close():this.open()},t.prototype.positionPicker=function(){if(this.container){var t=this.input.getBoundingClientRect(),e=this.container.getBoundingClientRect(),o=window.innerHeight,n=t.bottom+window.scrollY+4,i=t.left+window.scrollX;if("auto"===this.options.position){var r=o-t.bottom,s=t.top;r<e.height&&s>r&&(n=t.top+window.scrollY-e.height-4)}else"above"===this.options.position&&(n=t.top+window.scrollY-e.height-4);this.container.style.position="absolute",this.container.style.top="".concat(n,"px"),this.container.style.left="".concat(i,"px"),this.container.style.zIndex="9999"}},t.prototype.setColor=function(t){this.currentColor=this.parseColor(t),this.updateColorDisplay()},t.prototype.getColor=function(){return this.formatColor(this.currentColor)},t.prototype.destroy=function(){var e,o,n;if(null===(e=this.container)||void 0===e||e.remove(),null===(o=this.compactButton)||void 0===o||o.remove(),this.options.compact&&this.input&&(this.input.style.position="",this.input.style.opacity="",this.input.style.pointerEvents="",this.input.style.width="",this.input.style.height=""),this.options.inputPreview&&this.input){this.input.classList.remove("colorpicker-has-preview");var i=this.input.parentElement;i&&i.classList.contains("colorpicker-input-group")&&(null===(n=i.parentNode)||void 0===n||n.insertBefore(this.input,i),i.remove())}t.instances.delete(this.input)},t.getInstance=function(e){return t.instances.get(e)},t.instances=new Map,t}();function i(t){void 0===t&&(t=document);var e=[];return t.querySelectorAll('[data-colorpicker], .colorpicker, input[type="color"][data-format]').forEach((function(t){if(!n.getInstance(t)){var o=t.dataset,i={};if(o.colorpicker)o.colorpicker.split(/[,;]/).forEach((function(t){var e=t.split(":").map((function(t){return t.trim()})),o=e[0],n=e[1];switch(o){case"format":"hex"!==n&&"rgb"!==n&&"hsl"!==n||(i.format=n);break;case"alpha":case"showAlpha":i.showAlpha="true"===n||"1"===n;break;case"compact":i.compact="true"===n||"1"===n;break;case"inline":i.inline="true"===n||"1"===n;break;case"presets":i.presetsOnly="true"===n||"1"===n;break;case"list":i.listView="true"===n||"1"===n;break;case"sliderMode":i.sliderMode="true"===n||"1"===n;break;case"eyeDropper":i.eyeDropper="true"===n||"1"===n;break;case"inputPreview":i.inputPreview="true"===n||"1"===n}}));!o.format||"hex"!==o.format&&"rgb"!==o.format&&"hsl"!==o.format||(i.format=o.format),void 0!==o.alpha&&(i.showAlpha="true"===o.alpha||"1"===o.alpha),void 0!==o.compact&&(i.compact="true"===o.compact||"1"===o.compact),void 0!==o.inline&&(i.inline="true"===o.inline||"1"===o.inline),void 0!==o.presetsOnly&&(i.presetsOnly="true"===o.presetsOnly||"1"===o.presetsOnly),void 0!==o.listView&&(i.listView="true"===o.listView||"1"===o.listView),o.defaultColor&&(i.defaultColor=o.defaultColor);var r=new n(t,i);e.push(r)}})),e}"undefined"!=typeof window&&"undefined"!=typeof document&&("loading"===document.readyState?document.addEventListener("DOMContentLoaded",(function(){return i()})):i()),t.ColorPicker=n,t.default=function(t,e){return new n(t,e)},t.initColorPickers=i,Object.defineProperty(t,"__esModule",{value:!0})}));
1
+ /* Pickit Color v1.2.0, @license Donationware */
2
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).colorpicker={})}(this,(function(t){"use strict";function e(t,e,o,n){return new(o||(o=Promise))((function(r,i){function s(t){try{l(n.next(t))}catch(t){i(t)}}function a(t){try{l(n.throw(t))}catch(t){i(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,a)}l((n=n.apply(t,e||[])).next())}))}function o(t,e){var o,n,r,i={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]},s=Object.create(("function"==typeof Iterator?Iterator:Object).prototype);return s.next=a(0),s.throw=a(1),s.return=a(2),"function"==typeof Symbol&&(s[Symbol.iterator]=function(){return this}),s;function a(a){return function(l){return function(a){if(o)throw new TypeError("Generator is already executing.");for(;s&&(s=0,a[0]&&(i=0)),i;)try{if(o=1,n&&(r=2&a[0]?n.return:a[0]?n.throw||((r=n.return)&&r.call(n),0):n.next)&&!(r=r.call(n,a[1])).done)return r;switch(n=0,r&&(a=[2&a[0],r.value]),a[0]){case 0:case 1:r=a;break;case 4:return i.label++,{value:a[1],done:!1};case 5:i.label++,n=a[1],a=[0];continue;case 7:a=i.ops.pop(),i.trys.pop();continue;default:if(!(r=i.trys,(r=r.length>0&&r[r.length-1])||6!==a[0]&&2!==a[0])){i=0;continue}if(3===a[0]&&(!r||a[1]>r[0]&&a[1]<r[3])){i.label=a[1];break}if(6===a[0]&&i.label<r[1]){i.label=r[1],r=a;break}if(r&&i.label<r[2]){i.label=r[2],i.ops.push(a);break}r[2]&&i.ops.pop(),i.trys.pop();continue}a=e.call(t,i)}catch(t){a=[6,t],n=0}finally{o=r=0}if(5&a[0])throw a[1];return{value:a[0]?a[1]:void 0,done:!0}}([a,l])}}}"function"==typeof SuppressedError&&SuppressedError;var n={hue:"Hue",saturation:"Saturation and Lightness",lightness:"Lightness",alpha:"Alpha",presets:"Preset colors",eyeDropper:"Pick color from screen",systemPicker:"System color picker"},r={hue:"Farbton",saturation:"Sättigung und Helligkeit",lightness:"Helligkeit",alpha:"Transparenz",presets:"Vordefinierte Farben",eyeDropper:"Farbe vom Bildschirm aufnehmen",systemPicker:"System-Farbwähler"},i={hue:"Odtenek",saturation:"Nasičenost in svetlost",lightness:"Svetlost",alpha:"Prosojnost",presets:"Prednastavljene barve",eyeDropper:"Izberi barvo z zaslona",systemPicker:"Sistemski izbirnik barv"},s=Object.freeze({__proto__:null,en:n,de:r,sl:i}),a={en:n,de:r,sl:i};function l(){var t=document.documentElement.lang;if(t){var e=t.split("-")[0].toLowerCase();if(a[e])return e}var o=navigator.language.split("-")[0].toLowerCase();return a[o]?o:"en"}var c=function(){function t(e,o){var n,r,i,s,c,u,p,h,d,v,f,g,y,b;if(void 0===o&&(o={}),this.container=null,this.colorBox=null,this.hueSlider=null,this.saturationSlider=null,this.lightnessSlider=null,this.alphaSlider=null,this.hexInput=null,this.currentColor={h:0,s:100,l:50,a:1},this.isOpen=!1,this.saturationPointer=null,this.compactButton=null,this.inputPreview=null,this.announceTimeout=null,this.input="string"==typeof e?document.querySelector(e):e,!this.input)throw new Error("ColorPicker: Invalid element selector");var m=this.input.getAttribute("data-preset-colors"),k=m?m.split(",").map((function(t){return t.trim()})):null;this.options={defaultColor:o.defaultColor||"#3b82f6",format:o.format||"hex",showAlpha:null!==(n=o.showAlpha)&&void 0!==n&&n,sliderMode:null!==(r=o.sliderMode)&&void 0!==r&&r,eyeDropper:null!==(i=o.eyeDropper)&&void 0!==i&&i,presetColors:o.presetColors||k||["#ef4444","#f59e0b","#10b981","#3b82f6","#8b5cf6","#ec4899","#000000","#ffffff"],presetLabels:o.presetLabels||[],presetsOnly:null!==(s=o.presetsOnly)&&void 0!==s&&s,listView:null!==(c=o.listView)&&void 0!==c&&c,inline:null!==(u=o.inline)&&void 0!==u&&u,compact:null!==(p=o.compact)&&void 0!==p&&p,inputPreview:null!==(h=o.inputPreview)&&void 0!==h&&h,previewTarget:o.previewTarget||"",previewProperty:o.previewProperty||"background-color",language:o.language||l(),onChange:o.onChange||function(){},onOpen:o.onOpen||function(){},onClose:o.onClose||function(){},appendTo:o.appendTo||document.body,position:o.position||"auto",closeOnSelect:null===(d=o.closeOnSelect)||void 0===d||d,ariaLabels:{hue:(null===(v=o.ariaLabels)||void 0===v?void 0:v.hue)||a[o.language||l()].hue,saturation:(null===(f=o.ariaLabels)||void 0===f?void 0:f.saturation)||a[o.language||l()].saturation,lightness:(null===(g=o.ariaLabels)||void 0===g?void 0:g.lightness)||a[o.language||l()].lightness,alpha:(null===(y=o.ariaLabels)||void 0===y?void 0:y.alpha)||a[o.language||l()].alpha,presets:(null===(b=o.ariaLabels)||void 0===b?void 0:b.presets)||a[o.language||l()].presets}},this.init(),t.instances.set(this.input,this)}return t.addTranslation=function(t,e){a[t.toLowerCase()]=e},t.getAvailableLanguages=function(){return Object.keys(a)},t.prototype.init=function(){var t=this.input.value||this.options.defaultColor;this.currentColor=this.parseColor(t),this.options.compact&&this.createCompactButton(),this.options.inputPreview&&!this.options.compact&&this.createInputPreview(),this.buildColorPicker(),this.setupEventListeners(),this.updateColorDisplay(),this.options.inline&&this.container&&(this.isOpen=!0,this.container.style.display="block",this.options.onOpen())},t.prototype.buildColorPicker=function(){var t,e=this;this.container=document.createElement("div"),this.container.className="colorpicker-container",this.options.presetsOnly&&this.container.classList.add("colorpicker-presets-only"),this.options.inline&&this.container.classList.add("colorpicker-inline"),this.container.setAttribute("role","dialog"),this.container.setAttribute("aria-label","Color picker"),this.container.style.display="none";var o='\n <div class="colorpicker-content">\n '.concat(this.options.presetsOnly?"":"\n ".concat(this.options.sliderMode?"":'\n <div class="colorpicker-saturation" \n role="slider" \n aria-label="'.concat(this.options.ariaLabels.saturation,'"\n aria-valuemin="0"\n aria-valuemax="100"\n aria-valuenow="').concat(this.currentColor.s,'"\n tabindex="0">\n <div class="colorpicker-saturation-overlay"></div>\n <div class="colorpicker-saturation-pointer" role="presentation"></div>\n </div>\n '),'\n \n <div class="colorpicker-controls">\n <div class="colorpicker-sliders').concat(this.options.sliderMode?" colorpicker-sliders-only":"",'">\n <div class="colorpicker-slider-group">\n <label for="colorpicker-hue">\n <span class="colorpicker-label">').concat(this.options.ariaLabels.hue,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-hue"\n class="colorpicker-slider colorpicker-hue-slider"\n min="0" \n max="360" \n value="').concat(this.currentColor.h,'"\n aria-label="').concat(this.options.ariaLabels.hue,'"\n tabindex="0"\n />\n </div>\n ').concat(this.options.sliderMode?'\n <div class="colorpicker-slider-group">\n <label for="colorpicker-saturation">\n <span class="colorpicker-label">'.concat(this.options.ariaLabels.saturation,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-saturation"\n class="colorpicker-slider colorpicker-saturation-slider"\n min="0" \n max="100" \n value="').concat(this.currentColor.s,'"\n aria-label="').concat(this.options.ariaLabels.saturation,'"\n tabindex="0"\n />\n </div>\n <div class="colorpicker-slider-group">\n <label for="colorpicker-lightness">\n <span class="colorpicker-label">').concat(this.options.ariaLabels.lightness,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-lightness"\n class="colorpicker-slider colorpicker-lightness-slider"\n min="0" \n max="100" \n value="').concat(this.currentColor.l,'"\n aria-label="').concat(this.options.ariaLabels.lightness,'"\n tabindex="0"\n />\n </div>\n '):"","\n ").concat(this.options.showAlpha?'\n <div class="colorpicker-slider-group">\n <label for="colorpicker-alpha">\n <span class="colorpicker-label">'.concat(this.options.ariaLabels.alpha,'</span>\n </label>\n <input \n type="range" \n id="colorpicker-alpha"\n class="colorpicker-slider colorpicker-alpha-slider"\n min="0" \n max="100" \n value="').concat(100*this.currentColor.a,'"\n aria-label="').concat(this.options.ariaLabels.alpha,'"\n tabindex="0"\n />\n </div>\n '):"",'\n </div>\n \n <div class="colorpicker-preview">\n <div class="colorpicker-preview-color" role="presentation"></div>\n </div>\n </div>\n \n <div class="colorpicker-input-wrapper">\n <label for="colorpicker-hex">\n <span class="colorpicker-sr-only">Color value</span>\n </label>\n <div class="colorpicker-input-row">\n <input \n type="text" \n id="colorpicker-hex"\n class="colorpicker-input"\n placeholder="').concat(this.getPlaceholder(),'"\n aria-label="Color value in ').concat(this.options.format,' format"\n />\n ').concat(this.options.eyeDropper?"\n ".concat(this.supportsEyeDropper()?'\n <button \n type="button"\n class="colorpicker-eyedropper-btn"\n aria-label="Pick color from screen"\n title="Pick color from screen"\n >\n <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">\n <path d="M2 22l1-1"/>\n <path d="M8.5 16.5l-1-1"/>\n <path d="M17 3l4 4"/>\n <path d="M12 8l4 4"/>\n <path d="M3 21l9-9"/>\n <path d="M14.5 9.5l-1 1"/>\n <path d="M20 14l-8 8"/>\n </svg>\n </button>\n ':"",'\n <button \n type="button"\n class="colorpicker-system-picker-btn"\n aria-label="Open system color picker"\n title="Open system color picker"\n >\n <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">\n <circle cx="12" cy="12" r="10"/>\n <path d="M12 2v20"/>\n <path d="M2 12h20"/>\n <circle cx="12" cy="12" r="3"/>\n </svg>\n </button>\n <input \n type="color"\n class="colorpicker-system-picker-input"\n style="position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0;"\n />\n '):"","\n </div>\n </div>\n "),"\n \n ").concat(this.options.presetColors.length>0?'\n <div class="colorpicker-presets'.concat(this.options.listView?" colorpicker-presets-list":"",'" role="group" aria-label="').concat(this.options.ariaLabels.presets,'">\n ').concat(this.options.presetColors.map((function(t,o){var n=e.options.presetLabels[o]||"";return e.options.listView&&n?'\n <button \n type="button"\n class="colorpicker-preset colorpicker-preset-list-item" \n data-color="'.concat(t,'"\n aria-label="Select color ').concat(n,'"\n tabindex="').concat(0===o?"0":"-1",'"\n >\n <span class="colorpicker-preset-color" style="background-color: ').concat(t,'"></span>\n <span class="colorpicker-preset-label">').concat(n,"</span>\n </button>\n "):'\n <button \n type="button"\n class="colorpicker-preset" \n style="background-color: '.concat(t,'"\n data-color="').concat(t,'"\n aria-label="Select color ').concat(n||t,'"\n tabindex="').concat(0===o?"0":"-1",'"\n ></button>\n ')})).join(""),"\n </div>\n "):"","\n </div>\n ");this.container.innerHTML=o,this.colorBox=this.container.querySelector(".colorpicker-saturation"),this.saturationPointer=this.container.querySelector(".colorpicker-saturation-pointer"),this.hueSlider=this.container.querySelector(".colorpicker-hue-slider"),this.saturationSlider=this.container.querySelector(".colorpicker-saturation-slider"),this.lightnessSlider=this.container.querySelector(".colorpicker-lightness-slider"),this.alphaSlider=this.container.querySelector(".colorpicker-alpha-slider"),this.hexInput=this.container.querySelector(".colorpicker-input"),this.options.inline?(null===(t=this.input.parentNode)||void 0===t||t.insertBefore(this.container,this.input.nextSibling),this.input.style.display="none"):this.options.appendTo.appendChild(this.container)},t.prototype.createCompactButton=function(){var t,e=this;this.input.style.position="absolute",this.input.style.opacity="0",this.input.style.pointerEvents="none",this.input.style.width="0",this.input.style.height="0",this.compactButton=document.createElement("button"),this.compactButton.type="button",this.compactButton.className="colorpicker-compact-button",this.compactButton.setAttribute("aria-label","Select color"),this.compactButton.tabIndex=0;var o=document.createElement("span");o.className="colorpicker-compact-preview",o.style.backgroundColor=this.input.value||this.options.defaultColor,this.compactButton.appendChild(o),null===(t=this.input.parentNode)||void 0===t||t.insertBefore(this.compactButton,this.input.nextSibling),this.compactButton.addEventListener("click",(function(t){t.preventDefault(),t.stopPropagation(),e.toggle()})),this.compactButton.addEventListener("keydown",(function(t){"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),e.toggle())}))},t.prototype.createInputPreview=function(){var t,e=document.createElement("div");e.className="colorpicker-input-group",this.inputPreview=document.createElement("span"),this.inputPreview.className="colorpicker-input-preview",this.inputPreview.style.backgroundColor=this.input.value||this.options.defaultColor,null===(t=this.input.parentNode)||void 0===t||t.insertBefore(e,this.input),e.appendChild(this.inputPreview),e.appendChild(this.input),this.input.classList.add("colorpicker-has-preview")},t.prototype.supportsEyeDropper=function(){return"undefined"!=typeof window&&"EyeDropper"in window},t.prototype.openEyeDropper=function(){return e(this,void 0,Promise,(function(){var t,e;return o(this,(function(o){switch(o.label){case 0:if(!this.supportsEyeDropper())return[2];o.label=1;case 1:return o.trys.push([1,3,,4]),[4,(new EyeDropper).open()];case 2:return(t=o.sent()).sRGBHex&&(this.currentColor=this.parseColor(t.sRGBHex),this.input.value=t.sRGBHex,this.updateColorDisplay(),this.options.onChange(t.sRGBHex)),[3,4];case 3:return"AbortError"!==(e=o.sent()).name&&console.error("EyeDropper error:",e),[3,4];case 4:return[2]}}))}))},t.prototype.setupEventListeners=function(){var t,n,r,i,s=this;this.options.compact||(this.input.addEventListener("click",(function(){s.options.inline||s.toggle()})),this.input.addEventListener("keydown",(function(t){"Enter"!==t.key&&" "!==t.key||s.options.inline||(t.preventDefault(),s.toggle())}))),this.input.addEventListener("change",(function(){s.currentColor=s.parseColor(s.input.value),s.updateColorDisplay()})),this.hueSlider&&(this.hueSlider.addEventListener("input",(function(t){s.currentColor.h=parseInt(t.target.value),s.updateColorDisplay(),s.announceColorChange()})),this.hueSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.hueSlider,"h",0,360)}))),this.saturationSlider&&(this.saturationSlider.addEventListener("input",(function(t){s.currentColor.s=parseInt(t.target.value),s.updateColorDisplay(),s.announceColorChange()})),this.saturationSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.saturationSlider,"s",0,100)}))),this.lightnessSlider&&(this.lightnessSlider.addEventListener("input",(function(t){s.currentColor.l=parseInt(t.target.value),s.updateColorDisplay(),s.announceColorChange()})),this.lightnessSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.lightnessSlider,"l",0,100)}))),this.alphaSlider&&(this.alphaSlider.addEventListener("input",(function(t){s.currentColor.a=parseInt(t.target.value)/100,s.updateColorDisplay(),s.announceColorChange()})),this.alphaSlider.addEventListener("touchstart",(function(t){s.handleSliderTouch(t,s.alphaSlider,"a",0,100,!0)}))),this.colorBox&&(this.colorBox.addEventListener("mousedown",(function(t){return s.onSaturationMouseDown(t)})),this.colorBox.addEventListener("touchstart",(function(t){return s.onSaturationTouchStart(t)})),this.colorBox.addEventListener("keydown",(function(t){return s.onSaturationKeyDown(t)}))),this.hexInput&&this.hexInput.addEventListener("input",(function(t){var e=t.target.value.trim();s.isValidColor(e)&&(s.currentColor=s.parseColor(e),s.updateColorDisplay(!1))}));var a=null===(t=this.container)||void 0===t?void 0:t.querySelectorAll(".colorpicker-preset");a&&a.length>0&&a.forEach((function(t,e){t.addEventListener("click",(function(t){var e=t.currentTarget.dataset.color;s.currentColor=s.parseColor(e),s.updateColorDisplay(),s.options.closeOnSelect&&s.close()})),t.addEventListener("keydown",(function(t){var o=t.key,n=!1,r=e;switch(o){case"ArrowRight":case"ArrowDown":r=Math.min(a.length-1,e+1),n=!0;break;case"ArrowLeft":case"ArrowUp":r=Math.max(0,e-1),n=!0;break;case"Home":r=0,n=!0;break;case"End":r=a.length-1,n=!0;break;case"Enter":case" ":var i=t.currentTarget.dataset.color;s.currentColor=s.parseColor(i),s.updateColorDisplay(),s.options.closeOnSelect&&s.close(),n=!0}n&&(t.preventDefault(),r!==e&&(a.forEach((function(t,e){t.setAttribute("tabindex",e===r?"0":"-1")})),a[r].focus()))}))}));var l=null===(n=this.container)||void 0===n?void 0:n.querySelector(".colorpicker-eyedropper-btn");l&&l.addEventListener("click",(function(t){return e(s,void 0,void 0,(function(){return o(this,(function(e){switch(e.label){case 0:return t.preventDefault(),t.stopPropagation(),[4,this.openEyeDropper()];case 1:return e.sent(),[2]}}))}))}));var c=null===(r=this.container)||void 0===r?void 0:r.querySelector(".colorpicker-system-picker-btn"),u=null===(i=this.container)||void 0===i?void 0:i.querySelector(".colorpicker-system-picker-input");c&&u&&(u.value=this.formatColor(this.currentColor).substring(0,7),c.addEventListener("click",(function(t){t.preventDefault(),t.stopPropagation(),u.click()})),u.addEventListener("change",(function(){var t=u.value;s.currentColor=s.parseColor(t),s.input.value=t,s.updateColorDisplay(),s.options.onChange(t)}))),this.options.inline||document.addEventListener("mousedown",(function(t){var e;s.isOpen&&!(null===(e=s.container)||void 0===e?void 0:e.contains(t.target))&&t.target!==s.input&&s.close()})),document.addEventListener("keydown",(function(t){"Escape"===t.key&&s.isOpen&&!s.options.inline&&(s.close(),s.input.focus())}))},t.prototype.onSaturationMouseDown=function(t){var e=this;t.preventDefault(),this.updateSaturationFromMouse(t);var o=function(t){e.updateSaturationFromMouse(t)},n=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",n)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",n)},t.prototype.onSaturationTouchStart=function(t){var e=this;t.preventDefault();var o=t.touches[0];this.updateSaturationFromTouch(o);var n=function(t){t.preventDefault();var o=t.touches[0];e.updateSaturationFromTouch(o)},r=function(){document.removeEventListener("touchmove",n),document.removeEventListener("touchend",r)};document.addEventListener("touchmove",n,{passive:!1}),document.addEventListener("touchend",r)},t.prototype.updateSaturationFromTouch=function(t){if(this.colorBox){var e=this.colorBox.getBoundingClientRect(),o=Math.max(0,Math.min(t.clientX-e.left,e.width)),n=Math.max(0,Math.min(t.clientY-e.top,e.height));this.currentColor.s=o/e.width*100,this.currentColor.l=100-n/e.height*100,this.updateColorDisplay(),this.announceColorChange()}},t.prototype.handleSliderTouch=function(t,e,o,n,r,i){var s=this;void 0===i&&(i=!1);var a=function(t){var a=e.getBoundingClientRect(),l=Math.max(0,Math.min(t.clientX-a.left,a.width))/a.width,c=n+l*(r-n);s.currentColor[o]=i?c/100:Math.round(c),e.value=String(Math.round(c)),s.updateColorDisplay(),s.announceColorChange()},l=t.touches[0];a(l);var c=function(t){t.preventDefault();var e=t.touches[0];a(e)},u=function(){document.removeEventListener("touchmove",c),document.removeEventListener("touchend",u)};document.addEventListener("touchmove",c,{passive:!1}),document.addEventListener("touchend",u)},t.prototype.updateSaturationFromMouse=function(t){if(this.colorBox){var e=this.colorBox.getBoundingClientRect(),o=Math.max(0,Math.min(t.clientX-e.left,e.width)),n=Math.max(0,Math.min(t.clientY-e.top,e.height));this.currentColor.s=o/e.width*100,this.currentColor.l=100-n/e.height*100,this.updateColorDisplay(),this.announceColorChange()}},t.prototype.onSaturationKeyDown=function(t){var e=t.shiftKey?10:1,o=!1;switch(t.key){case"ArrowRight":this.currentColor.s=Math.min(100,this.currentColor.s+e),o=!0;break;case"ArrowLeft":this.currentColor.s=Math.max(0,this.currentColor.s-e),o=!0;break;case"ArrowUp":this.currentColor.l=Math.min(100,this.currentColor.l+e),o=!0;break;case"ArrowDown":this.currentColor.l=Math.max(0,this.currentColor.l-e),o=!0}o&&(t.preventDefault(),this.updateColorDisplay(),this.announceColorChange())},t.prototype.updateColorDisplay=function(t){var e;if(void 0===t&&(t=!0),this.colorBox&&(this.colorBox.style.backgroundColor="hsl(".concat(this.currentColor.h,", 100%, 50%)")),this.saturationPointer&&this.colorBox){var o=this.currentColor.s/100*100,n=100*(1-this.currentColor.l/100);this.saturationPointer.style.left="".concat(o,"%"),this.saturationPointer.style.top="".concat(n,"%")}this.saturationSlider&&(this.saturationSlider.style.background="linear-gradient(to right, hsl(".concat(this.currentColor.h,", 0%, 50%), hsl(").concat(this.currentColor.h,", 100%, 50%))")),this.lightnessSlider&&(this.lightnessSlider.style.background="linear-gradient(to right, hsl(".concat(this.currentColor.h,", ").concat(this.currentColor.s,"%, 0%), hsl(").concat(this.currentColor.h,", ").concat(this.currentColor.s,"%, 50%), hsl(").concat(this.currentColor.h,", ").concat(this.currentColor.s,"%, 100%))"));var r=null===(e=this.container)||void 0===e?void 0:e.querySelector(".colorpicker-preview-color");if(r&&(r.style.backgroundColor=this.toHSLString(this.currentColor)),this.hexInput&&t&&(this.hexInput.value=this.formatColor(this.currentColor)),this.hueSlider&&(this.hueSlider.value=String(this.currentColor.h)),this.saturationSlider&&(this.saturationSlider.value=String(this.currentColor.s)),this.lightnessSlider&&(this.lightnessSlider.value=String(this.currentColor.l)),this.alphaSlider&&(this.alphaSlider.value=String(100*this.currentColor.a)),t){if(this.input.value=this.formatColor(this.currentColor),this.options.onChange(this.input.value),this.options.previewTarget){var i=document.querySelector(this.options.previewTarget);if(i){var s=this.options.previewProperty||"background-color";i.style.setProperty(s,this.input.value)}}if(this.compactButton){var a=this.compactButton.querySelector(".colorpicker-compact-preview");a&&(a.style.backgroundColor=this.toHSLString(this.currentColor))}this.inputPreview&&(this.inputPreview.style.backgroundColor=this.toHSLString(this.currentColor))}},t.prototype.formatColor=function(t){switch(this.options.format){case"hsl":return this.toHSLString(t);case"rgb":return this.toRGBString(this.hslToRgb(t));case"hex":default:return this.toHex(t)}},t.prototype.getPlaceholder=function(){switch(this.options.format){case"hsl":return this.options.showAlpha?"hsla(0, 0%, 0%, 1)":"hsl(0, 0%, 0%)";case"rgb":return this.options.showAlpha?"rgba(0, 0, 0, 1)":"rgb(0, 0, 0)";case"hex":default:return"#000000"}},t.prototype.parseColor=function(t){if((t=t.trim()).startsWith("#"))return this.hexToHsl(t);var e=t.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);if(e){var o={r:parseInt(e[1]),g:parseInt(e[2]),b:parseInt(e[3]),a:e[4]?parseFloat(e[4]):1};return this.rgbToHsl(o)}var n=t.match(/hsla?\((\d+),\s*(\d+)%,\s*(\d+)%(?:,\s*([\d.]+))?\)/);return n?{h:parseInt(n[1]),s:parseInt(n[2]),l:parseInt(n[3]),a:n[4]?parseFloat(n[4]):1}:this.currentColor},t.prototype.hexToHsl=function(t){t=t.replace("#","");var e=parseInt(t.substring(0,2),16)/255,o=parseInt(t.substring(2,4),16)/255,n=parseInt(t.substring(4,6),16)/255,r=8===t.length?parseInt(t.substring(6,8),16)/255:1;return this.rgbToHsl({r:255*e,g:255*o,b:255*n,a:r})},t.prototype.rgbToHsl=function(t){var e=t.r/255,o=t.g/255,n=t.b/255,r=Math.max(e,o,n),i=Math.min(e,o,n),s=0,a=0,l=(r+i)/2;if(r!==i){var c=r-i;switch(a=l>.5?c/(2-r-i):c/(r+i),r){case e:s=((o-n)/c+(o<n?6:0))/6;break;case o:s=((n-e)/c+2)/6;break;case n:s=((e-o)/c+4)/6}}return{h:Math.round(360*s),s:Math.round(100*a),l:Math.round(100*l),a:t.a}},t.prototype.hslToRgb=function(t){var e,o,n,r=t.h/360,i=t.s/100,s=t.l/100;if(0===i)e=o=n=s;else{var a=function(t,e,o){return o<0&&(o+=1),o>1&&(o-=1),o<1/6?t+6*(e-t)*o:o<.5?e:o<2/3?t+(e-t)*(2/3-o)*6:t},l=s<.5?s*(1+i):s+i-s*i,c=2*s-l;e=a(c,l,r+1/3),o=a(c,l,r),n=a(c,l,r-1/3)}return{r:Math.round(255*e),g:Math.round(255*o),b:Math.round(255*n),a:t.a}},t.prototype.toHex=function(t){var e=this.hslToRgb(t),o=function(t){return t.toString(16).padStart(2,"0")};if(this.options.showAlpha&&t.a<1){var n=Math.round(255*t.a);return"#".concat(o(e.r)).concat(o(e.g)).concat(o(e.b)).concat(o(n))}return"#".concat(o(e.r)).concat(o(e.g)).concat(o(e.b))},t.prototype.toHSLString=function(t){return this.options.showAlpha&&t.a<1?"hsla(".concat(t.h,", ").concat(t.s,"%, ").concat(t.l,"%, ").concat(t.a,")"):"hsl(".concat(t.h,", ").concat(t.s,"%, ").concat(t.l,"%)")},t.prototype.toRGBString=function(t){return this.options.showAlpha&&t.a<1?"rgba(".concat(t.r,", ").concat(t.g,", ").concat(t.b,", ").concat(t.a,")"):"rgb(".concat(t.r,", ").concat(t.g,", ").concat(t.b,")")},t.prototype.isValidHex=function(t){return/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(t)},t.prototype.isValidColor=function(t){return!!this.isValidHex(t)||(!!/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(,\s*[\d.]+\s*)?\)$/.test(t)||!!/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(,\s*[\d.]+\s*)?\)$/.test(t))},t.prototype.announceColorChange=function(){var t=this;this.announceTimeout||(this.announceTimeout=setTimeout((function(){var e,o=document.createElement("div");o.setAttribute("role","status"),o.setAttribute("aria-live","polite"),o.className="colorpicker-sr-only",o.textContent="Color changed to ".concat(t.formatColor(t.currentColor)),null===(e=t.container)||void 0===e||e.appendChild(o),setTimeout((function(){return o.remove()}),1e3),t.announceTimeout=null}),500))},t.prototype.open=function(){var t=this;!this.isOpen&&this.container&&(this.isOpen=!0,this.container.style.display="block",this.options.inline||this.positionPicker(),this.options.onOpen(),this.options.inline||setTimeout((function(){var e,o=null;(o=t.options.presetsOnly?null===(e=t.container)||void 0===e?void 0:e.querySelector(".colorpicker-preset"):t.options.sliderMode?t.hueSlider:t.colorBox)&&o.focus()}),0))},t.prototype.close=function(){this.isOpen&&this.container&&(this.isOpen=!1,this.options.inline||(this.container.style.display="none"),this.options.onClose())},t.prototype.toggle=function(){this.isOpen?this.close():this.open()},t.prototype.positionPicker=function(){if(this.container){var t=this.input.getBoundingClientRect(),e=this.container.getBoundingClientRect(),o=window.innerHeight,n=t.bottom+window.scrollY+4,r=t.left+window.scrollX;if("auto"===this.options.position){var i=o-t.bottom,s=t.top;i<e.height&&s>i&&(n=t.top+window.scrollY-e.height-4)}else"above"===this.options.position&&(n=t.top+window.scrollY-e.height-4);this.container.style.position="absolute",this.container.style.top="".concat(n,"px"),this.container.style.left="".concat(r,"px"),this.container.style.zIndex="9999"}},t.prototype.setColor=function(t){this.currentColor=this.parseColor(t),this.updateColorDisplay()},t.prototype.getColor=function(){return this.formatColor(this.currentColor)},t.prototype.destroy=function(){var e,o,n;if(null===(e=this.container)||void 0===e||e.remove(),null===(o=this.compactButton)||void 0===o||o.remove(),this.options.compact&&this.input&&(this.input.style.position="",this.input.style.opacity="",this.input.style.pointerEvents="",this.input.style.width="",this.input.style.height=""),this.options.inputPreview&&this.input){this.input.classList.remove("colorpicker-has-preview");var r=this.input.parentElement;r&&r.classList.contains("colorpicker-input-group")&&(null===(n=r.parentNode)||void 0===n||n.insertBefore(this.input,r),r.remove())}t.instances.delete(this.input)},t.getInstance=function(e){return t.instances.get(e)},t.instances=new Map,t}();function u(t){void 0===t&&(t=document);var e=[];return t.querySelectorAll('[data-colorpicker], .colorpicker, input[type="color"][data-format]').forEach((function(t){if(!c.getInstance(t)){var o=t.dataset,n={};if(o.colorpicker)o.colorpicker.split(/[,;]/).forEach((function(t){var e=t.split(":").map((function(t){return t.trim()})),o=e[0],r=e[1];switch(o){case"format":"hex"!==r&&"rgb"!==r&&"hsl"!==r||(n.format=r);break;case"alpha":case"showAlpha":n.showAlpha="true"===r||"1"===r;break;case"compact":n.compact="true"===r||"1"===r;break;case"inline":n.inline="true"===r||"1"===r;break;case"presets":n.presetsOnly="true"===r||"1"===r;break;case"list":n.listView="true"===r||"1"===r;break;case"sliderMode":n.sliderMode="true"===r||"1"===r;break;case"eyeDropper":n.eyeDropper="true"===r||"1"===r;break;case"inputPreview":n.inputPreview="true"===r||"1"===r;break;case"target":case"previewTarget":n.previewTarget=r;break;case"property":case"previewProperty":n.previewProperty=r;break;case"lang":case"language":n.language=r}}));!o.format||"hex"!==o.format&&"rgb"!==o.format&&"hsl"!==o.format||(n.format=o.format),void 0!==o.alpha&&(n.showAlpha="true"===o.alpha||"1"===o.alpha),void 0!==o.compact&&(n.compact="true"===o.compact||"1"===o.compact),void 0!==o.inline&&(n.inline="true"===o.inline||"1"===o.inline),void 0!==o.presetsOnly&&(n.presetsOnly="true"===o.presetsOnly||"1"===o.presetsOnly),void 0!==o.listView&&(n.listView="true"===o.listView||"1"===o.listView),o.defaultColor&&(n.defaultColor=o.defaultColor);var r=new c(t,n);e.push(r)}})),e}"undefined"!=typeof window&&"undefined"!=typeof document&&("loading"===document.readyState?document.addEventListener("DOMContentLoaded",(function(){return u()})):u()),t.ColorPicker=c,t.default=function(t,e){return new c(t,e)},t.initColorPickers=u,t.languages=s,Object.defineProperty(t,"__esModule",{value:!0})}));
package/dist/esm/index.js CHANGED
@@ -34,6 +34,24 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
34
34
  if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
35
35
  }
36
36
  };
37
+ import * as languages from './l10n';
38
+ var translations = {
39
+ en: languages.en,
40
+ de: languages.de,
41
+ sl: languages.sl
42
+ };
43
+ function detectLanguage() {
44
+ var htmlLang = document.documentElement.lang;
45
+ if (htmlLang) {
46
+ var lang = htmlLang.split('-')[0].toLowerCase();
47
+ if (translations[lang])
48
+ return lang;
49
+ }
50
+ var browserLang = navigator.language.split('-')[0].toLowerCase();
51
+ if (translations[browserLang])
52
+ return browserLang;
53
+ return 'en';
54
+ }
37
55
  var ColorPicker = (function () {
38
56
  function ColorPicker(element, options) {
39
57
  if (options === void 0) { options = {}; }
@@ -82,6 +100,9 @@ var ColorPicker = (function () {
82
100
  inline: (_f = options.inline) !== null && _f !== void 0 ? _f : false,
83
101
  compact: (_g = options.compact) !== null && _g !== void 0 ? _g : false,
84
102
  inputPreview: (_h = options.inputPreview) !== null && _h !== void 0 ? _h : false,
103
+ previewTarget: options.previewTarget || "",
104
+ previewProperty: options.previewProperty || "background-color",
105
+ language: options.language || detectLanguage(),
85
106
  onChange: options.onChange || (function () { }),
86
107
  onOpen: options.onOpen || (function () { }),
87
108
  onClose: options.onClose || (function () { }),
@@ -89,16 +110,22 @@ var ColorPicker = (function () {
89
110
  position: options.position || "auto",
90
111
  closeOnSelect: (_j = options.closeOnSelect) !== null && _j !== void 0 ? _j : true,
91
112
  ariaLabels: {
92
- hue: ((_k = options.ariaLabels) === null || _k === void 0 ? void 0 : _k.hue) || "Hue",
93
- saturation: ((_l = options.ariaLabels) === null || _l === void 0 ? void 0 : _l.saturation) || "Saturation and Lightness",
94
- lightness: ((_m = options.ariaLabels) === null || _m === void 0 ? void 0 : _m.lightness) || "Lightness",
95
- alpha: ((_o = options.ariaLabels) === null || _o === void 0 ? void 0 : _o.alpha) || "Alpha",
96
- presets: ((_p = options.ariaLabels) === null || _p === void 0 ? void 0 : _p.presets) || "Preset colors",
113
+ hue: ((_k = options.ariaLabels) === null || _k === void 0 ? void 0 : _k.hue) || translations[options.language || detectLanguage()].hue,
114
+ saturation: ((_l = options.ariaLabels) === null || _l === void 0 ? void 0 : _l.saturation) || translations[options.language || detectLanguage()].saturation,
115
+ lightness: ((_m = options.ariaLabels) === null || _m === void 0 ? void 0 : _m.lightness) || translations[options.language || detectLanguage()].lightness,
116
+ alpha: ((_o = options.ariaLabels) === null || _o === void 0 ? void 0 : _o.alpha) || translations[options.language || detectLanguage()].alpha,
117
+ presets: ((_p = options.ariaLabels) === null || _p === void 0 ? void 0 : _p.presets) || translations[options.language || detectLanguage()].presets,
97
118
  },
98
119
  };
99
120
  this.init();
100
121
  ColorPicker.instances.set(this.input, this);
101
122
  }
123
+ ColorPicker.addTranslation = function (langCode, translation) {
124
+ translations[langCode.toLowerCase()] = translation;
125
+ };
126
+ ColorPicker.getAvailableLanguages = function () {
127
+ return Object.keys(translations);
128
+ };
102
129
  ColorPicker.prototype.init = function () {
103
130
  var initialColor = this.input.value || this.options.defaultColor;
104
131
  this.currentColor = this.parseColor(initialColor);
@@ -583,6 +610,13 @@ var ColorPicker = (function () {
583
610
  if (updateInput) {
584
611
  this.input.value = this.formatColor(this.currentColor);
585
612
  this.options.onChange(this.input.value);
613
+ if (this.options.previewTarget) {
614
+ var target = document.querySelector(this.options.previewTarget);
615
+ if (target) {
616
+ var property = this.options.previewProperty || 'background-color';
617
+ target.style.setProperty(property, this.input.value);
618
+ }
619
+ }
586
620
  if (this.compactButton) {
587
621
  var preview_1 = this.compactButton.querySelector('.colorpicker-compact-preview');
588
622
  if (preview_1) {
@@ -918,6 +952,18 @@ export function initColorPickers(root) {
918
952
  case 'inputPreview':
919
953
  options.inputPreview = value === 'true' || value === '1';
920
954
  break;
955
+ case 'target':
956
+ case 'previewTarget':
957
+ options.previewTarget = value;
958
+ break;
959
+ case 'property':
960
+ case 'previewProperty':
961
+ options.previewProperty = value;
962
+ break;
963
+ case 'lang':
964
+ case 'language':
965
+ options.language = value;
966
+ break;
921
967
  }
922
968
  });
923
969
  }
@@ -947,6 +993,8 @@ export function initColorPickers(root) {
947
993
  });
948
994
  return pickers;
949
995
  }
996
+ import * as languages_1 from './l10n';
997
+ export { languages_1 as languages };
950
998
  if (typeof window !== 'undefined' && typeof document !== 'undefined') {
951
999
  if (document.readyState === 'loading') {
952
1000
  document.addEventListener('DOMContentLoaded', function () { return initColorPickers(); });
package/dist/esm/l10n/de.js ADDED
@@ -0,0 +1,10 @@
1
+ var de = {
2
+ hue: "Farbton",
3
+ saturation: "Sättigung und Helligkeit",
4
+ lightness: "Helligkeit",
5
+ alpha: "Transparenz",
6
+ presets: "Vordefinierte Farben",
7
+ eyeDropper: "Farbe vom Bildschirm aufnehmen",
8
+ systemPicker: "System-Farbwähler"
9
+ };
10
+ export default de;
package/dist/esm/l10n/en.js ADDED
@@ -0,0 +1,10 @@
1
+ var en = {
2
+ hue: "Hue",
3
+ saturation: "Saturation and Lightness",
4
+ lightness: "Lightness",
5
+ alpha: "Alpha",
6
+ presets: "Preset colors",
7
+ eyeDropper: "Pick color from screen",
8
+ systemPicker: "System color picker"
9
+ };
10
+ export default en;
package/dist/esm/l10n/index.js ADDED
@@ -0,0 +1,3 @@
1
+ export { default as en } from './en';
2
+ export { default as de } from './de';
3
+ export { default as sl } from './sl';
package/dist/esm/l10n/sl.js ADDED
@@ -0,0 +1,10 @@
1
+ var sl = {
2
+ hue: "Odtenek",
3
+ saturation: "Nasičenost in svetlost",
4
+ lightness: "Svetlost",
5
+ alpha: "Prosojnost",
6
+ presets: "Prednastavljene barve",
7
+ eyeDropper: "Izberi barvo z zaslona",
8
+ systemPicker: "Sistemski izbirnik barv"
9
+ };
10
+ export default sl;
package/dist/esm/tsconfig.esm.tsbuildinfo CHANGED
@@ -1 +1 @@
1
- {"fileNames":["../../node_modules/typescript/lib/lib.es5.d.ts","../../node_modules/typescript/lib/lib.es2015.d.ts","../../node_modules/typescript/lib/lib.es2016.d.ts","../../node_modules/typescript/lib/lib.es2017.d.ts","../../node_modules/typescript/lib/lib.es2018.d.ts","../../node_modules/typescript/lib/lib.dom.d.ts","../../node_modules/typescript/lib/lib.es2015.core.d.ts","../../node_modules/typescript/lib/lib.es2015.collection.d.ts","../../node_modules/typescript/lib/lib.es2015.generator.d.ts","../../node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.promise.d.ts","../../node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../node_modules/typescript/lib/lib.es2016.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.arraybuffer.d.ts","../../node_modules/typescript/lib/lib.es2017.date.d.ts","../../node_modules/typescript/lib/lib.es2017.object.d.ts","../../node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2017.string.d.ts","../../node_modules/typescript/lib/lib.es2017.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../node_modules/typescript/lib/lib.es2018.intl.d.ts","../../node_modules/typescript/lib/lib.es2018.promise.d.ts","../../node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../node_modules/typescript/lib/lib.es2020.bigint.d.ts","../../node_modules/typescript/lib/lib.es2020.intl.d.ts","../../node_modules/typescript/lib/lib.esnext.intl.d.ts","../../node_modules/typescript/lib/lib.decorators.d.ts","../../node_modules/typescript/lib/lib.decorators.legacy.d.ts","../../src/colorpicker.d.ts","../../src/index.ts","../../node_modules/@types/node/globals.d.ts","../../node_modules/@types/node/async_hooks.d.ts","../../node_modules/@types/node/buffer.d.ts","../../node_modules/@types/node/child_process.d.ts","../../node_modules/@types/node/cluster.d.ts","../../node_modules/@types/node/console.d.ts","../../node_modules/@types/node/constants.d.ts","../../node_modules/@types/node/crypto.d.ts","../../node_modules/@types/node/dgram.d.ts","../../node_modules/@types/node/dns.d.ts","../../node_modules/@types/node/domain.d.ts","../../node_modules/@types/node/events.d.ts","../../node_modules/@types/node/fs.d.ts","../../node_modules/@types/node/fs/promises.d.ts","../../node_modules/@types/node/http.d.ts","../../node_modules/@types/node/http2.d.ts","../../node_modules/@types/node/https.d.ts","../../node_modules/@types/node/inspector.d.ts","../../node_modules/@types/node/module.d.ts","../../node_modules/@types/node/net.d.ts","../../node_modules/@types/node/os.d.ts","../../node_modules/@types/node/path.d.ts","../../node_modules/@types/node/perf_hooks.d.ts","../../node_modules/@types/node/process.d.ts","../../node_modules/@types/node/punycode.d.ts","../../node_modules/@types/node/querystring.d.ts","../../node_modules/@types/node/readline.d.ts","../../node_modules/@types/node/repl.d.ts","../../node_modules/@types/node/stream.d.ts","../../node_modules/@types/node/string_decoder.d.ts","../../node_modules/@types/node/timers.d.ts","../../node_modules/@types/node/tls.d.ts","../../node_modules/@types/node/trace_events.d.ts","../../node_modules/@types/node/tty.d.ts","../../node_modules/@types/node/url.d.ts","../../node_modules/@types/node/util.d.ts","../../node_modules/@types/node/v8.d.ts","../../node_modules/@types/node/vm.d.ts","../../node_modules/@types/node/worker_threads.d.ts","../../node_modules/@types/node/zlib.d.ts","../../node_modules/@types/node/ts3.4/base.d.ts","../../node_modules/@types/node/globals.global.d.ts","../../node_modules/@types/node/wasi.d.ts","../../node_modules/@types/node/ts3.6/base.d.ts","../../node_modules/@types/node/assert.d.ts","../../node_modules/@types/node/base.d.ts","../../node_modules/@types/node/index.d.ts","../../node_modules/@types/stylus/index.d.ts"],"fileIdsList":[[80,81],[48,49,56,65],[40,48,56],[72],[44,49,57],[65],[46,48,56],[48],[48,50,65,71],[49],[56,65,71],[48,49,51,56,65,68,71],[48,51,68,71],[82],[71],[46,48,65],[38],[70],[48,65],[63,72,74],[44,46,56,65],[37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76],[77,78,79],[56],[62],[48,50,65,71,74],[48,83]],"fileInfos":[{"version":"c430d44666289dae81f30fa7b2edebf186ecc91a2d4c71266ea6ae76388792e1","affectsGlobalScope":true,"impliedFormat":1},{"version":"45b7ab580deca34ae9729e97c13cfd999df04416a79116c3bfb483804f85ded4","impliedFormat":1},{"version":"3facaf05f0c5fc569c5649dd359892c98a85557e3e0c847964caeb67076f4d75","impliedFormat":1},{"version":"e44bb8bbac7f10ecc786703fe0a6a4b952189f908707980ba8f3c8975a760962","impliedFormat":1},{"version":"5e1c4c362065a6b95ff952c0eab010f04dcd2c3494e813b493ecfd4fcb9fc0d8","impliedFormat":1},{"version":"080941d9f9ff9307f7e27a83bcd888b7c8270716c39af943532438932ec1d0b9","affectsGlobalScope":true,"impliedFormat":1},{"version":"c57796738e7f83dbc4b8e65132f11a377649c00dd3eee333f672b8f0a6bea671","affectsGlobalScope":true,"impliedFormat":1},{"version":"dc2df20b1bcdc8c2d34af4926e2c3ab15ffe1160a63e58b7e09833f616efff44","affectsGlobalScope":true,"impliedFormat":1},{"version":"515d0b7b9bea2e31ea4ec968e9edd2c39d3eebf4a2d5cbd04e88639819ae3b71","affectsGlobalScope":true,"impliedFormat":1},{"version":"0559b1f683ac7505ae451f9a96ce4c3c92bdc71411651ca6ddb0e88baaaad6a3","affectsGlobalScope":true,"impliedFormat":1},{"version":"0dc1e7ceda9b8b9b455c3a2d67b0412feab00bd2f66656cd8850e8831b08b537","affectsGlobalScope":true,"impliedFormat":1},{"version":"ce691fb9e5c64efb9547083e4a34091bcbe5bdb41027e310ebba8f7d96a98671","affectsGlobalScope":true,"impliedFormat":1},{"version":"8d697a2a929a5fcb38b7a65594020fcef05ec1630804a33748829c5ff53640d0","affectsGlobalScope":true,"impliedFormat":1},{"version":"4ff2a353abf8a80ee399af572debb8faab2d33ad38c4b4474cff7f26e7653b8d","affectsGlobalScope":true,"impliedFormat":1},{"version":"fb0f136d372979348d59b3f5020b4cdb81b5504192b1cacff5d1fbba29378aa1","affectsGlobalScope":true,"impliedFormat":1},{"version":"d15bea3d62cbbdb9797079416b8ac375ae99162a7fba5de2c6c505446486ac0a","affectsGlobalScope":true,"impliedFormat":1},{"version":"68d18b664c9d32a7336a70235958b8997ebc1c3b8505f4f1ae2b7e7753b87618","affectsGlobalScope":true,"impliedFormat":1},{"version":"eb3d66c8327153d8fa7dd03f9c58d351107fe824c79e9b56b462935176cdf12a","affectsGlobalScope":true,"impliedFormat":1},{"version":"38f0219c9e23c915ef9790ab1d680440d95419ad264816fa15009a8851e79119","affectsGlobalScope":true,"impliedFormat":1},{"version":"69ab18c3b76cd9b1be3d188eaf8bba06112ebbe2f47f6c322b5105a6fbc45a2e","affectsGlobalScope":true,"impliedFormat":1},{"version":"a680117f487a4d2f30ea46f1b4b7f58bef1480456e18ba53ee85c2746eeca012","affectsGlobalScope":true,"impliedFormat":1},{"version":"2f11ff796926e0832f9ae148008138ad583bd181899ab7dd768a2666700b1893","affectsGlobalScope":true,"impliedFormat":1},{"version":"4de680d5bb41c17f7f68e0419412ca23c98d5749dcaaea1896172f06435891fc","affectsGlobalScope":true,"impliedFormat":1},{"version":"954296b30da6d508a104a3a0b5d96b76495c709785c1d11610908e63481ee667","affectsGlobalScope":true,"impliedFormat":1},{"version":"ac9538681b19688c8eae65811b329d3744af679e0bdfa5d842d0e32524c73e1c","affectsGlobalScope":true,"impliedFormat":1},{"version":"0a969edff4bd52585473d24995c5ef223f6652d6ef46193309b3921d65dd4376","affectsGlobalScope":true,"impliedFormat":1},{"version":"9e9fbd7030c440b33d021da145d3232984c8bb7916f277e8ffd3dc2e3eae2bdb","affectsGlobalScope":true,"impliedFormat":1},{"version":"811ec78f7fefcabbda4bfa93b3eb67d9ae166ef95f9bff989d964061cbf81a0c","affectsGlobalScope":true,"impliedFormat":1},{"version":"717937616a17072082152a2ef351cb51f98802fb4b2fdabd32399843875974ca","affectsGlobalScope":true,"impliedFormat":1},{"version":"d6d7ae4d1f1f3772e2a3cde568ed08991a8ae34a080ff1151af28b7f798e22ca","affectsGlobalScope":true,"impliedFormat":1},{"version":"639e512c0dfc3fad96a84caad71b8834d66329a1f28dc95e3946c9b58176c73a","affectsGlobalScope":true,"impliedFormat":1},{"version":"811c71eee4aa0ac5f7adf713323a5c41b0cf6c4e17367a34fbce379e12bbf0a4","affectsGlobalScope":true,"impliedFormat":1},{"version":"8e7f8264d0fb4c5339605a15daadb037bf238c10b654bb3eee14208f860a32ea","affectsGlobalScope":true,"impliedFormat":1},{"version":"782dec38049b92d4e85c1585fbea5474a219c6984a35b004963b00beb1aab538","affectsGlobalScope":true,"impliedFormat":1},"e7662e79ae21b1f16ea6bd668b238d79a7f4337f5ad95de573356bfa086275f8","83d376f5ff4b7cffe8606e72ce25fd85ae9ea88b32ab988bff7442ea97c51eba",{"version":"215d8d9a2c480fd460127edc048d68d9931d3b27f95132253a6e71975f060bb1","affectsGlobalScope":true,"impliedFormat":1},{"version":"c438b413e94ff76dfa20ae005f33a1c84f2480d1d66e0fd687501020d0de9b50","impliedFormat":1},{"version":"bc6a78961535181265845bf9b9e8a147ffd0ca275097ceb670a9b92afa825152","impliedFormat":1},{"version":"987249e7b75023387c5fd9dc2f959ee777cb8989b7900f5a9eb4a67d290f2cba","impliedFormat":1},{"version":"123ec69e4b3a686eb49afd94ebe3292a5c84a867ecbcb6bb84bdd720a12af803","impliedFormat":1},{"version":"eb5197aade83cb0e360ac407289c53a8009e8fdae7939892a0240d30444496b6","affectsGlobalScope":true,"impliedFormat":1},{"version":"90c85ddbb8de82cd19198bda062065fc51b7407c0f206f2e399e65a52e979720","impliedFormat":1},{"version":"2636f61a2d5f76d4039c7110f65c407a028ec5265e03d855fc2cf62b198ac415","impliedFormat":1},{"version":"7e050b767ed10c7ffbc01f314defbf420bf0b5d54ce666e1c87507c035dfc191","impliedFormat":1},{"version":"7db7569fbb3e2b01ba8751c761cdd3f0debd104170d5665b7dc20a11630df3a9","impliedFormat":1},{"version":"cde4d7f6274468180fa39847b183aec22626e8212ff885d535c53f4cd7c225fd","affectsGlobalScope":true,"impliedFormat":1},{"version":"365e8358843a23944be84b810b1f774ea0223adfccc085f30fd7f4c13dc8a09f","affectsGlobalScope":true,"impliedFormat":1},{"version":"f87f95c015900102a5c0edcdebb17596de1382510e6cc17ab79f375d3505bb12","impliedFormat":1},{"version":"05b5679a897598ebe556ee93415b3af1f456e674ea82e4d7afcd716bfe43aa98","impliedFormat":1},{"version":"35fe02b2c10616cc7ac3db9c15778df7ed9c99276889efdd9be31f342841cfcd","impliedFormat":1},{"version":"1c3fe66943f587685aa4a42f664f794655da1767401d2f85910177dac78aa45d","impliedFormat":1},{"version":"c969bf4c7cdfe4d5dd28aa09432f99d09ad1d8d8b839959646579521d0467d1a","impliedFormat":1},{"version":"6c3857edaeeaaf43812f527830ebeece9266b6e8eb5271ab6d2f0008306c9947","impliedFormat":1},{"version":"bc6a77e750f4d34584e46b1405b771fb69a224197dd6bafe5b0392a29a70b665","impliedFormat":1},{"version":"8de97668870cfb20fc9d355d2ef379e897bdd8a98c889c7d8a6de40ee408ad52","impliedFormat":1},{"version":"ed4ae81196cccc10f297d228bca8d02e31058e6d723a3c5bc4be5fb3c61c6a34","impliedFormat":1},{"version":"84044697c8b3e08ef24e4b32cfe6440143d07e469a5e34bda0635276d32d9f35","impliedFormat":1},{"version":"4982d94cb6427263c8839d8d6324a8bbe129e931deb61a7380f8fad17ba2cfc0","impliedFormat":1},{"version":"ae4bc1dd4d9de7bbea6ce419db45af82a81358e6014c9e1235b5d252e06f8ab8","affectsGlobalScope":true,"impliedFormat":1},{"version":"3f6a1fd73c9dc3bd7f4b79bc075297ca6527904df69b0f2c2c94e4c4c7d9a32c","impliedFormat":1},{"version":"884560fda6c3868f925f022adc3a1289fe6507bbb45adb10fa1bbcc73a941bb0","impliedFormat":1},{"version":"6b2bb67b0942bcfce93e1d6fad5f70afd54940a2b13df7f311201fba54b2cbe9","impliedFormat":1},{"version":"acbed967a379b3e9f73237ba9473f8b337eeea14b7dc64d445430b5d695751da","impliedFormat":1},{"version":"272a46cc8f494677af587d17939e61e7db2b1925633e4da0c186ba17f6732521","impliedFormat":1},{"version":"d67e08745494b000da9410c1ae2fdc9965fc6d593fe0f381a47491f75417d457","impliedFormat":1},{"version":"b40652bf8ce4a18133b31349086523b219724dca8df3448c1a0742528e7ad5b9","impliedFormat":1},{"version":"c52eb62e3388a01b966c57bd14ca0ee9d5f6e656d6a18f6ce6b7cdece63734a3","impliedFormat":1},{"version":"a77fdb357c78b70142b2fdbbfb72958d69e8f765fd2a3c69946c1018e89d4638","impliedFormat":1},{"version":"3c2ac350c3baa61fd2b1925844109e098f4376d0768a4643abc82754fd752748","impliedFormat":1},{"version":"80ffc1786a5dab91b4aa59a72720f02f25df8b7c76b593e04d5e381aec284ccb","impliedFormat":1},{"version":"f5b9d446783f075eed9e93dfba1a5055b3fd61aab285fef3bbc761eadf598204","impliedFormat":1},{"version":"289be113bad7ee27ee7fa5b1e373c964c9789a5e9ed7db5ddcb631371120b953","impliedFormat":1},{"version":"baf0b82ffc5d2616f44a6fb1f81e8d798545bebf0c30f5d8b003a1dba1acfb3f","impliedFormat":1},{"version":"c6a5b34f1e725019445754f1e733585f113e0dced75f137bd3c4af5853d3f6ab","impliedFormat":1},{"version":"15fbe50526244954eb2f933546bca6cdcf0db16c9428d099b3b386c1db5799ab","impliedFormat":1},{"version":"d44028ae0127eb3e9fcfa5f55a8b81d64775ce15aca1020fe25c511bbb055834","impliedFormat":1},{"version":"2708349d5a11a5c2e5f3a0765259ebe7ee00cdcc8161cb9990cb4910328442a1","affectsGlobalScope":true,"impliedFormat":1},{"version":"4e0a4d84b15692ea8669fe4f3d05a4f204567906b1347da7a58b75f45bae48d3","impliedFormat":1},{"version":"ad1ae5ae98eceb9af99061e83e867b9897d267aebc8f3b938c9424deabadf4bb","impliedFormat":1},{"version":"6fbe72eed85e363ad83b763e03be824558c6ea7456c7259a48bcf0afdeb9d7e4","impliedFormat":1},{"version":"e61a21e9418f279bc480394a94d1581b2dee73747adcbdef999b6737e34d721b","impliedFormat":1},{"version":"5825520e2099309182c6e2a2b3061b060d42a098c58f67d1754880a7e2cce99a","impliedFormat":1},{"version":"c6db2268b4c7189a5d33b3bbf6616f3cc83bdad97468a25a172901d7ec28ff82","impliedFormat":1}],"root":[35,36],"options":{"allowSyntheticDefaultImports":true,"esModuleInterop":true,"module":5,"noImplicitAny":true,"noUnusedLocals":true,"noUnusedParameters":true,"outDir":"./","removeComments":true,"strict":true,"target":1},"referencedMap":[[82,1],[40,2],[41,3],[42,4],[43,5],[44,6],[45,7],[47,8],[49,9],[50,10],[51,11],[52,12],[53,13],[83,14],[54,8],[55,15],[56,16],[59,17],[60,18],[63,19],[64,20],[65,8],[68,21],[77,22],[80,23],[70,24],[71,25],[73,6],[75,26],[76,6],[84,27]],"version":"5.9.3"}
1
+ {"fileNames":["../../node_modules/typescript/lib/lib.es5.d.ts","../../node_modules/typescript/lib/lib.es2015.d.ts","../../node_modules/typescript/lib/lib.es2016.d.ts","../../node_modules/typescript/lib/lib.es2017.d.ts","../../node_modules/typescript/lib/lib.es2018.d.ts","../../node_modules/typescript/lib/lib.dom.d.ts","../../node_modules/typescript/lib/lib.es2015.core.d.ts","../../node_modules/typescript/lib/lib.es2015.collection.d.ts","../../node_modules/typescript/lib/lib.es2015.generator.d.ts","../../node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.promise.d.ts","../../node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../node_modules/typescript/lib/lib.es2016.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.arraybuffer.d.ts","../../node_modules/typescript/lib/lib.es2017.date.d.ts","../../node_modules/typescript/lib/lib.es2017.object.d.ts","../../node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2017.string.d.ts","../../node_modules/typescript/lib/lib.es2017.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../node_modules/typescript/lib/lib.es2018.intl.d.ts","../../node_modules/typescript/lib/lib.es2018.promise.d.ts","../../node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../node_modules/typescript/lib/lib.es2020.bigint.d.ts","../../node_modules/typescript/lib/lib.es2020.intl.d.ts","../../node_modules/typescript/lib/lib.esnext.intl.d.ts","../../node_modules/typescript/lib/lib.decorators.d.ts","../../node_modules/typescript/lib/lib.decorators.legacy.d.ts","../../src/colorpicker.d.ts","../../src/l10n/en.ts","../../src/l10n/de.ts","../../src/l10n/sl.ts","../../src/l10n/index.ts","../../src/index.ts","../../node_modules/@types/node/globals.d.ts","../../node_modules/@types/node/async_hooks.d.ts","../../node_modules/@types/node/buffer.d.ts","../../node_modules/@types/node/child_process.d.ts","../../node_modules/@types/node/cluster.d.ts","../../node_modules/@types/node/console.d.ts","../../node_modules/@types/node/constants.d.ts","../../node_modules/@types/node/crypto.d.ts","../../node_modules/@types/node/dgram.d.ts","../../node_modules/@types/node/dns.d.ts","../../node_modules/@types/node/domain.d.ts","../../node_modules/@types/node/events.d.ts","../../node_modules/@types/node/fs.d.ts","../../node_modules/@types/node/fs/promises.d.ts","../../node_modules/@types/node/http.d.ts","../../node_modules/@types/node/http2.d.ts","../../node_modules/@types/node/https.d.ts","../../node_modules/@types/node/inspector.d.ts","../../node_modules/@types/node/module.d.ts","../../node_modules/@types/node/net.d.ts","../../node_modules/@types/node/os.d.ts","../../node_modules/@types/node/path.d.ts","../../node_modules/@types/node/perf_hooks.d.ts","../../node_modules/@types/node/process.d.ts","../../node_modules/@types/node/punycode.d.ts","../../node_modules/@types/node/querystring.d.ts","../../node_modules/@types/node/readline.d.ts","../../node_modules/@types/node/repl.d.ts","../../node_modules/@types/node/stream.d.ts","../../node_modules/@types/node/string_decoder.d.ts","../../node_modules/@types/node/timers.d.ts","../../node_modules/@types/node/tls.d.ts","../../node_modules/@types/node/trace_events.d.ts","../../node_modules/@types/node/tty.d.ts","../../node_modules/@types/node/url.d.ts","../../node_modules/@types/node/util.d.ts","../../node_modules/@types/node/v8.d.ts","../../node_modules/@types/node/vm.d.ts","../../node_modules/@types/node/worker_threads.d.ts","../../node_modules/@types/node/zlib.d.ts","../../node_modules/@types/node/ts3.4/base.d.ts","../../node_modules/@types/node/globals.global.d.ts","../../node_modules/@types/node/wasi.d.ts","../../node_modules/@types/node/ts3.6/base.d.ts","../../node_modules/@types/node/assert.d.ts","../../node_modules/@types/node/base.d.ts","../../node_modules/@types/node/index.d.ts","../../node_modules/@types/stylus/index.d.ts"],"fileIdsList":[[84,85],[52,53,60,69],[44,52,60],[76],[48,53,61],[69],[50,52,60],[52],[52,54,69,75],[53],[60,69,75],[52,53,55,60,69,72,75],[52,55,72,75],[86],[75],[50,52,69],[42],[74],[52,69],[67,76,78],[48,50,60,69],[41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80],[81,82,83],[60],[66],[52,54,69,75,78],[52,87],[39],[40],[36,37,38]],"fileInfos":[{"version":"c430d44666289dae81f30fa7b2edebf186ecc91a2d4c71266ea6ae76388792e1","affectsGlobalScope":true,"impliedFormat":1},{"version":"45b7ab580deca34ae9729e97c13cfd999df04416a79116c3bfb483804f85ded4","impliedFormat":1},{"version":"3facaf05f0c5fc569c5649dd359892c98a85557e3e0c847964caeb67076f4d75","impliedFormat":1},{"version":"e44bb8bbac7f10ecc786703fe0a6a4b952189f908707980ba8f3c8975a760962","impliedFormat":1},{"version":"5e1c4c362065a6b95ff952c0eab010f04dcd2c3494e813b493ecfd4fcb9fc0d8","impliedFormat":1},{"version":"080941d9f9ff9307f7e27a83bcd888b7c8270716c39af943532438932ec1d0b9","affectsGlobalScope":true,"impliedFormat":1},{"version":"c57796738e7f83dbc4b8e65132f11a377649c00dd3eee333f672b8f0a6bea671","affectsGlobalScope":true,"impliedFormat":1},{"version":"dc2df20b1bcdc8c2d34af4926e2c3ab15ffe1160a63e58b7e09833f616efff44","affectsGlobalScope":true,"impliedFormat":1},{"version":"515d0b7b9bea2e31ea4ec968e9edd2c39d3eebf4a2d5cbd04e88639819ae3b71","affectsGlobalScope":true,"impliedFormat":1},{"version":"0559b1f683ac7505ae451f9a96ce4c3c92bdc71411651ca6ddb0e88baaaad6a3","affectsGlobalScope":true,"impliedFormat":1},{"version":"0dc1e7ceda9b8b9b455c3a2d67b0412feab00bd2f66656cd8850e8831b08b537","affectsGlobalScope":true,"impliedFormat":1},{"version":"ce691fb9e5c64efb9547083e4a34091bcbe5bdb41027e310ebba8f7d96a98671","affectsGlobalScope":true,"impliedFormat":1},{"version":"8d697a2a929a5fcb38b7a65594020fcef05ec1630804a33748829c5ff53640d0","affectsGlobalScope":true,"impliedFormat":1},{"version":"4ff2a353abf8a80ee399af572debb8faab2d33ad38c4b4474cff7f26e7653b8d","affectsGlobalScope":true,"impliedFormat":1},{"version":"fb0f136d372979348d59b3f5020b4cdb81b5504192b1cacff5d1fbba29378aa1","affectsGlobalScope":true,"impliedFormat":1},{"version":"d15bea3d62cbbdb9797079416b8ac375ae99162a7fba5de2c6c505446486ac0a","affectsGlobalScope":true,"impliedFormat":1},{"version":"68d18b664c9d32a7336a70235958b8997ebc1c3b8505f4f1ae2b7e7753b87618","affectsGlobalScope":true,"impliedFormat":1},{"version":"eb3d66c8327153d8fa7dd03f9c58d351107fe824c79e9b56b462935176cdf12a","affectsGlobalScope":true,"impliedFormat":1},{"version":"38f0219c9e23c915ef9790ab1d680440d95419ad264816fa15009a8851e79119","affectsGlobalScope":true,"impliedFormat":1},{"version":"69ab18c3b76cd9b1be3d188eaf8bba06112ebbe2f47f6c322b5105a6fbc45a2e","affectsGlobalScope":true,"impliedFormat":1},{"version":"a680117f487a4d2f30ea46f1b4b7f58bef1480456e18ba53ee85c2746eeca012","affectsGlobalScope":true,"impliedFormat":1},{"version":"2f11ff796926e0832f9ae148008138ad583bd181899ab7dd768a2666700b1893","affectsGlobalScope":true,"impliedFormat":1},{"version":"4de680d5bb41c17f7f68e0419412ca23c98d5749dcaaea1896172f06435891fc","affectsGlobalScope":true,"impliedFormat":1},{"version":"954296b30da6d508a104a3a0b5d96b76495c709785c1d11610908e63481ee667","affectsGlobalScope":true,"impliedFormat":1},{"version":"ac9538681b19688c8eae65811b329d3744af679e0bdfa5d842d0e32524c73e1c","affectsGlobalScope":true,"impliedFormat":1},{"version":"0a969edff4bd52585473d24995c5ef223f6652d6ef46193309b3921d65dd4376","affectsGlobalScope":true,"impliedFormat":1},{"version":"9e9fbd7030c440b33d021da145d3232984c8bb7916f277e8ffd3dc2e3eae2bdb","affectsGlobalScope":true,"impliedFormat":1},{"version":"811ec78f7fefcabbda4bfa93b3eb67d9ae166ef95f9bff989d964061cbf81a0c","affectsGlobalScope":true,"impliedFormat":1},{"version":"717937616a17072082152a2ef351cb51f98802fb4b2fdabd32399843875974ca","affectsGlobalScope":true,"impliedFormat":1},{"version":"d6d7ae4d1f1f3772e2a3cde568ed08991a8ae34a080ff1151af28b7f798e22ca","affectsGlobalScope":true,"impliedFormat":1},{"version":"639e512c0dfc3fad96a84caad71b8834d66329a1f28dc95e3946c9b58176c73a","affectsGlobalScope":true,"impliedFormat":1},{"version":"811c71eee4aa0ac5f7adf713323a5c41b0cf6c4e17367a34fbce379e12bbf0a4","affectsGlobalScope":true,"impliedFormat":1},{"version":"8e7f8264d0fb4c5339605a15daadb037bf238c10b654bb3eee14208f860a32ea","affectsGlobalScope":true,"impliedFormat":1},{"version":"782dec38049b92d4e85c1585fbea5474a219c6984a35b004963b00beb1aab538","affectsGlobalScope":true,"impliedFormat":1},"e7662e79ae21b1f16ea6bd668b238d79a7f4337f5ad95de573356bfa086275f8","3c5f2707759dc0cc56daf227012ee2881823acf5c95a3ab6c124c01818e5643c","44660be446f377579c640a5a46eec4d579b987b7d18517ee0a38bab91c273d8e","e8771d519b52c977d06fa45117fd4cef871479140db42b878293ccc4bb68faf3","882c72694118cbdab24a9141535fad450fc8b9695486f2f5b9b708135fb64d9d","475c31a8fc775e0bbe3e617eb5b7b816eb2cd66e46ca3d6bc3e91cc6604b1fa7",{"version":"215d8d9a2c480fd460127edc048d68d9931d3b27f95132253a6e71975f060bb1","affectsGlobalScope":true,"impliedFormat":1},{"version":"c438b413e94ff76dfa20ae005f33a1c84f2480d1d66e0fd687501020d0de9b50","impliedFormat":1},{"version":"bc6a78961535181265845bf9b9e8a147ffd0ca275097ceb670a9b92afa825152","impliedFormat":1},{"version":"987249e7b75023387c5fd9dc2f959ee777cb8989b7900f5a9eb4a67d290f2cba","impliedFormat":1},{"version":"123ec69e4b3a686eb49afd94ebe3292a5c84a867ecbcb6bb84bdd720a12af803","impliedFormat":1},{"version":"eb5197aade83cb0e360ac407289c53a8009e8fdae7939892a0240d30444496b6","affectsGlobalScope":true,"impliedFormat":1},{"version":"90c85ddbb8de82cd19198bda062065fc51b7407c0f206f2e399e65a52e979720","impliedFormat":1},{"version":"2636f61a2d5f76d4039c7110f65c407a028ec5265e03d855fc2cf62b198ac415","impliedFormat":1},{"version":"7e050b767ed10c7ffbc01f314defbf420bf0b5d54ce666e1c87507c035dfc191","impliedFormat":1},{"version":"7db7569fbb3e2b01ba8751c761cdd3f0debd104170d5665b7dc20a11630df3a9","impliedFormat":1},{"version":"cde4d7f6274468180fa39847b183aec22626e8212ff885d535c53f4cd7c225fd","affectsGlobalScope":true,"impliedFormat":1},{"version":"365e8358843a23944be84b810b1f774ea0223adfccc085f30fd7f4c13dc8a09f","affectsGlobalScope":true,"impliedFormat":1},{"version":"f87f95c015900102a5c0edcdebb17596de1382510e6cc17ab79f375d3505bb12","impliedFormat":1},{"version":"05b5679a897598ebe556ee93415b3af1f456e674ea82e4d7afcd716bfe43aa98","impliedFormat":1},{"version":"35fe02b2c10616cc7ac3db9c15778df7ed9c99276889efdd9be31f342841cfcd","impliedFormat":1},{"version":"1c3fe66943f587685aa4a42f664f794655da1767401d2f85910177dac78aa45d","impliedFormat":1},{"version":"c969bf4c7cdfe4d5dd28aa09432f99d09ad1d8d8b839959646579521d0467d1a","impliedFormat":1},{"version":"6c3857edaeeaaf43812f527830ebeece9266b6e8eb5271ab6d2f0008306c9947","impliedFormat":1},{"version":"bc6a77e750f4d34584e46b1405b771fb69a224197dd6bafe5b0392a29a70b665","impliedFormat":1},{"version":"8de97668870cfb20fc9d355d2ef379e897bdd8a98c889c7d8a6de40ee408ad52","impliedFormat":1},{"version":"ed4ae81196cccc10f297d228bca8d02e31058e6d723a3c5bc4be5fb3c61c6a34","impliedFormat":1},{"version":"84044697c8b3e08ef24e4b32cfe6440143d07e469a5e34bda0635276d32d9f35","impliedFormat":1},{"version":"4982d94cb6427263c8839d8d6324a8bbe129e931deb61a7380f8fad17ba2cfc0","impliedFormat":1},{"version":"ae4bc1dd4d9de7bbea6ce419db45af82a81358e6014c9e1235b5d252e06f8ab8","affectsGlobalScope":true,"impliedFormat":1},{"version":"3f6a1fd73c9dc3bd7f4b79bc075297ca6527904df69b0f2c2c94e4c4c7d9a32c","impliedFormat":1},{"version":"884560fda6c3868f925f022adc3a1289fe6507bbb45adb10fa1bbcc73a941bb0","impliedFormat":1},{"version":"6b2bb67b0942bcfce93e1d6fad5f70afd54940a2b13df7f311201fba54b2cbe9","impliedFormat":1},{"version":"acbed967a379b3e9f73237ba9473f8b337eeea14b7dc64d445430b5d695751da","impliedFormat":1},{"version":"272a46cc8f494677af587d17939e61e7db2b1925633e4da0c186ba17f6732521","impliedFormat":1},{"version":"d67e08745494b000da9410c1ae2fdc9965fc6d593fe0f381a47491f75417d457","impliedFormat":1},{"version":"b40652bf8ce4a18133b31349086523b219724dca8df3448c1a0742528e7ad5b9","impliedFormat":1},{"version":"c52eb62e3388a01b966c57bd14ca0ee9d5f6e656d6a18f6ce6b7cdece63734a3","impliedFormat":1},{"version":"a77fdb357c78b70142b2fdbbfb72958d69e8f765fd2a3c69946c1018e89d4638","impliedFormat":1},{"version":"3c2ac350c3baa61fd2b1925844109e098f4376d0768a4643abc82754fd752748","impliedFormat":1},{"version":"80ffc1786a5dab91b4aa59a72720f02f25df8b7c76b593e04d5e381aec284ccb","impliedFormat":1},{"version":"f5b9d446783f075eed9e93dfba1a5055b3fd61aab285fef3bbc761eadf598204","impliedFormat":1},{"version":"289be113bad7ee27ee7fa5b1e373c964c9789a5e9ed7db5ddcb631371120b953","impliedFormat":1},{"version":"baf0b82ffc5d2616f44a6fb1f81e8d798545bebf0c30f5d8b003a1dba1acfb3f","impliedFormat":1},{"version":"c6a5b34f1e725019445754f1e733585f113e0dced75f137bd3c4af5853d3f6ab","impliedFormat":1},{"version":"15fbe50526244954eb2f933546bca6cdcf0db16c9428d099b3b386c1db5799ab","impliedFormat":1},{"version":"d44028ae0127eb3e9fcfa5f55a8b81d64775ce15aca1020fe25c511bbb055834","impliedFormat":1},{"version":"2708349d5a11a5c2e5f3a0765259ebe7ee00cdcc8161cb9990cb4910328442a1","affectsGlobalScope":true,"impliedFormat":1},{"version":"4e0a4d84b15692ea8669fe4f3d05a4f204567906b1347da7a58b75f45bae48d3","impliedFormat":1},{"version":"ad1ae5ae98eceb9af99061e83e867b9897d267aebc8f3b938c9424deabadf4bb","impliedFormat":1},{"version":"6fbe72eed85e363ad83b763e03be824558c6ea7456c7259a48bcf0afdeb9d7e4","impliedFormat":1},{"version":"e61a21e9418f279bc480394a94d1581b2dee73747adcbdef999b6737e34d721b","impliedFormat":1},{"version":"5825520e2099309182c6e2a2b3061b060d42a098c58f67d1754880a7e2cce99a","impliedFormat":1},{"version":"c6db2268b4c7189a5d33b3bbf6616f3cc83bdad97468a25a172901d7ec28ff82","impliedFormat":1}],"root":[[35,40]],"options":{"allowSyntheticDefaultImports":true,"esModuleInterop":true,"module":5,"noImplicitAny":true,"noUnusedLocals":true,"noUnusedParameters":true,"outDir":"./","removeComments":true,"strict":true,"target":1},"referencedMap":[[86,1],[44,2],[45,3],[46,4],[47,5],[48,6],[49,7],[51,8],[53,9],[54,10],[55,11],[56,12],[57,13],[87,14],[58,8],[59,15],[60,16],[63,17],[64,18],[67,19],[68,20],[69,8],[72,21],[81,22],[84,23],[74,24],[75,25],[77,6],[79,26],[80,6],[88,27],[40,28],[37,29],[36,29],[39,30],[38,29]],"version":"5.9.3"}
package/dist/index.d.ts CHANGED
@@ -1,3 +1,12 @@
1
+ export interface ColorPickerLanguage {
2
+ hue: string;
3
+ saturation: string;
4
+ lightness: string;
5
+ alpha: string;
6
+ presets: string;
7
+ eyeDropper: string;
8
+ systemPicker: string;
9
+ }
1
10
  export interface ColorPickerOptions {
2
11
  defaultColor?: string;
3
12
  format?: "hex" | "rgb" | "hsl";
@@ -11,6 +20,9 @@ export interface ColorPickerOptions {
11
20
  inline?: boolean;
12
21
  compact?: boolean;
13
22
  inputPreview?: boolean;
23
+ previewTarget?: string;
24
+ previewProperty?: string;
25
+ language?: string;
14
26
  onChange?: (color: string) => void;
15
27
  onOpen?: () => void;
16
28
  onClose?: () => void;
@@ -41,6 +53,8 @@ export declare class ColorPicker {
41
53
  private compactButton;
42
54
  private inputPreview;
43
55
  private static instances;
56
+ static addTranslation(langCode: string, translation: ColorPickerLanguage): void;
57
+ static getAvailableLanguages(): string[];
44
58
  constructor(element: string | HTMLInputElement, options?: ColorPickerOptions);
45
59
  private init;
46
60
  private buildColorPicker;
@@ -80,3 +94,4 @@ export declare class ColorPicker {
80
94
  }
81
95
  export default function colorpicker(selector: string | HTMLInputElement, options?: ColorPickerOptions): ColorPicker;
82
96
  export declare function initColorPickers(root?: Document | HTMLElement): ColorPicker[];
97
+ export * as languages from './l10n';
package/dist/l10n/de.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { ColorPickerLanguage } from '../index';
2
+ declare const de: ColorPickerLanguage;
3
+ export default de;
package/dist/l10n/en.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { ColorPickerLanguage } from '../index';
2
+ declare const en: ColorPickerLanguage;
3
+ export default en;
package/dist/l10n/index.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ export { default as en } from './en';
2
+ export { default as de } from './de';
3
+ export { default as sl } from './sl';
package/dist/l10n/sl.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { ColorPickerLanguage } from '../index';
2
+ declare const sl: ColorPickerLanguage;
3
+ export default sl;
package/package.json CHANGED
@@ -1,10 +1,27 @@
1
1
  {
2
2
  "name": "pickit-color",
3
- "version": "1.0.4",
3
+ "version": "1.2.0",
4
4
  "description": "A modern, accessible color picker with HSL support, presets, slider mode, and screen color picking",
5
5
  "main": "dist/colorpicker.js",
6
6
  "module": "dist/esm/colorpicker/index.js",
7
7
  "types": "dist/colorpicker.d.ts",
8
+ "exports": {
9
+ ".": {
10
+ "import": "./dist/esm/colorpicker/index.js",
11
+ "require": "./dist/colorpicker.js",
12
+ "types": "./dist/colorpicker.d.ts"
13
+ },
14
+ "./l10n": {
15
+ "import": "./dist/esm/colorpicker/l10n/index.js",
16
+ "require": "./dist/l10n/index.js",
17
+ "types": "./dist/l10n/index.d.ts"
18
+ },
19
+ "./l10n/*": {
20
+ "import": "./dist/esm/colorpicker/l10n/*.js",
21
+ "require": "./dist/l10n/*.js",
22
+ "types": "./dist/l10n/*.d.ts"
23
+ }
24
+ },
8
25
  "author": {
9
26
  "name": "Thomas Skerbis",
10
27
  "email": "thomas@klxm.de",
@@ -42,11 +59,12 @@
42
59
  "README.md"
43
60
  ],
44
61
  "scripts": {
45
- "build": "run-s build:pre build:build build:esm build:types",
62
+ "build": "run-s build:pre build:build build:esm build:types build:docs",
46
63
  "build:pre": "rimraf dist",
47
64
  "build:build": "ts-node --transpile-only build.ts",
48
65
  "build:esm": "tsc -p tsconfig.esm.json",
49
66
  "build:types": "tsc -p tsconfig.declarations.json",
67
+ "build:docs": "cp -r dist/* docs/dist/",
50
68
  "prepublishOnly": "npm run build",
51
69
  "release": "./release.sh"
52
70
  },
package/src/index.ts CHANGED
@@ -4,6 +4,41 @@
4
4
  * Supports HSL, RGB, HEX formats with keyboard navigation
5
5
  */
6
6
 
7
+ import * as languages from './l10n';
8
+
9
+ export interface ColorPickerLanguage {
10
+ hue: string;
11
+ saturation: string;
12
+ lightness: string;
13
+ alpha: string;
14
+ presets: string;
15
+ eyeDropper: string;
16
+ systemPicker: string;
17
+ }
18
+
19
+ // Initialize translations with built-in languages
20
+ const translations: Record<string, ColorPickerLanguage> = {
21
+ en: languages.en,
22
+ de: languages.de,
23
+ sl: languages.sl
24
+ };
25
+
26
+ function detectLanguage(): string {
27
+ // Try HTML lang attribute
28
+ const htmlLang = document.documentElement.lang;
29
+ if (htmlLang) {
30
+ const lang = htmlLang.split('-')[0].toLowerCase();
31
+ if (translations[lang]) return lang;
32
+ }
33
+
34
+ // Try browser language
35
+ const browserLang = navigator.language.split('-')[0].toLowerCase();
36
+ if (translations[browserLang]) return browserLang;
37
+
38
+ // Default to English
39
+ return 'en';
40
+ }
41
+
7
42
  export interface ColorPickerOptions {
8
43
  defaultColor?: string;
9
44
  format?: "hex" | "rgb" | "hsl";
@@ -17,6 +52,9 @@ export interface ColorPickerOptions {
17
52
  inline?: boolean;
18
53
  compact?: boolean;
19
54
  inputPreview?: boolean;
55
+ previewTarget?: string;
56
+ previewProperty?: string;
57
+ language?: string;
20
58
  onChange?: (color: string) => void;
21
59
  onOpen?: () => void;
22
60
  onClose?: () => void;
@@ -64,6 +102,33 @@ export class ColorPicker {
64
102
 
65
103
  private static instances: Map<HTMLElement, ColorPicker> = new Map();
66
104
 
105
+ /**
106
+ * Add a custom translation for the ColorPicker
107
+ * @param langCode - Language code (e.g., 'fr', 'es', 'it')
108
+ * @param translation - Translation object with all required strings
109
+ * @example
110
+ * ColorPicker.addTranslation('fr', {
111
+ * hue: 'Teinte',
112
+ * saturation: 'Saturation et luminosité',
113
+ * lightness: 'Luminosité',
114
+ * alpha: 'Alpha',
115
+ * presets: 'Couleurs prédéfinies',
116
+ * eyeDropper: 'Pipette à couleurs',
117
+ * systemPicker: 'Sélecteur système'
118
+ * });
119
+ */
120
+ static addTranslation(langCode: string, translation: ColorPickerLanguage): void {
121
+ translations[langCode.toLowerCase()] = translation;
122
+ }
123
+
124
+ /**
125
+ * Get all available language codes
126
+ * @returns Array of language codes
127
+ */
128
+ static getAvailableLanguages(): string[] {
129
+ return Object.keys(translations);
130
+ }
131
+
67
132
  constructor(
68
133
  element: string | HTMLInputElement,
69
134
  options: ColorPickerOptions = {}
@@ -103,6 +168,9 @@ export class ColorPicker {
103
168
  inline: options.inline ?? false,
104
169
  compact: options.compact ?? false,
105
170
  inputPreview: options.inputPreview ?? false,
171
+ previewTarget: options.previewTarget || "",
172
+ previewProperty: options.previewProperty || "background-color",
173
+ language: options.language || detectLanguage(),
106
174
  onChange: options.onChange || (() => {}),
107
175
  onOpen: options.onOpen || (() => {}),
108
176
  onClose: options.onClose || (() => {}),
@@ -110,12 +178,12 @@ export class ColorPicker {
110
178
  position: options.position || "auto",
111
179
  closeOnSelect: options.closeOnSelect ?? true,
112
180
  ariaLabels: {
113
- hue: options.ariaLabels?.hue || "Hue",
181
+ hue: options.ariaLabels?.hue || translations[options.language || detectLanguage()].hue,
114
182
  saturation:
115
- options.ariaLabels?.saturation || "Saturation and Lightness",
116
- lightness: options.ariaLabels?.lightness || "Lightness",
117
- alpha: options.ariaLabels?.alpha || "Alpha",
118
- presets: options.ariaLabels?.presets || "Preset colors",
183
+ options.ariaLabels?.saturation || translations[options.language || detectLanguage()].saturation,
184
+ lightness: options.ariaLabels?.lightness || translations[options.language || detectLanguage()].lightness,
185
+ alpha: options.ariaLabels?.alpha || translations[options.language || detectLanguage()].alpha,
186
+ presets: options.ariaLabels?.presets || translations[options.language || detectLanguage()].presets,
119
187
  },
120
188
  };
121
189
 
@@ -898,6 +966,15 @@ export class ColorPicker {
898
966
  this.input.value = this.formatColor(this.currentColor);
899
967
  this.options.onChange(this.input.value);
900
968
 
969
+ // Update preview target if configured
970
+ if (this.options.previewTarget) {
971
+ const target = document.querySelector(this.options.previewTarget) as HTMLElement;
972
+ if (target) {
973
+ const property = this.options.previewProperty || 'background-color';
974
+ target.style.setProperty(property, this.input.value);
975
+ }
976
+ }
977
+
901
978
  // Update compact button preview
902
979
  if (this.compactButton) {
903
980
  const preview = this.compactButton.querySelector('.colorpicker-compact-preview') as HTMLElement;
@@ -1305,6 +1382,18 @@ export function initColorPickers(root: Document | HTMLElement = document): Color
1305
1382
  case 'inputPreview':
1306
1383
  options.inputPreview = value === 'true' || value === '1';
1307
1384
  break;
1385
+ case 'target':
1386
+ case 'previewTarget':
1387
+ options.previewTarget = value;
1388
+ break;
1389
+ case 'property':
1390
+ case 'previewProperty':
1391
+ options.previewProperty = value;
1392
+ break;
1393
+ case 'lang':
1394
+ case 'language':
1395
+ options.language = value;
1396
+ break;
1308
1397
  }
1309
1398
  });
1310
1399
  }
@@ -1340,6 +1429,9 @@ export function initColorPickers(root: Document | HTMLElement = document): Color
1340
1429
  return pickers;
1341
1430
  }
1342
1431
 
1432
+ // Export language modules for external use
1433
+ export * as languages from './l10n';
1434
+
1343
1435
  // Auto-init on DOMContentLoaded
1344
1436
  if (typeof window !== 'undefined' && typeof document !== 'undefined') {
1345
1437
  if (document.readyState === 'loading') {
package/src/l10n/README.md ADDED
@@ -0,0 +1,94 @@
1
+ # 🌍 Language Files
2
+
3
+ This directory contains all language translations for Pickit Color.
4
+
5
+ ## Contributing a Translation
6
+
7
+ ### 1. Create a new language file
8
+
9
+ Copy `en.ts` and rename it to your [ISO 639-1 language code](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes):
10
+
11
+ ```bash
12
+ cp en.ts fr.ts # For French
13
+ cp en.ts es.ts # For Spanish
14
+ cp en.ts it.ts # For Italian
15
+ ```
16
+
17
+ ### 2. Translate the strings
18
+
19
+ ```typescript
20
+ import { ColorPickerLanguage } from '../index';
21
+
22
+ const fr: ColorPickerLanguage = {
23
+ hue: "Teinte",
24
+ saturation: "Saturation et luminosité",
25
+ lightness: "Luminosité",
26
+ alpha: "Alpha",
27
+ presets: "Couleurs prédéfinies",
28
+ eyeDropper: "Pipette à couleurs",
29
+ systemPicker: "Sélecteur système"
30
+ };
31
+
32
+ export default fr;
33
+ ```
34
+
35
+ ### 3. Export in index.ts
36
+
37
+ Add your language to `index.ts`:
38
+
39
+ ```typescript
40
+ export { default as fr } from './fr';
41
+ ```
42
+
43
+ ### 4. Submit a Pull Request
44
+
45
+ That's it! Your translation will be available in the next release.
46
+
47
+ ## Translation Guidelines
48
+
49
+ - **hue**: Label for the hue slider (0-360°)
50
+ - **saturation**: Label for the 2D saturation/lightness picker
51
+ - **lightness**: Label for the lightness slider
52
+ - **alpha**: Label for transparency/alpha slider
53
+ - **presets**: Label for preset colors section
54
+ - **eyeDropper**: Tooltip for the eyedropper button (screen color picker)
55
+ - **systemPicker**: Tooltip for system color picker button
56
+
57
+ Keep labels concise but descriptive. They will be used as ARIA labels for screen readers.
58
+
59
+ ## Available Languages
60
+
61
+ - 🇬🇧 **en** - English
62
+ - 🇩🇪 **de** - Deutsch (German)
63
+ - 🇸🇮 **sl** - Slovenščina (Slovenian)
64
+
65
+ ## External Language Packages
66
+
67
+ You can also publish language packs as separate npm packages:
68
+
69
+ ```typescript
70
+ // pickit-color-lang-fr package
71
+ import { ColorPicker } from 'pickit-color';
72
+
73
+ export const fr = { /* ... */ };
74
+
75
+ // Auto-register on import
76
+ ColorPicker.addTranslation('fr', fr);
77
+ ```
78
+
79
+ Install and import:
80
+
81
+ ```bash
82
+ npm install pickit-color-lang-fr
83
+ ```
84
+
85
+ ```javascript
86
+ import 'pickit-color-lang-fr';
87
+ import colorpicker from 'pickit-color';
88
+
89
+ colorpicker('#input', { language: 'fr' });
90
+ ```
91
+
92
+ ---
93
+
94
+ Thank you for contributing! 🙏
package/src/l10n/de.ts ADDED
@@ -0,0 +1,13 @@
1
+ import { ColorPickerLanguage } from '../index';
2
+
3
+ const de: ColorPickerLanguage = {
4
+ hue: "Farbton",
5
+ saturation: "Sättigung und Helligkeit",
6
+ lightness: "Helligkeit",
7
+ alpha: "Transparenz",
8
+ presets: "Vordefinierte Farben",
9
+ eyeDropper: "Farbe vom Bildschirm aufnehmen",
10
+ systemPicker: "System-Farbwähler"
11
+ };
12
+
13
+ export default de;
package/src/l10n/en.ts ADDED
@@ -0,0 +1,13 @@
1
+ import { ColorPickerLanguage } from '../index';
2
+
3
+ const en: ColorPickerLanguage = {
4
+ hue: "Hue",
5
+ saturation: "Saturation and Lightness",
6
+ lightness: "Lightness",
7
+ alpha: "Alpha",
8
+ presets: "Preset colors",
9
+ eyeDropper: "Pick color from screen",
10
+ systemPicker: "System color picker"
11
+ };
12
+
13
+ export default en;
package/src/l10n/index.ts ADDED
@@ -0,0 +1,17 @@
1
+ /**
2
+ * Pickit Color - Language Files
3
+ *
4
+ * To contribute a translation:
5
+ * 1. Copy en.ts or any existing language file
6
+ * 2. Translate all strings
7
+ * 3. Export your language in this file
8
+ * 4. Submit a PR!
9
+ */
10
+
11
+ export { default as en } from './en';
12
+ export { default as de } from './de';
13
+ export { default as sl } from './sl';
14
+
15
+ // Example for contributors:
16
+ // export { default as fr } from './fr';
17
+ // export { default as es } from './es';
package/src/l10n/sl.ts ADDED
@@ -0,0 +1,13 @@
1
+ import { ColorPickerLanguage } from '../index';
2
+
3
+ const sl: ColorPickerLanguage = {
4
+ hue: "Odtenek",
5
+ saturation: "Nasičenost in svetlost",
6
+ lightness: "Svetlost",
7
+ alpha: "Prosojnost",
8
+ presets: "Prednastavljene barve",
9
+ eyeDropper: "Izberi barvo z zaslona",
10
+ systemPicker: "Sistemski izbirnik barv"
11
+ };
12
+
13
+ export default sl;