@rubin-epo/epo-widget-lib 0.4.2 → 0.5.1-alpha.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 (91) hide show
  1. package/dist/CameraFilter.cjs +1 -1
  2. package/dist/CameraFilter.js +27 -27
  3. package/dist/ColorTool.cjs +1 -1
  4. package/dist/ColorTool.js +70 -78
  5. package/dist/SourceSelector.cjs +1 -1
  6. package/dist/SourceSelector.js +70 -69
  7. package/dist/atomic/Blinker/Blinker.cjs +1 -1
  8. package/dist/atomic/Blinker/Blinker.js +44 -50
  9. package/dist/atomic/Blinker/Image/Image.cjs +1 -1
  10. package/dist/atomic/Blinker/Image/Image.js +15 -15
  11. package/dist/atomic/Blinker/Image/styles.cjs +3 -8
  12. package/dist/atomic/Blinker/Image/styles.js +4 -9
  13. package/dist/atomic/Blinker/Images/Images.cjs +1 -1
  14. package/dist/atomic/Blinker/Images/Images.js +38 -31
  15. package/dist/atomic/Blinker/Images/styles.cjs +3 -8
  16. package/dist/atomic/Blinker/Images/styles.js +6 -11
  17. package/dist/atomic/Blinker/styles.cjs +14 -15
  18. package/dist/atomic/Blinker/styles.js +20 -20
  19. package/dist/favicon/apple-touch-icon.png +0 -0
  20. package/dist/favicon/favicon-16x16.png +0 -0
  21. package/dist/favicon/favicon-32x32.png +0 -0
  22. package/dist/{widgets/CameraFilter → types}/CameraFilter.d.ts +6 -3
  23. package/dist/{widgets/ColorTool → types}/ColorTool.d.ts +45 -37
  24. package/dist/{widgets/FilterTool → types}/FilterTool.d.ts +16 -11
  25. package/dist/{widgets/SourceSelector → types}/SourceSelector.d.ts +28 -22
  26. package/dist/widgets/ColorTool/styles.cjs +26 -33
  27. package/dist/widgets/ColorTool/styles.js +36 -41
  28. package/dist/widgets/ColorTool/utilities.cjs +1 -1
  29. package/dist/widgets/ColorTool/utilities.js +23 -27
  30. package/dist/widgets/SourceSelector/utilities.cjs +1 -1
  31. package/dist/widgets/SourceSelector/utilities.js +7 -4
  32. package/package.json +26 -10
  33. package/dist/CameraFilter.d.ts +0 -3
  34. package/dist/ColorTool.d.ts +0 -3
  35. package/dist/FilterTool.d.ts +0 -3
  36. package/dist/SourceSelector.d.ts +0 -3
  37. package/dist/atomic/Blinker/Blinker.d.ts +0 -14
  38. package/dist/atomic/Blinker/Controls/Controls.d.ts +0 -11
  39. package/dist/atomic/Blinker/Controls/styles.d.ts +0 -2
  40. package/dist/atomic/Blinker/Image/Image.d.ts +0 -9
  41. package/dist/atomic/Blinker/Image/styles.d.ts +0 -4
  42. package/dist/atomic/Blinker/Images/Images.d.ts +0 -8
  43. package/dist/atomic/Blinker/Images/styles.d.ts +0 -5
  44. package/dist/atomic/Blinker/_mocks/index.d.ts +0 -2
  45. package/dist/atomic/Blinker/index.d.ts +0 -1
  46. package/dist/atomic/Blinker/styles.d.ts +0 -8
  47. package/dist/atomic/ElapsedTime/ElapsedTime.d.ts +0 -10
  48. package/dist/atomic/ElapsedTime/index.d.ts +0 -1
  49. package/dist/atomic/ElapsedTime/styles.d.ts +0 -7
  50. package/dist/atomic/PlaybackControl/PlaybackControl.d.ts +0 -9
  51. package/dist/atomic/PlaybackControl/index.d.ts +0 -1
  52. package/dist/atomic/PlaybackControl/styles.d.ts +0 -3
  53. package/dist/hooks/useInterval.d.ts +0 -1
  54. package/dist/lib/utils.d.ts +0 -13
  55. package/dist/lib/utils.test.d.ts +0 -1
  56. package/dist/styles/svg.d.ts +0 -2
  57. package/dist/widgets/CameraFilter/CondensedFilterRanges/CondensedFilterRanges.d.ts +0 -9
  58. package/dist/widgets/CameraFilter/CondensedFilterRanges/index.d.ts +0 -1
  59. package/dist/widgets/CameraFilter/SpectrumDisplay/ColorLabels/ColorLabels.d.ts +0 -10
  60. package/dist/widgets/CameraFilter/SpectrumDisplay/ColorLabels/index.d.ts +0 -1
  61. package/dist/widgets/CameraFilter/SpectrumDisplay/SpectrumDisplay.d.ts +0 -11
  62. package/dist/widgets/CameraFilter/SpectrumDisplay/SpectrumLabels/SpectrumLabels.d.ts +0 -14
  63. package/dist/widgets/CameraFilter/SpectrumDisplay/SpectrumLabels/index.d.ts +0 -1
  64. package/dist/widgets/CameraFilter/SpectrumDisplay/index.d.ts +0 -1
  65. package/dist/widgets/CameraFilter/data.d.ts +0 -39
  66. package/dist/widgets/CameraFilter/index.d.ts +0 -1
  67. package/dist/widgets/CameraFilter/styles.d.ts +0 -23
  68. package/dist/widgets/ColorTool/FilterControls/FilterControls.d.ts +0 -14
  69. package/dist/widgets/ColorTool/FilterControls/index.d.ts +0 -1
  70. package/dist/widgets/ColorTool/FilterImage/FilterImage.d.ts +0 -11
  71. package/dist/widgets/ColorTool/FilterImage/index.d.ts +0 -1
  72. package/dist/widgets/ColorTool/ImageComposite/ImageComposite.d.ts +0 -7
  73. package/dist/widgets/ColorTool/ImageComposite/index.d.ts +0 -1
  74. package/dist/widgets/ColorTool/index.d.ts +0 -1
  75. package/dist/widgets/ColorTool/styles.d.ts +0 -23
  76. package/dist/widgets/ColorTool/utilities.d.ts +0 -21
  77. package/dist/widgets/FilterTool/index.d.ts +0 -1
  78. package/dist/widgets/FilterTool/styles.d.ts +0 -10
  79. package/dist/widgets/SourceSelector/Message/Message.d.ts +0 -10
  80. package/dist/widgets/SourceSelector/Message/index.d.ts +0 -1
  81. package/dist/widgets/SourceSelector/Message/styles.d.ts +0 -5
  82. package/dist/widgets/SourceSelector/Point/Point.d.ts +0 -15
  83. package/dist/widgets/SourceSelector/Point/index.d.ts +0 -1
  84. package/dist/widgets/SourceSelector/Point/styles.d.ts +0 -4
  85. package/dist/widgets/SourceSelector/Points/Points.d.ts +0 -13
  86. package/dist/widgets/SourceSelector/Points/index.d.ts +0 -1
  87. package/dist/widgets/SourceSelector/index.d.ts +0 -1
  88. package/dist/widgets/SourceSelector/mocks/index.d.ts +0 -7
  89. package/dist/widgets/SourceSelector/styles.d.ts +0 -12
  90. package/dist/widgets/SourceSelector/utilities.d.ts +0 -1
  91. package/dist/widgets/SourceSelector/utilities.test.d.ts +0 -1
@@ -1,27 +1,20 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),r=require("@rubin-epo/epo-react-lib/Button"),l=require("@rubin-epo/epo-react-lib/HorizontalSlider"),d=require("./FilterImage/FilterImage.cjs"),o=e=>e&&e.__esModule?e:{default:e},t=o(i),a=o(r),s=o(l),c=t.default.section`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),n=require("@rubin-epo/epo-react-lib/Button"),r=require("@rubin-epo/epo-react-lib/HorizontalSlider"),l=require("@rubin-epo/epo-react-lib/styles"),d=require("./FilterImage/FilterImage.cjs"),i=e=>e&&e.__esModule?e:{default:e},t=i(o),a=i(n),s=i(r),c=t.default.section`
2
+ container: colorTool / inline-size;
3
+ `,u=l.token("BREAK_LARGE_TABLET_MIN"),g=t.default.div`
4
+ --widget-areas: "title" "subtitle" "image" "caption" "controls" "reset";
5
+ --controls-row: "controls image";
2
6
  display: grid;
3
7
  gap: var(--PADDING_SMALL, 20px);
8
+ grid-template-areas: var(--widget-areas);
4
9
 
5
- ${({$isCondensed:e,$hideControls:n})=>e?i.css`
6
- grid-template-areas:
7
- "title"
8
- "subtitle"
9
- "image"
10
- "caption"
11
- "controls"
12
- "reset";
13
- `:i.css`
14
- grid-template-areas:
15
- "title title"
16
- "subtitle subtitle"
17
- ${n?"'image image'":"'controls image'"}
18
- "reset reset"
19
- "caption caption";
20
- `}
10
+ @container colorTool (min-width: ${u}) {
11
+ --widget-areas: "title title" "subtitle subtitle" var(--controls-row)
12
+ "reset reset" "caption caption";
13
+ }
21
14
  `;t.default.h2`
22
15
  grid-area: title;
23
16
  margin: 0;
24
- `;const u=t.default.dl`
17
+ `;const f=t.default.dl`
25
18
  grid-area: subtitle;
26
19
  margin: 0;
27
20
  font-size: 18px;
@@ -46,22 +39,22 @@
46
39
  white-space: pre;
47
40
  }
48
41
  }
49
- `,g=t.default.div`
42
+ `,p=t.default.div`
50
43
  display: grid;
51
44
  grid-template-columns: max-content minmax(100px, 1fr) minmax(100px, 2fr);
52
45
  grid-auto-rows: max-content;
53
46
  grid-area: controls;
54
47
  gap: 10px;
55
48
  align-items: center;
56
- `,f=t.default(s.default)`
49
+ `,m=t.default(s.default)`
57
50
  padding: 0;
58
51
  width: 100%;
59
- `,p=t.default.div`
52
+ `,b=t.default.div`
60
53
  position: relative;
61
54
  aspect-ratio: 1 / 1;
62
55
  grid-area: image;
63
56
  background-color: rgba(0, 0, 0, 0.1);
64
- `,m=t.default.img`
57
+ `,h=t.default.img`
65
58
  position: absolute;
66
59
  top: 0;
67
60
  right: 0;
@@ -70,7 +63,7 @@
70
63
  display: ${({$filtersActive:e})=>e?"block":"none"};
71
64
  width: 100%;
72
65
  height: 100%;
73
- `,b=t.default(d.default)`
66
+ `,x=t.default(d.default)`
74
67
  user-select: none;
75
68
  position: absolute;
76
69
  top: 0;
@@ -81,27 +74,27 @@
81
74
  height: 100%;
82
75
  mix-blend-mode: screen;
83
76
 
84
- ${({active:e})=>e?i.css`
77
+ ${({active:e})=>e?o.css`
85
78
  visibility: visible;
86
79
  opacity: 1;
87
- `:i.css`
80
+ `:o.css`
88
81
  visibility: hidden;
89
82
  opacity: 0;
90
83
  `}
91
- `,h=t.default.div`
84
+ `,v=t.default.div`
92
85
  grid-column: span 3;
93
- `,x=t.default.div`
86
+ `,w=t.default.div`
94
87
  font-weight: var(--FONT_WEIGHT_BOLD, 600);
95
- `,v=t.default.footer`
88
+ `,_=t.default.footer`
96
89
  grid-area: caption;
97
- `,_=t.default(a.default)`
90
+ `,y=t.default(a.default)`
98
91
  grid-area: reset;
99
92
  text-align: left;
100
93
 
101
94
  span {
102
95
  text-align: left;
103
96
  }
104
- `,y=t.default(a.default)`
97
+ `,T=t.default(a.default)`
105
98
  border-radius: 50%;
106
99
  font-weight: var(--FONT_WEIGHT_MEDIUM, 500);
107
100
  font-size: 22px;
@@ -111,13 +104,13 @@
111
104
  height: 38px;
112
105
  padding: 0;
113
106
 
114
- ${({$active:e})=>e?i.css`
107
+ ${({$active:e})=>e?o.css`
115
108
  background-color: var(--turquoise85, #12726c);
116
109
  &:not(:disabled):not([aria-disabled="true"]):hover {
117
110
  outline: 1px solid var(--white, #fff);
118
111
  outline-offset: -3px;
119
112
  }
120
- `:i.css`
113
+ `:o.css`
121
114
  background-color: #f7f7f7;
122
115
  border-color: #6c6e6e;
123
116
  color: #6c6e6e !important;
@@ -126,4 +119,4 @@
126
119
  outline-offset: -2px;
127
120
  }
128
121
  `}
129
- `;exports.BackgroundImage=m;exports.Caption=v;exports.ControlsContainer=g;exports.FilterToggleButton=y;exports.FilteredImage=b;exports.ImageContainer=p;exports.ResetButton=_;exports.SelectionContainer=h;exports.Slider=f;exports.Subtitle=u;exports.ToolsHeader=x;exports.WidgetContainer=c;
122
+ `;exports.BackgroundImage=h;exports.Caption=_;exports.ControlsContainer=p;exports.FilterToggleButton=T;exports.FilteredImage=x;exports.ImageContainer=b;exports.ResetButton=y;exports.SelectionContainer=v;exports.Slider=m;exports.Subtitle=f;exports.ToolsHeader=w;exports.WidgetContainer=c;exports.WidgetLayout=g;
@@ -1,33 +1,27 @@
1
1
  import t, { css as i } from "styled-components";
2
2
  import o from "@rubin-epo/epo-react-lib/Button";
3
- import a from "@rubin-epo/epo-react-lib/HorizontalSlider";
3
+ import r from "@rubin-epo/epo-react-lib/HorizontalSlider";
4
+ import { token as a } from "@rubin-epo/epo-react-lib/styles";
4
5
  import n from "./FilterImage/FilterImage.js";
5
- const g = t.section`
6
+ const m = t.section`
7
+ container: colorTool / inline-size;
8
+ `, l = a("BREAK_LARGE_TABLET_MIN"), f = t.div`
9
+ --widget-areas: "title" "subtitle" "image" "caption" "controls" "reset";
10
+ --controls-row: "controls image";
6
11
  display: grid;
7
12
  gap: var(--PADDING_SMALL, 20px);
13
+ grid-template-areas: var(--widget-areas);
8
14
 
9
- ${({ $isCondensed: e, $hideControls: r }) => e ? i`
10
- grid-template-areas:
11
- "title"
12
- "subtitle"
13
- "image"
14
- "caption"
15
- "controls"
16
- "reset";
17
- ` : i`
18
- grid-template-areas:
19
- "title title"
20
- "subtitle subtitle"
21
- ${r ? "'image image'" : "'controls image'"}
22
- "reset reset"
23
- "caption caption";
24
- `}
15
+ @container colorTool (min-width: ${l}) {
16
+ --widget-areas: "title title" "subtitle subtitle" var(--controls-row)
17
+ "reset reset" "caption caption";
18
+ }
25
19
  `;
26
20
  t.h2`
27
21
  grid-area: title;
28
22
  margin: 0;
29
23
  `;
30
- const p = t.dl`
24
+ const u = t.dl`
31
25
  grid-area: subtitle;
32
26
  margin: 0;
33
27
  font-size: 18px;
@@ -52,22 +46,22 @@ const p = t.dl`
52
46
  white-space: pre;
53
47
  }
54
48
  }
55
- `, m = t.div`
49
+ `, b = t.div`
56
50
  display: grid;
57
51
  grid-template-columns: max-content minmax(100px, 1fr) minmax(100px, 2fr);
58
52
  grid-auto-rows: max-content;
59
53
  grid-area: controls;
60
54
  gap: 10px;
61
55
  align-items: center;
62
- `, f = t(a)`
56
+ `, h = t(r)`
63
57
  padding: 0;
64
58
  width: 100%;
65
- `, u = t.div`
59
+ `, x = t.div`
66
60
  position: relative;
67
61
  aspect-ratio: 1 / 1;
68
62
  grid-area: image;
69
63
  background-color: rgba(0, 0, 0, 0.1);
70
- `, b = t.img`
64
+ `, v = t.img`
71
65
  position: absolute;
72
66
  top: 0;
73
67
  right: 0;
@@ -76,7 +70,7 @@ const p = t.dl`
76
70
  display: ${({ $filtersActive: e }) => e ? "block" : "none"};
77
71
  width: 100%;
78
72
  height: 100%;
79
- `, h = t(n)`
73
+ `, w = t(n)`
80
74
  user-select: none;
81
75
  position: absolute;
82
76
  top: 0;
@@ -94,20 +88,20 @@ const p = t.dl`
94
88
  visibility: hidden;
95
89
  opacity: 0;
96
90
  `}
97
- `, x = t.div`
91
+ `, y = t.div`
98
92
  grid-column: span 3;
99
- `, v = t.div`
93
+ `, T = t.div`
100
94
  font-weight: var(--FONT_WEIGHT_BOLD, 600);
101
- `, w = t.footer`
95
+ `, I = t.footer`
102
96
  grid-area: caption;
103
- `, y = t(o)`
97
+ `, _ = t(o)`
104
98
  grid-area: reset;
105
99
  text-align: left;
106
100
 
107
101
  span {
108
102
  text-align: left;
109
103
  }
110
- `, I = t(o)`
104
+ `, k = t(o)`
111
105
  border-radius: 50%;
112
106
  font-weight: var(--FONT_WEIGHT_MEDIUM, 500);
113
107
  font-size: 22px;
@@ -134,16 +128,17 @@ const p = t.dl`
134
128
  `}
135
129
  `;
136
130
  export {
137
- b as BackgroundImage,
138
- w as Caption,
139
- m as ControlsContainer,
140
- I as FilterToggleButton,
141
- h as FilteredImage,
142
- u as ImageContainer,
143
- y as ResetButton,
144
- x as SelectionContainer,
145
- f as Slider,
146
- p as Subtitle,
147
- v as ToolsHeader,
148
- g as WidgetContainer
131
+ v as BackgroundImage,
132
+ I as Caption,
133
+ b as ControlsContainer,
134
+ k as FilterToggleButton,
135
+ w as FilteredImage,
136
+ x as ImageContainer,
137
+ _ as ResetButton,
138
+ y as SelectionContainer,
139
+ h as Slider,
140
+ u as Subtitle,
141
+ T as ToolsHeader,
142
+ m as WidgetContainer,
143
+ f as WidgetLayout
149
144
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("lodash/flattenDeep"),D=require("lodash/find"),v=require("lodash/isEmpty"),o=e=>e&&e.__esModule?e:{default:e},y=o(g),_=o(D),c=o(v),l=(e,t,r)=>(t-e)*(r/100)+e,i=e=>e.some(t=>t.active),F=e=>c.default(e)?!1:i(e.filters),u=e=>e.filters.map(t=>{const{value:r,defaultValue:s,defaultColor:a,min:n,max:p,color:f}=t,d=r||s||1,m=a||f;return{...t,brightness:l(n,p,d),color:m}}),b=e=>c.default(e)?e:{...e,filters:u(e)},B=(e,t)=>y.default(e.map(s=>s.objects.filter(a=>a.name===t).map(u))),V=(e,t)=>{const r=_.default(e,{objects:[{name:t}]}),{type:s=null}=r||{};return s},h=e=>e.map(t=>{const{defaultValue:r,min:s,max:a}=t,n=r||1;return{...t,active:!1,color:"",brightness:l(n,s,a),value:n}});exports.getBrightnessValue=l;exports.getCategoryName=V;exports.getDataFiltersByName=B;exports.isFilterActive=i;exports.isResetButtonActive=F;exports.prepareData=b;exports.resetFilters=h;exports.updateFilters=u;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("lodash/flattenDeep"),g=require("lodash/find"),v=require("lodash/isEmpty"),o=e=>e&&e.__esModule?e:{default:e},y=o(m),_=o(g),F=o(v),l=(e,t,s)=>(t-e)*(s/100)+e,u=e=>e.some(t=>t.active),b=e=>F.default(e)?!1:u(e.filters),c=e=>e.filters.map(t=>{const{value:s,defaultValue:r,defaultColor:a,min:n,max:i,color:d}=t,f=s||r||1,p=a||d;return{...t,brightness:l(n,i,f),color:p}}),D=(e,t)=>y.default(e.map(r=>r.objects.filter(a=>a.name===t).map(c))),B=(e,t)=>{const s=_.default(e,{objects:[{name:t}]}),{type:r=null}=s||{};return r},V=e=>e.map(t=>{const{defaultValue:s,min:r,max:a}=t,n=s||1;return{...t,active:!1,color:"",brightness:l(n,r,a),value:n}});exports.getBrightnessValue=l;exports.getCategoryName=B;exports.getDataFiltersByName=D;exports.isFilterActive=u;exports.isResetButtonActive=b;exports.resetFilters=V;exports.updateFilters=c;
@@ -1,38 +1,34 @@
1
- import f from "lodash/flattenDeep";
2
- import d from "lodash/find";
3
- import a from "lodash/isEmpty";
4
- const c = (e, t, r) => (t - e) * (r / 100) + e, g = (e) => e.some((t) => t.active), y = (e) => a(e) ? !1 : g(e.filters), l = (e) => e.filters.map((t) => {
5
- const { value: r, defaultValue: s, defaultColor: o, min: n, max: i, color: p } = t, u = r || s || 1, m = o || p;
1
+ import m from "lodash/flattenDeep";
2
+ import p from "lodash/find";
3
+ import f from "lodash/isEmpty";
4
+ const a = (t, e, r) => (e - t) * (r / 100) + t, d = (t) => t.some((e) => e.active), D = (t) => f(t) ? !1 : d(t.filters), g = (t) => t.filters.map((e) => {
5
+ const { value: r, defaultValue: s, defaultColor: o, min: n, max: c, color: l } = e, i = r || s || 1, u = o || l;
6
6
  return {
7
- ...t,
8
- brightness: c(n, i, u),
9
- color: m
7
+ ...e,
8
+ brightness: a(n, c, i),
9
+ color: u
10
10
  };
11
- }), F = (e) => a(e) ? e : {
12
- ...e,
13
- filters: l(e)
14
- }, V = (e, t) => f(
15
- e.map((s) => s.objects.filter((o) => o.name === t).map(l))
16
- ), h = (e, t) => {
17
- const r = d(e, { objects: [{ name: t }] }), { type: s = null } = r || {};
11
+ }), F = (t, e) => m(
12
+ t.map((s) => s.objects.filter((o) => o.name === e).map(g))
13
+ ), V = (t, e) => {
14
+ const r = p(t, { objects: [{ name: e }] }), { type: s = null } = r || {};
18
15
  return s;
19
- }, j = (e) => e.map((t) => {
20
- const { defaultValue: r, min: s, max: o } = t, n = r || 1;
16
+ }, h = (t) => t.map((e) => {
17
+ const { defaultValue: r, min: s, max: o } = e, n = r || 1;
21
18
  return {
22
- ...t,
19
+ ...e,
23
20
  active: !1,
24
21
  color: "",
25
- brightness: c(n, s, o),
22
+ brightness: a(n, s, o),
26
23
  value: n
27
24
  };
28
25
  });
29
26
  export {
30
- c as getBrightnessValue,
31
- h as getCategoryName,
32
- V as getDataFiltersByName,
33
- g as isFilterActive,
34
- y as isResetButtonActive,
35
- F as prepareData,
36
- j as resetFilters,
37
- l as updateFilters
27
+ a as getBrightnessValue,
28
+ V as getCategoryName,
29
+ F as getDataFiltersByName,
30
+ d as isFilterActive,
31
+ D as isResetButtonActive,
32
+ h as resetFilters,
33
+ g as updateFilters
38
34
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=(t,n)=>{const[r,a]=t,[e,c]=n;return i=>i/(a-r)*(c-e)+e};exports.getLinearScale=o;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=(e,t,u=!1)=>c=>{const l=e[1]-e[0];if(l===0)return(t[0]+t[1])/2;let r=(c-e[0])/l;return u&&(r=Math.min(Math.max(r,0),1)),r*(t[1]-t[0])+t[0]};exports.getLinearScale=i;
@@ -1,7 +1,10 @@
1
- const M = (r, t) => {
2
- const [e, a] = r, [n, c] = t;
3
- return (o) => o / (a - e) * (c - n) + n;
1
+ const f = (e, t, u = !1) => (c) => {
2
+ const s = e[1] - e[0];
3
+ if (s === 0)
4
+ return (t[0] + t[1]) / 2;
5
+ let r = (c - e[0]) / s;
6
+ return u && (r = Math.min(Math.max(r, 0), 1)), r * (t[1] - t[0]) + t[0];
4
7
  };
5
8
  export {
6
- M as getLinearScale
9
+ f as getLinearScale
7
10
  };
package/package.json CHANGED
@@ -1,13 +1,14 @@
1
1
  {
2
2
  "name": "@rubin-epo/epo-widget-lib",
3
- "version": "0.4.2",
3
+ "version": "0.5.1-alpha.0",
4
4
  "description": "Rubin Observatory Education & Public Outreach team React scientific and educational widgets.",
5
5
  "author": "Rubin EPO",
6
6
  "license": "MIT",
7
7
  "homepage": "https://lsst-epo.github.io/epo-react-lib",
8
8
  "repository": {
9
9
  "type": "git",
10
- "url": "https://github.com/lsst-epo/epo-react-lib"
10
+ "url": "https://github.com/lsst-epo/epo-react-lib",
11
+ "directory": "packages/epo-widget-lib"
11
12
  },
12
13
  "supportedLocales": [
13
14
  "en",
@@ -19,10 +20,25 @@
19
20
  ],
20
21
  "sideEffects": false,
21
22
  "exports": {
22
- "./*": {
23
- "import": "./dist/*.js",
24
- "require": "./dist/*.cjs",
25
- "types": "./dist/*.d.ts"
23
+ "./CameraFilter": {
24
+ "import": "./dist/CameraFilter.js",
25
+ "require": "./dist/CameraFilter.cjs",
26
+ "types": "./dist/types/CameraFilter.d.ts"
27
+ },
28
+ "./ColorTool": {
29
+ "import": "./dist/ColorTool.js",
30
+ "require": "./dist/ColorTool.cjs",
31
+ "types": "./dist/types/ColorTool.d.ts"
32
+ },
33
+ "./FilterTool": {
34
+ "import": "./dist/FilterTool.js",
35
+ "require": "./dist/FilterTool.cjs",
36
+ "types": "./dist/types/FilterTool.d.ts"
37
+ },
38
+ "./SourceSelector": {
39
+ "import": "./dist/FilterTool.js",
40
+ "require": "./dist/FilterTool.cjs",
41
+ "types": "./dist/types/FilterTool.d.ts"
26
42
  },
27
43
  "./localeStrings": "./dist/localeStrings"
28
44
  },
@@ -38,9 +54,9 @@
38
54
  "react-i18next": "^12.2.0"
39
55
  },
40
56
  "dependencies": {
41
- "@rubin-epo/epo-react-lib": "^2.0.0-beta.6",
42
- "styled-components": "^6.0.1",
43
- "use-resize-observer": "^9.1.0",
44
- "lodash": "^4.17.21"
57
+ "@rubin-epo/epo-react-lib": "^2.0.3",
58
+ "lodash": "^4.17.21",
59
+ "styled-components": "^6.0.4",
60
+ "use-resize-observer": "^9.1.0"
45
61
  }
46
62
  }
@@ -1,3 +0,0 @@
1
- export * from './widgets/CameraFilter/CameraFilter'
2
- import _default from './widgets/CameraFilter/CameraFilter'
3
- export default _default
@@ -1,3 +0,0 @@
1
- export * from './widgets/ColorTool/ColorTool'
2
- import _default from './widgets/ColorTool/ColorTool'
3
- export default _default
@@ -1,3 +0,0 @@
1
- export * from './widgets/FilterTool/FilterTool'
2
- import _default from './widgets/FilterTool/FilterTool'
3
- export default _default
@@ -1,3 +0,0 @@
1
- export * from './widgets/SourceSelector/SourceSelector'
2
- import _default from './widgets/SourceSelector/SourceSelector'
3
- export default _default
@@ -1,14 +0,0 @@
1
- import { FunctionComponent } from "react";
2
- import { ImageShape } from "@rubin-epo/epo-react-lib";
3
- export interface BlinkerProps {
4
- images: ImageShape[];
5
- activeIndex?: number;
6
- autoplay?: boolean;
7
- loop?: boolean;
8
- interval?: number;
9
- blinkCallback?: (activeIndex: number) => void;
10
- loadedCallback?: () => void;
11
- className?: string;
12
- }
13
- declare const Blinker: FunctionComponent<BlinkerProps>;
14
- export default Blinker;
@@ -1,11 +0,0 @@
1
- import { FunctionComponent, MouseEventHandler } from "react";
2
- export interface ControlsProps {
3
- playing: boolean;
4
- handleStartStop: MouseEventHandler<HTMLButtonElement>;
5
- handleNext: MouseEventHandler<HTMLButtonElement>;
6
- handlePrevious: MouseEventHandler<HTMLButtonElement>;
7
- className?: string;
8
- isDisabled?: boolean;
9
- }
10
- declare const Controls: FunctionComponent<ControlsProps>;
11
- export default Controls;
@@ -1,2 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const ControlsContainer: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
@@ -1,9 +0,0 @@
1
- import { ImageShape } from "@rubin-epo/epo-react-lib";
2
- import { FunctionComponent } from "react";
3
- interface ImageProps {
4
- image: ImageShape;
5
- active: boolean;
6
- loadCallback: () => void;
7
- }
8
- declare const BlinkerImage: FunctionComponent<ImageProps>;
9
- export default BlinkerImage;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const BlinkerImage: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {
3
- $active: boolean;
4
- }>>;
@@ -1,8 +0,0 @@
1
- import { FunctionComponent } from "react";
2
- import { BlinkerProps } from "../Blinker";
3
- export interface ImagesProps extends Pick<BlinkerProps, "images" | "activeIndex"> {
4
- loadedCallback?: () => void;
5
- className?: string;
6
- }
7
- declare const Images: FunctionComponent<ImagesProps>;
8
- export default Images;
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const BlinkContainer: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
3
- export declare const LoadingContainer: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
4
- $isLoading: boolean;
5
- }>>;
@@ -1,2 +0,0 @@
1
- import { ImageShape } from "@rubin-epo/epo-react-lib";
2
- export declare const mockImages: ImageShape[];
@@ -1 +0,0 @@
1
- export { default } from "./Blinker";
@@ -1,8 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const BlinkerContainer: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
3
- export declare const BlinkerControls: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("./Controls/Controls").ControlsProps, {
4
- $isCondensed: boolean;
5
- }>>;
6
- export declare const BlinkerImages: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("./Images/Images").ImagesProps, {
7
- $isCondensed: boolean;
8
- }>>;
@@ -1,10 +0,0 @@
1
- import { FunctionComponent } from "react";
2
- type TimeInterval = "year" | "day" | "hour" | "minute" | "second";
3
- type TimeSteps = {
4
- [key in TimeInterval]?: number;
5
- };
6
- export interface TimeStepProps extends TimeSteps {
7
- className?: string;
8
- }
9
- declare const ElapsedTime: FunctionComponent<TimeStepProps>;
10
- export default ElapsedTime;
@@ -1 +0,0 @@
1
- export { default } from "./ElapsedTime";
@@ -1,7 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const ElapsedTimeContainer: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
3
- export declare const Header: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>>;
4
- export declare const Time: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").TimeHTMLAttributes<HTMLTimeElement>, HTMLTimeElement>, never>>;
5
- export declare const Interval: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
6
- export declare const Number: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
7
- export declare const Step: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
@@ -1,9 +0,0 @@
1
- import { FunctionComponent, HTMLProps, MouseEventHandler } from "react";
2
- import { IconKey } from "@rubin-epo/epo-react-lib";
3
- interface PlaybackControlProps extends HTMLProps<HTMLButtonElement> {
4
- icon: IconKey;
5
- label: string;
6
- handleClick: MouseEventHandler<HTMLButtonElement>;
7
- }
8
- declare const PlaybackControl: FunctionComponent<PlaybackControlProps>;
9
- export default PlaybackControl;
@@ -1 +0,0 @@
1
- export { default } from "./PlaybackControl";
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const IconContainer: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
3
- export declare const PlaybackButton: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>>;
@@ -1 +0,0 @@
1
- export default function useInterval(callback: () => void, delay: number | null): void;
@@ -1,13 +0,0 @@
1
- /** clamps the index to the bounds of an array
2
- * if the index is higher than the final index
3
- * it will clamp to 0, if it is lower it will clamp
4
- * to the final index.
5
- */
6
- export declare const getClampedArrayIndex: (index: number, lastIndex: number) => number;
7
- /** tests if a number is between two other numbers */
8
- export declare const between: (x: number, min: number, max: number) => boolean;
9
- /** gets the intersection between two array ranges
10
- * ex. [1, 5] and [3, 10] have an intersection of
11
- * [3,5]
12
- */
13
- export declare const intersection: (a?: number[], b?: number[]) => number[] | null;
@@ -1 +0,0 @@
1
- export {};
@@ -1,2 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const Container: import("styled-components").IStyledComponent<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
@@ -1,9 +0,0 @@
1
- import { FunctionComponent } from "react";
2
- import { Filter } from "../data";
3
- interface FilterRangesProps {
4
- filters: Array<Required<Filter>>;
5
- min: number;
6
- spectrumRange: number;
7
- }
8
- declare const CondensedFilterRanges: FunctionComponent<FilterRangesProps>;
9
- export default CondensedFilterRanges;
@@ -1 +0,0 @@
1
- export { default } from "./CondensedFilterRanges";
@@ -1,10 +0,0 @@
1
- import { FunctionComponent } from "react";
2
- import { VisibleColor } from "../../data";
3
- interface ColorLabelsProps {
4
- colors: VisibleColor[];
5
- activeRange: number[];
6
- isBandSelected: boolean;
7
- isCondensed: boolean;
8
- }
9
- declare const ColorLabels: FunctionComponent<ColorLabelsProps>;
10
- export default ColorLabels;
@@ -1 +0,0 @@
1
- export { default } from "./ColorLabels";
@@ -1,11 +0,0 @@
1
- import { FunctionComponent } from "react";
2
- import { Filter } from "../data";
3
- interface SpectrumDisplayProps {
4
- min: number;
5
- max: number;
6
- range: number;
7
- isCondensed: boolean;
8
- activeFilter?: Filter;
9
- }
10
- declare const SpectrumDisplay: FunctionComponent<SpectrumDisplayProps>;
11
- export default SpectrumDisplay;