@flourish/ui-styles 5.0.3 → 6.0.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.
package/RELEASE_NOTES.md CHANGED
@@ -1,3 +1,10 @@
1
+ # 6.0.0
2
+ * Switch to preferring ESM by default on recent versions of Node.js by adding an `exports` field to `package.json`.
3
+ * Run build script as part of `prepublishOnly` instead of `prepare`.
4
+
5
+ # 5.1.0
6
+ * Dropdown background is transparent and dropdown border & carat take font colour
7
+
1
8
  # 5.0.3
2
9
  * Republish version with pnpm
3
10
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flourish/ui-styles",
3
- "version": "5.0.3",
3
+ "version": "6.0.0",
4
4
  "private": false,
5
5
  "description": "Flourish module for styling UI elements",
6
6
  "main": "ui-styles.js",
@@ -9,11 +9,11 @@
9
9
  "license": "LicenseRef-LICENSE",
10
10
  "dependencies": {
11
11
  "d3-selection": "^1.4.0",
12
- "@flourish/pocket-knife": "^1.3.0"
12
+ "@flourish/pocket-knife": "^2.0.0"
13
13
  },
14
14
  "devDependencies": {
15
- "@babel/core": "^7.20.2",
16
- "@babel/preset-env": "^7.20.2",
15
+ "@babel/core": "^7.23.6",
16
+ "@babel/preset-env": "^7.23.6",
17
17
  "@flourish/eslint-plugin-flourish": "^0.7.2",
18
18
  "@rollup/plugin-babel": "^6.0.4",
19
19
  "eslint": "^8.35.0",
@@ -25,8 +25,9 @@
25
25
  "type": "git",
26
26
  "url": "git://github.com/kiln/flourish-ui-styles.git"
27
27
  },
28
+ "exports": "./src/index.js",
28
29
  "scripts": {
29
- "lint": "eslint src",
30
+ "lint": "eslint .",
30
31
  "build": "rollup -c",
31
32
  "minify": "uglifyjs -m -o ui-styles.min.js ui-styles.js"
32
33
  }
@@ -34,9 +34,19 @@ DropdownStyle.prototype._createStylesheet = function() {
34
34
  DropdownStyle.prototype.update = function() {
35
35
  this._styles.clear();
36
36
 
37
- var background_color = this._state.background || (this._layout.background_color_enabled ? this._layout.background_color || "#ffffff" : "#ffffff");
38
- var text_color = this._state.font_color || this._layout.font_color || "#333333";
39
- var border_color = hexToRgba(this._state.border_color || text_color, this._state.border_transparency);
37
+ const background_color = this._state.background || "transparent";
38
+ const user_defined_text_color = this._state.font_color || this._layout.font_color;
39
+ const text_color = user_defined_text_color || "inherit";
40
+ let border_color;
41
+ if (this._state.border_color) {
42
+ border_color = hexToRgba(this._state.border_color, this._state.border_transparency);
43
+ }
44
+ else if (user_defined_text_color) {
45
+ border_color = hexToRgba(user_defined_text_color, this._state.border_transparency);
46
+ }
47
+ else {
48
+ border_color = "currentColor";
49
+ }
40
50
 
41
51
  this._styles.select(this._selector + " .heading")
42
52
  .style("margin-bottom", "0.4em");
@@ -107,5 +117,4 @@ DropdownStyle.prototype.update = function() {
107
117
  this._stylesheet.innerHTML = this._styles.print();
108
118
  };
109
119
 
110
-
111
120
  export default DropdownStyle;
@@ -65,5 +65,4 @@ GeneralControlsStyle.prototype.update = function() {
65
65
  this._stylesheet.innerHTML = this._styles.print();
66
66
  };
67
67
 
68
-
69
68
  export default GeneralControlsStyle;
@@ -97,5 +97,4 @@ SliderStyle.prototype.update = function() {
97
97
  this._stylesheet.innerHTML = this._styles.print();
98
98
  };
99
99
 
100
-
101
100
  export default SliderStyle;
package/ui-styles.js CHANGED
@@ -138,15 +138,15 @@
138
138
  var brighter = 1 / darker;
139
139
 
140
140
  var reI = "\\s*([+-]?\\d+)\\s*",
141
- reN = "\\s*([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)\\s*",
142
- reP = "\\s*([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)%\\s*",
141
+ reN = "\\s*([+-]?(?:\\d*\\.)?\\d+(?:[eE][+-]?\\d+)?)\\s*",
142
+ reP = "\\s*([+-]?(?:\\d*\\.)?\\d+(?:[eE][+-]?\\d+)?)%\\s*",
143
143
  reHex = /^#([0-9a-f]{3,8})$/,
144
- reRgbInteger = new RegExp("^rgb\\(" + [reI, reI, reI] + "\\)$"),
145
- reRgbPercent = new RegExp("^rgb\\(" + [reP, reP, reP] + "\\)$"),
146
- reRgbaInteger = new RegExp("^rgba\\(" + [reI, reI, reI, reN] + "\\)$"),
147
- reRgbaPercent = new RegExp("^rgba\\(" + [reP, reP, reP, reN] + "\\)$"),
148
- reHslPercent = new RegExp("^hsl\\(" + [reN, reP, reP] + "\\)$"),
149
- reHslaPercent = new RegExp("^hsla\\(" + [reN, reP, reP, reN] + "\\)$");
144
+ reRgbInteger = new RegExp(`^rgb\\(${reI},${reI},${reI}\\)$`),
145
+ reRgbPercent = new RegExp(`^rgb\\(${reP},${reP},${reP}\\)$`),
146
+ reRgbaInteger = new RegExp(`^rgba\\(${reI},${reI},${reI},${reN}\\)$`),
147
+ reRgbaPercent = new RegExp(`^rgba\\(${reP},${reP},${reP},${reN}\\)$`),
148
+ reHslPercent = new RegExp(`^hsl\\(${reN},${reP},${reP}\\)$`),
149
+ reHslaPercent = new RegExp(`^hsla\\(${reN},${reP},${reP},${reN}\\)$`);
150
150
 
151
151
  var named = {
152
152
  aliceblue: 0xf0f8ff,
@@ -300,14 +300,15 @@
300
300
  };
301
301
 
302
302
  define(Color, color, {
303
- copy: function(channels) {
303
+ copy(channels) {
304
304
  return Object.assign(new this.constructor, this, channels);
305
305
  },
306
- displayable: function() {
306
+ displayable() {
307
307
  return this.rgb().displayable();
308
308
  },
309
309
  hex: color_formatHex, // Deprecated! Use color.formatHex.
310
310
  formatHex: color_formatHex,
311
+ formatHex8: color_formatHex8,
311
312
  formatHsl: color_formatHsl,
312
313
  formatRgb: color_formatRgb,
313
314
  toString: color_formatRgb
@@ -317,6 +318,10 @@
317
318
  return this.rgb().formatHex();
318
319
  }
319
320
 
321
+ function color_formatHex8() {
322
+ return this.rgb().formatHex8();
323
+ }
324
+
320
325
  function color_formatHsl() {
321
326
  return hslConvert(this).formatHsl();
322
327
  }
@@ -372,18 +377,21 @@
372
377
  }
373
378
 
374
379
  define(Rgb, rgb, extend(Color, {
375
- brighter: function(k) {
380
+ brighter(k) {
376
381
  k = k == null ? brighter : Math.pow(brighter, k);
377
382
  return new Rgb(this.r * k, this.g * k, this.b * k, this.opacity);
378
383
  },
379
- darker: function(k) {
384
+ darker(k) {
380
385
  k = k == null ? darker : Math.pow(darker, k);
381
386
  return new Rgb(this.r * k, this.g * k, this.b * k, this.opacity);
382
387
  },
383
- rgb: function() {
388
+ rgb() {
384
389
  return this;
385
390
  },
386
- displayable: function() {
391
+ clamp() {
392
+ return new Rgb(clampi(this.r), clampi(this.g), clampi(this.b), clampa(this.opacity));
393
+ },
394
+ displayable() {
387
395
  return (-0.5 <= this.r && this.r < 255.5)
388
396
  && (-0.5 <= this.g && this.g < 255.5)
389
397
  && (-0.5 <= this.b && this.b < 255.5)
@@ -391,25 +399,34 @@
391
399
  },
392
400
  hex: rgb_formatHex, // Deprecated! Use color.formatHex.
393
401
  formatHex: rgb_formatHex,
402
+ formatHex8: rgb_formatHex8,
394
403
  formatRgb: rgb_formatRgb,
395
404
  toString: rgb_formatRgb
396
405
  }));
397
406
 
398
407
  function rgb_formatHex() {
399
- return "#" + hex(this.r) + hex(this.g) + hex(this.b);
408
+ return `#${hex(this.r)}${hex(this.g)}${hex(this.b)}`;
409
+ }
410
+
411
+ function rgb_formatHex8() {
412
+ return `#${hex(this.r)}${hex(this.g)}${hex(this.b)}${hex((isNaN(this.opacity) ? 1 : this.opacity) * 255)}`;
400
413
  }
401
414
 
402
415
  function rgb_formatRgb() {
403
- var a = this.opacity; a = isNaN(a) ? 1 : Math.max(0, Math.min(1, a));
404
- return (a === 1 ? "rgb(" : "rgba(")
405
- + Math.max(0, Math.min(255, Math.round(this.r) || 0)) + ", "
406
- + Math.max(0, Math.min(255, Math.round(this.g) || 0)) + ", "
407
- + Math.max(0, Math.min(255, Math.round(this.b) || 0))
408
- + (a === 1 ? ")" : ", " + a + ")");
416
+ const a = clampa(this.opacity);
417
+ return `${a === 1 ? "rgb(" : "rgba("}${clampi(this.r)}, ${clampi(this.g)}, ${clampi(this.b)}${a === 1 ? ")" : `, ${a})`}`;
418
+ }
419
+
420
+ function clampa(opacity) {
421
+ return isNaN(opacity) ? 1 : Math.max(0, Math.min(1, opacity));
422
+ }
423
+
424
+ function clampi(value) {
425
+ return Math.max(0, Math.min(255, Math.round(value) || 0));
409
426
  }
410
427
 
411
428
  function hex(value) {
412
- value = Math.max(0, Math.min(255, Math.round(value) || 0));
429
+ value = clampi(value);
413
430
  return (value < 16 ? "0" : "") + value.toString(16);
414
431
  }
415
432
 
@@ -458,15 +475,15 @@
458
475
  }
459
476
 
460
477
  define(Hsl, hsl, extend(Color, {
461
- brighter: function(k) {
478
+ brighter(k) {
462
479
  k = k == null ? brighter : Math.pow(brighter, k);
463
480
  return new Hsl(this.h, this.s, this.l * k, this.opacity);
464
481
  },
465
- darker: function(k) {
482
+ darker(k) {
466
483
  k = k == null ? darker : Math.pow(darker, k);
467
484
  return new Hsl(this.h, this.s, this.l * k, this.opacity);
468
485
  },
469
- rgb: function() {
486
+ rgb() {
470
487
  var h = this.h % 360 + (this.h < 0) * 360,
471
488
  s = isNaN(h) || isNaN(this.s) ? 0 : this.s,
472
489
  l = this.l,
@@ -479,21 +496,29 @@
479
496
  this.opacity
480
497
  );
481
498
  },
482
- displayable: function() {
499
+ clamp() {
500
+ return new Hsl(clamph(this.h), clampt(this.s), clampt(this.l), clampa(this.opacity));
501
+ },
502
+ displayable() {
483
503
  return (0 <= this.s && this.s <= 1 || isNaN(this.s))
484
504
  && (0 <= this.l && this.l <= 1)
485
505
  && (0 <= this.opacity && this.opacity <= 1);
486
506
  },
487
- formatHsl: function() {
488
- var a = this.opacity; a = isNaN(a) ? 1 : Math.max(0, Math.min(1, a));
489
- return (a === 1 ? "hsl(" : "hsla(")
490
- + (this.h || 0) + ", "
491
- + (this.s || 0) * 100 + "%, "
492
- + (this.l || 0) * 100 + "%"
493
- + (a === 1 ? ")" : ", " + a + ")");
507
+ formatHsl() {
508
+ const a = clampa(this.opacity);
509
+ return `${a === 1 ? "hsl(" : "hsla("}${clamph(this.h)}, ${clampt(this.s) * 100}%, ${clampt(this.l) * 100}%${a === 1 ? ")" : `, ${a})`}`;
494
510
  }
495
511
  }));
496
512
 
513
+ function clamph(value) {
514
+ value = (value || 0) % 360;
515
+ return value < 0 ? value + 360 : value;
516
+ }
517
+
518
+ function clampt(value) {
519
+ return Math.max(0, Math.min(1, value || 0));
520
+ }
521
+
497
522
  /* From FvD 13.37, CSS Color Module Level 3 */
498
523
  function hsl2rgb(h, m1, m2) {
499
524
  return (h < 60 ? m1 + (m2 - m1) * h / 60
@@ -596,7 +621,7 @@
596
621
  each: proto.each
597
622
  };
598
623
 
599
- var canvas = document.createElement("canvas");
624
+ const canvas = document.createElement("canvas");
600
625
  canvas.getContext("2d");
601
626
 
602
627
  function getTextDirection() {
@@ -734,9 +759,19 @@
734
759
  DropdownStyle.prototype.update = function() {
735
760
  this._styles.clear();
736
761
 
737
- var background_color = this._state.background || (this._layout.background_color_enabled ? this._layout.background_color || "#ffffff" : "#ffffff");
738
- var text_color = this._state.font_color || this._layout.font_color || "#333333";
739
- var border_color = hexToRgba(this._state.border_color || text_color, this._state.border_transparency);
762
+ const background_color = this._state.background || "transparent";
763
+ const user_defined_text_color = this._state.font_color || this._layout.font_color;
764
+ const text_color = user_defined_text_color || "inherit";
765
+ let border_color;
766
+ if (this._state.border_color) {
767
+ border_color = hexToRgba(this._state.border_color, this._state.border_transparency);
768
+ }
769
+ else if (user_defined_text_color) {
770
+ border_color = hexToRgba(user_defined_text_color, this._state.border_transparency);
771
+ }
772
+ else {
773
+ border_color = "currentColor";
774
+ }
740
775
 
741
776
  this._styles.select(this._selector + " .heading")
742
777
  .style("margin-bottom", "0.4em");
@@ -0,0 +1 @@
1
+ (function(t,e){typeof exports==="object"&&typeof module!=="undefined"?e(exports):typeof define==="function"&&define.amd?define(["exports"],e):(t=typeof globalThis!=="undefined"?globalThis:t||self,e(t["ui-styles"]={}))})(this,function(t){"use strict";function i(){this.declarations=[];return this}i.prototype.select=function(t){if(!t)return this;var e=new s(t);e.parent=this;this.addDeclaration(e);return e};i.prototype.addDeclaration=function(t){this.declarations.push(t);return this};i.prototype.print=function(){var e="";this.declarations.forEach(function(t){e+=t.selector+" {\n";t.styles.forEach(function(t){e+="\t"+t[0]+": "+t[1]+";\n"});e+="}\n\n"});return e};i.prototype.clear=function(){this.declarations=[];return this};function s(t){this.selector=t;this.styles=[];return this}s.prototype.style=function(t,e){var s=typeof value_=="function"?e():e;if(s!==""&&s!==null&&s!==undefined)this.styles.push([t,s]);return this};s.prototype.select=function(t){return this.parent.select(this.selector+" "+t)};var l=Object.freeze({font_size:1,font_weight:"bold",height:2});function r(t,e,s){this._state=t;for(var r in l){if(this._state[r]===undefined)this._state[r]=l[r]}this._layout=s||{};this._styles=new i;this._selector=e;this._createStylesheet();return this}r.prototype._createStylesheet=function(){this._stylesheet=document.createElement("style");this._stylesheet.className="fl-ui-styles-controls";document.head.appendChild(this._stylesheet)};r.prototype.update=function(){this._styles.clear();this._styles.select(this._selector+".hidden").style("display","none");this._styles.select(this._selector).style("vertical-align","middle").style("position","relative").style("font-size",this._state.font_size+"rem").style("font-weight",this._state.font_weight);this._styles.select(".fl-controls-title").style("font-size",this._state.font_size+"rem").style("font-weight",this._state.font_weight).style("vertical-align","middle");this._styles.select(this._selector+".fl-control .button").style("height",this._state.height+"rem").style("padding","0 0.5em");this._styles.select(this._selector+"-dropdown select").style("height",this._state.height+"rem").style("font-size",this._state.font_size+"rem").style("font-weight",this._state.font_weight).style("padding",0+" "+this._state.height*.1+"rem");this._styles.select(this._selector+"-slider .slider-end-labels").style("font-size",this._state.font_size+"rem").style("font-weight",this._state.font_weight);this._styles.select(this._selector+"-slider").style("height",this._state.height+"rem");this._stylesheet.innerHTML=this._styles.print()};function e(t,e,s){t.prototype=e.prototype=s;s.constructor=t}function o(t,e){var s=Object.create(t.prototype);for(var r in e)s[r]=e[r];return s}function h(){}var n=.7;var a=1/n;var c="\\s*([+-]?\\d+)\\s*",u="\\s*([+-]?(?:\\d*\\.)?\\d+(?:[eE][+-]?\\d+)?)\\s*",d="\\s*([+-]?(?:\\d*\\.)?\\d+(?:[eE][+-]?\\d+)?)%\\s*",T=/^#([0-9a-f]{3,8})$/,L=new RegExp(`^rgb\\(${c},${c},${c}\\)$`),D=new RegExp(`^rgb\\(${d},${d},${d}\\)$`),A=new RegExp(`^rgba\\(${c},${c},${c},${u}\\)$`),B=new RegExp(`^rgba\\(${d},${d},${d},${u}\\)$`),F=new RegExp(`^hsl\\(${u},${d},${d}\\)$`),G=new RegExp(`^hsla\\(${u},${d},${d},${u}\\)$`);var y={aliceblue:15792383,antiquewhite:16444375,aqua:65535,aquamarine:8388564,azure:15794175,beige:16119260,bisque:16770244,black:0,blanchedalmond:16772045,blue:255,blueviolet:9055202,brown:10824234,burlywood:14596231,cadetblue:6266528,chartreuse:8388352,chocolate:13789470,coral:16744272,cornflowerblue:6591981,cornsilk:16775388,crimson:14423100,cyan:65535,darkblue:139,darkcyan:35723,darkgoldenrod:12092939,darkgray:11119017,darkgreen:25600,darkgrey:11119017,darkkhaki:12433259,darkmagenta:9109643,darkolivegreen:5597999,darkorange:16747520,darkorchid:10040012,darkred:9109504,darksalmon:15308410,darkseagreen:9419919,darkslateblue:4734347,darkslategray:3100495,darkslategrey:3100495,darkturquoise:52945,darkviolet:9699539,deeppink:16716947,deepskyblue:49151,dimgray:6908265,dimgrey:6908265,dodgerblue:2003199,firebrick:11674146,floralwhite:16775920,forestgreen:2263842,fuchsia:16711935,gainsboro:14474460,ghostwhite:16316671,gold:16766720,goldenrod:14329120,gray:8421504,green:32768,greenyellow:11403055,grey:8421504,honeydew:15794160,hotpink:16738740,indianred:13458524,indigo:4915330,ivory:16777200,khaki:15787660,lavender:15132410,lavenderblush:16773365,lawngreen:8190976,lemonchiffon:16775885,lightblue:11393254,lightcoral:15761536,lightcyan:14745599,lightgoldenrodyellow:16448210,lightgray:13882323,lightgreen:9498256,lightgrey:13882323,lightpink:16758465,lightsalmon:16752762,lightseagreen:2142890,lightskyblue:8900346,lightslategray:7833753,lightslategrey:7833753,lightsteelblue:11584734,lightyellow:16777184,lime:65280,limegreen:3329330,linen:16445670,magenta:16711935,maroon:8388608,mediumaquamarine:6737322,mediumblue:205,mediumorchid:12211667,mediumpurple:9662683,mediumseagreen:3978097,mediumslateblue:8087790,mediumspringgreen:64154,mediumturquoise:4772300,mediumvioletred:13047173,midnightblue:1644912,mintcream:16121850,mistyrose:16770273,moccasin:16770229,navajowhite:16768685,navy:128,oldlace:16643558,olive:8421376,olivedrab:7048739,orange:16753920,orangered:16729344,orchid:14315734,palegoldenrod:15657130,palegreen:10025880,paleturquoise:11529966,palevioletred:14381203,papayawhip:16773077,peachpuff:16767673,peru:13468991,pink:16761035,plum:14524637,powderblue:11591910,purple:8388736,rebeccapurple:6697881,red:16711680,rosybrown:12357519,royalblue:4286945,saddlebrown:9127187,salmon:16416882,sandybrown:16032864,seagreen:3050327,seashell:16774638,sienna:10506797,silver:12632256,skyblue:8900331,slateblue:6970061,slategray:7372944,slategrey:7372944,snow:16775930,springgreen:65407,steelblue:4620980,tan:13808780,teal:32896,thistle:14204888,tomato:16737095,turquoise:4251856,violet:15631086,wheat:16113331,white:16777215,whitesmoke:16119285,yellow:16776960,yellowgreen:10145074};e(h,p,{copy(t){return Object.assign(new this.constructor,this,t)},displayable(){return this.rgb().displayable()},hex:_,formatHex:_,formatHex8:I,formatHsl:P,formatRgb:f,toString:f});function _(){return this.rgb().formatHex()}function I(){return this.rgb().formatHex8()}function P(){return U(this).formatHsl()}function f(){return this.rgb().formatRgb()}function p(t){var e,s;t=(t+"").trim().toLowerCase();return(e=T.exec(t))?(s=e[1].length,e=parseInt(e[1],16),s===6?g(e):s===3?new m(e>>8&15|e>>4&240,e>>4&15|e&240,(e&15)<<4|e&15,1):s===8?b(e>>24&255,e>>16&255,e>>8&255,(e&255)/255):s===4?b(e>>12&15|e>>8&240,e>>8&15|e>>4&240,e>>4&15|e&240,((e&15)<<4|e&15)/255):null):(e=L.exec(t))?new m(e[1],e[2],e[3],1):(e=D.exec(t))?new m(e[1]*255/100,e[2]*255/100,e[3]*255/100,1):(e=A.exec(t))?b(e[1],e[2],e[3],e[4]):(e=B.exec(t))?b(e[1]*255/100,e[2]*255/100,e[3]*255/100,e[4]):(e=F.exec(t))?N(e[1],e[2]/100,e[3]/100,1):(e=G.exec(t))?N(e[1],e[2]/100,e[3]/100,e[4]):y.hasOwnProperty(t)?g(y[t]):t==="transparent"?new m(NaN,NaN,NaN,0):null}function g(t){return new m(t>>16&255,t>>8&255,t&255,1)}function b(t,e,s,r){if(r<=0)t=e=s=NaN;return new m(t,e,s,r)}function J(t){if(!(t instanceof h))t=p(t);if(!t)return new m;t=t.rgb();return new m(t.r,t.g,t.b,t.opacity)}function K(t,e,s,r){return arguments.length===1?J(t):new m(t,e,s,r==null?1:r)}function m(t,e,s,r){this.r=+t;this.g=+e;this.b=+s;this.opacity=+r}e(m,K,o(h,{brighter(t){t=t==null?a:Math.pow(a,t);return new m(this.r*t,this.g*t,this.b*t,this.opacity)},darker(t){t=t==null?n:Math.pow(n,t);return new m(this.r*t,this.g*t,this.b*t,this.opacity)},rgb(){return this},clamp(){return new m(x(this.r),x(this.g),x(this.b),k(this.opacity))},displayable(){return-.5<=this.r&&this.r<255.5&&(-.5<=this.g&&this.g<255.5)&&(-.5<=this.b&&this.b<255.5)&&(0<=this.opacity&&this.opacity<=1)},hex:w,formatHex:w,formatHex8:Q,formatRgb:v,toString:v}));function w(){return`#${$(this.r)}${$(this.g)}${$(this.b)}`}function Q(){return`#${$(this.r)}${$(this.g)}${$(this.b)}${$((isNaN(this.opacity)?1:this.opacity)*255)}`}function v(){const t=k(this.opacity);return`${t===1?"rgb(":"rgba("}${x(this.r)}, ${x(this.g)}, ${x(this.b)}${t===1?")":`, ${t})`}`}function k(t){return isNaN(t)?1:Math.max(0,Math.min(1,t))}function x(t){return Math.max(0,Math.min(255,Math.round(t)||0))}function $(t){t=x(t);return(t<16?"0":"")+t.toString(16)}function N(t,e,s,r){if(r<=0)t=e=s=NaN;else if(s<=0||s>=1)t=e=NaN;else if(e<=0)t=NaN;return new z(t,e,s,r)}function U(t){if(t instanceof z)return new z(t.h,t.s,t.l,t.opacity);if(!(t instanceof h))t=p(t);if(!t)return new z;if(t instanceof z)return t;t=t.rgb();var e=t.r/255,s=t.g/255,r=t.b/255,i=Math.min(e,s,r),l=Math.max(e,s,r),o=NaN,n=l-i,a=(l+i)/2;if(n){if(e===l)o=(s-r)/n+(s<r)*6;else if(s===l)o=(r-e)/n+2;else o=(e-s)/n+4;n/=a<.5?l+i:2-l-i;o*=60}else{n=a>0&&a<1?0:o}return new z(o,n,a,t.opacity)}function V(t,e,s,r){return arguments.length===1?U(t):new z(t,e,s,r==null?1:r)}function z(t,e,s,r){this.h=+t;this.s=+e;this.l=+s;this.opacity=+r}e(z,V,o(h,{brighter(t){t=t==null?a:Math.pow(a,t);return new z(this.h,this.s,this.l*t,this.opacity)},darker(t){t=t==null?n:Math.pow(n,t);return new z(this.h,this.s,this.l*t,this.opacity)},rgb(){var t=this.h%360+(this.h<0)*360,e=isNaN(t)||isNaN(this.s)?0:this.s,s=this.l,r=s+(s<.5?s:1-s)*e,i=2*s-r;return new m(M(t>=240?t-240:t+120,i,r),M(t,i,r),M(t<120?t+240:t-120,i,r),this.opacity)},clamp(){return new z(W(this.h),S(this.s),S(this.l),k(this.opacity))},displayable(){return(0<=this.s&&this.s<=1||isNaN(this.s))&&(0<=this.l&&this.l<=1)&&(0<=this.opacity&&this.opacity<=1)},formatHsl(){const t=k(this.opacity);return`${t===1?"hsl(":"hsla("}${W(this.h)}, ${S(this.s)*100}%, ${S(this.l)*100}%${t===1?")":`, ${t})`}`}}));function W(t){t=(t||0)%360;return t<0?t+360:t}function S(t){return Math.max(0,Math.min(1,t||0))}function M(t,e,s){return(t<60?e+(s-e)*t/60:t<180?s:t<240?e+(s-e)*(240-t)/60:e)*255}var E="$";function C(){}C.prototype=X.prototype={constructor:C,has:function(t){return E+t in this},get:function(t){return this[E+t]},set:function(t,e){this[E+t]=e;return this},remove:function(t){var e=E+t;return e in this&&delete this[e]},clear:function(){for(var t in this)if(t[0]===E)delete this[t]},keys:function(){var t=[];for(var e in this)if(e[0]===E)t.push(e.slice(1));return t},values:function(){var t=[];for(var e in this)if(e[0]===E)t.push(this[e]);return t},entries:function(){var t=[];for(var e in this)if(e[0]===E)t.push({key:e.slice(1),value:this[e]});return t},size:function(){var t=0;for(var e in this)if(e[0]===E)++t;return t},empty:function(){for(var t in this)if(t[0]===E)return false;return true},each:function(t){for(var e in this)if(e[0]===E)t(this[e],e.slice(1),this)}};function X(t,e){var s=new C;if(t instanceof C)t.each(function(t,e){s.set(e,t)});else if(Array.isArray(t)){var r=-1,i=t.length,l;if(e==null)while(++r<i)s.set(r,t[r]);else while(++r<i)s.set(e(l=t[r],r,t),l)}else if(t)for(var o in t)s.set(o,t[o]);return s}function Y(){}var H=X.prototype;Y.prototype={constructor:Y,has:H.has,add:function(t){t+="";this[E+t]=t;return this},remove:H.remove,clear:H.clear,values:H.keys,size:H.size,empty:H.empty,each:H.each};const Z=document.createElement("canvas");Z.getContext("2d");function tt(){return window.getComputedStyle(document.body).direction||"ltr"}function et(t,e){if(typeof t!="string")return false;var s=p(t);s.opacity=e!==undefined?e:1;return s}function q(t,e){var s=et(t,e);return s?s.toString():false}var st=Object.freeze({background:null,font_color:null,background_selected:"#333333",font_color_selected:"#ffffff",background_hover:null,font_color_hover:null,border_width:1,border_transparency:.25,border_color:null,border_radius:3});function R(t,e,s){this._state=t;for(var r in st){if(this._state[r]===undefined)this._state[r]=st[r]}this._layout=s||{};this._styles=new i;this._selector=e;this._createStylesheet();return this}R.prototype._createStylesheet=function(){this._stylesheet=document.createElement("style");this._stylesheet.className="fl-ui-styles-button";document.head.appendChild(this._stylesheet)};R.prototype.update=function(){this._styles.clear();var t=this._state.background||(this._layout.background_color_enabled?this._layout.background_color||"#ffffff":"#ffffff");var e=this._state.font_color||this._layout.font_color||"#333333";var s=q(this._state.border_color||e,this._state.border_transparency);var r=tt();this._styles.select(this._selector+".fl-control.hidden").style("display","none");this._styles.select(this._selector+".fl-control .button").style("overflow","hidden").style("white-space","nowrap").style("margin","0 2px 0 0 !important").style("background-color",t).style("color",e).style("border",this._state.border_width+"px solid "+s).style("border-radius",this._state.border_radius+"px");this._styles.select(this._selector+".fl-control .button:hover").style("background-color",this._state.background_hover||t).style("color",this._state.font_color_hover||e);this._styles.select(this._selector+".fl-control .button.selected").style("background-color",this._state.background_selected).style("color",this._state.font_color_selected);this._styles.select(this._selector+".grouped.fl-control .button").style("border-right","none").style("border-radius","0").style("margin","0");var i=r==="rtl";var l=i?":last-child":":first-child";var o=i?":first-child":":last-child";this._styles.select(this._selector+".grouped.fl-control .button"+l).style("border-radius",this._state.border_radius+"px 0 0 "+this._state.border_radius+"px");this._styles.select(this._selector+".grouped.fl-control .button"+o).style("border-radius","0 "+this._state.border_radius+"px "+this._state.border_radius+"px 0").style("border-right",this._state.border_width+"px solid "+s);this._styles.select(this._selector+".grouped.fl-control.fixed-width:not(.hidden)").style("width",this._state.grouped_width+"%");this._stylesheet.innerHTML=this._styles.print()};var rt=Object.freeze({background:null,font_color:null,border_style:"bottom",border_width:1,border_color:null,border_transparency:.25,border_radius:3});function j(t,e,s){this._state=t;for(var r in rt){if(this._state[r]===undefined)this._state[r]=rt[r]}this._layout=s||{};this._styles=new i;this._selector=e;this._createStylesheet();return this}j.prototype._createStylesheet=function(){this._stylesheet=document.createElement("style");this._stylesheet.className="fl-ui-styles-dropdown";document.head.appendChild(this._stylesheet)};j.prototype.update=function(){this._styles.clear();const t=this._state.background||"transparent";const e=this._state.font_color||this._layout.font_color;const s=e||"inherit";let r;if(this._state.border_color){r=q(this._state.border_color,this._state.border_transparency)}else if(e){r=q(e,this._state.border_transparency)}else{r="currentColor"}this._styles.select(this._selector+" .heading").style("margin-bottom","0.4em");this._styles.select(this._selector).style("pointer-events","all");this._styles.select(this._selector+" select").style("display","inline-block").style("cursor","pointer").style("overflow","hidden").style("white-space","nowrap").style("position","relative").style("font-family","inherit").style("background-color",t).style("color",s).style("border",this._state.border_style=="bottom"?this._state.border_width+"px solid transparent":this._state.border_width+"px solid "+r).style("border-bottom",this._state.border_style=="bottom"?this._state.border_width+"px solid "+r:null).style("border-radius",this._state.border_style=="bottom"?null:this._state.border_radius+"px");this._styles.select(this._selector+":after").style("right",this._state.border_style=="bottom"?null:this._state.border_width+5+"px").style("color",s);this._styles.select(this._selector+" .main .current").style("line-height","1em").style("height","100%").style("max-width","88%").style("display","inline-block").style("overflow","hidden").style("vertical-align","top");this._styles.select(this._selector+" .list").style("top","2px").style("min-width","100%").style("padding","2px").style("display","none").style("max-height","200px").style("overflow-y","auto").style("box-shadow","0 1px 4px rgba(0, 0, 0, .1)").style("margin-top","2px").select(".list-item").style("line-height","1em").style("cursor","pointer").style("font-weight","normal").style("color",s);this._styles.select(this._selector+".open .list").style("display","block").style("border",this._state.border_width+"px solid "+r).style("background-color",t).style("z-index","1").style("animation","dropdown-out 200ms");this._styles.select(this._selector+" .list-item:hover").style("opacity","0.6");this._styles.select(this._selector+" .list-item.selected, "+this._selector+" .list-item.selected:hover").style("opacity","1").style("cursor","default");if(this._state.border_style=="bottom"){this._styles.select(this._selector+" .main").style("padding-left",0).style("padding-right","0.1rem")}this._stylesheet.innerHTML=this._styles.print()};function it(t){return t*parseFloat(getComputedStyle(document.documentElement).fontSize)}var lt=Object.freeze({play_color:null,handle_color:null,font_color:null,track_color:null,handle_height:1,track_height:.2,margin:4.5,play_button:true});function O(t,e,s){this._state=t;for(var r in lt){if(this._state[r]===undefined)this._state[r]=lt[r]}this._layout=s||{};this._styles=new i;this._selector=e;this._createStylesheet();return this}O.prototype._createStylesheet=function(){this._stylesheet=document.createElement("style");this._stylesheet.className="fl-ui-styles-slider";document.head.appendChild(this._stylesheet)};O.prototype.update=function(){this._styles.clear();var t=this._state.track_color||"#dddddd";var e=this._state.font_color||this._layout.font_color||"currentColor";var s="currentColor";var r=this._state.handle_color||this._layout.font_color||"currentColor";var i=this._state.play_color||this._layout.font_color||"currentColor";var l=Math.round(it(this._state.handle_height));var o=it(this._state.track_height);this._styles.select(this._selector+" .fl-controls-slider").style("height",l*2+"px");this._styles.select(this._selector+" .slider-play").style("fill",i).style("width",l+"px").style("height",l+"px").style("display",this._state.play_button?null:"none");this._styles.select(this._selector+" .slider-label").style("padding-inline-start","0.3rem").style("box-sizing","content-box").style("color",e);this._styles.select(this._selector+" input[type=range]").style("-webkit-appearance","none").style("color",s).style("background-color","transparent");this._styles.select(this._selector+" input[type=range]::-webkit-slider-runnable-track").style("-webkit-appearance","none").style("background",t).style("border-radius","100px").style("height",o+"px");this._styles.select(this._selector+" input[type=range]::-webkit-slider-thumb").style("-webkit-appearance","none").style("width",l+"px").style("height",l+"px").style("border-radius","100px").style("background",r).style("margin-top",-l/2+o/2+"px");this._styles.select(this._selector+" input[type=range]::-moz-range-track").style("-webkit-appearance","none").style("background",t).style("border-radius","100px").style("height",o+"px");this._styles.select(this._selector+" input[type=range]::-moz-range-thumb").style("-webkit-appearance","none").style("width",l+"px").style("height",l+"px").style("border-radius","100px").style("border","none").style("background",r);this._stylesheet.innerHTML=this._styles.print()};function ot(t,e,s){return new r(t,e,s)}function nt(t,e,s){return new R(t,e,s)}function at(t,e,s){return new j(t,e,s)}function ht(t,e,s){return new O(t,e,s)}t.createButtonStyle=nt;t.createDropdownStyle=at;t.createGeneralControlsStyle=ot;t.createSliderStyle=ht});
package/.eslintrc.json DELETED
@@ -1,7 +0,0 @@
1
- {
2
- "extends": "../../.eslintrc.cjs",
3
- "ignorePatterns": [
4
- "ui-styles.js",
5
- "ui-styles.min.js"
6
- ]
7
- }