@rubin-epo/epo-widget-lib 2.0.8 → 2.0.10
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/dist/widgets/OrbitalSim/Context/OrbitalSimContext.types.d.ts +1 -1
- package/dist/widgets/OrbitalSim/Context/index.cjs +1 -1
- package/dist/widgets/OrbitalSim/Context/index.js +41 -45
- package/dist/widgets/OrbitalSim/Orbitals/OrbitalDetails.cjs +1 -1
- package/dist/widgets/OrbitalSim/Orbitals/OrbitalDetails.js +16 -16
- package/dist/widgets/SortableTable/SortableTable.cjs +1 -1
- package/dist/widgets/SortableTable/SortableTable.d.ts +1 -1
- package/dist/widgets/SortableTable/SortableTable.js +32 -24
- package/dist/widgets/SortableTable/styles.cjs +11 -2
- package/dist/widgets/SortableTable/styles.d.ts +1 -0
- package/dist/widgets/SortableTable/styles.js +13 -3
- package/dist/widgets/SourceSelector/MovingSourceSelector.cjs +1 -1
- package/dist/widgets/SourceSelector/MovingSourceSelector.js +44 -34
- package/package.json +2 -2
|
@@ -17,8 +17,8 @@ export type OrbitalSimContextValues = {
|
|
|
17
17
|
showTimeControls?: boolean;
|
|
18
18
|
setOrbits: React.Dispatch<React.SetStateAction<Orbits>>;
|
|
19
19
|
observations: Observation[];
|
|
20
|
-
setObservations: React.Dispatch<React.SetStateAction<Observation[]>>;
|
|
21
20
|
updateActiveObservation: (activeId: string) => void;
|
|
21
|
+
selectedAnswer: string | null;
|
|
22
22
|
swappableOrbits: boolean;
|
|
23
23
|
};
|
|
24
24
|
export type Observation = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react/jsx-runtime"),t=require("react"),c=t.createContext(null);function g(){const s=t.useContext(c);if(!s)throw new Error("OrbitalSim components cannot be rendered outside the OrbitalSimContext.Provider component.");return s}function j({children:s,orbitData:r,showDetailsTable:f=!1,allowOrbitRotation:b=!1,showTimeControls:v=!1,selectedAnswer:i,updateSelectedAnswer:x,swappableOrbits:m=!1}){const[l,u]=t.useState({neos:null,activeNeo:null,observations:[],paused:!1,pov:null,defaultZoom:null,potentialOrbits:!1,noDetails:!1,detailsRows:null,refObjs:null,noControls:!1}),[e,S]=t.useState(()=>l.observations??[]);t.useEffect(()=>{u(r),S(r.observations)},[r]);const d=t.useMemo(()=>e&&e.length>0?e.map(n=>({...n,isActive:n.label===i})):[],[i,e]),O=n=>{if(e&&e.length>0){let C=e.map(o=>o.id==n?{...o,isActive:!0}:{...o,isActive:!1});S(C);const a=e.find(o=>o.id===n);x((a==null?void 0:a.label)||null)}},p=t.useMemo(()=>({orbits:l,showDetailsTable:f,allowOrbitRotation:b,showTimeControls:v,setOrbits:u,observations:d,updateActiveObservation:O,selectedAnswer:i,swappableOrbits:m}),[l,f,b,v,u,d,O,i,m]);return P.jsx(c.Provider,{value:p,children:s})}exports.OrbitalSimContext=c;exports.OrbitalSimProvider=j;exports.useOrbitalSimContext=g;
|
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as P } from "react/jsx-runtime";
|
|
3
|
-
import { createContext as g, useState as p, useEffect as
|
|
4
|
-
const
|
|
5
|
-
function
|
|
6
|
-
const o =
|
|
3
|
+
import { createContext as g, useState as p, useEffect as j, useMemo as x, useContext as A } from "react";
|
|
4
|
+
const O = g(null);
|
|
5
|
+
function N() {
|
|
6
|
+
const o = A(O);
|
|
7
7
|
if (!o)
|
|
8
8
|
throw new Error(
|
|
9
9
|
"OrbitalSim components cannot be rendered outside the OrbitalSimContext.Provider component."
|
|
10
10
|
);
|
|
11
11
|
return o;
|
|
12
12
|
}
|
|
13
|
-
function
|
|
13
|
+
function W({
|
|
14
14
|
children: o,
|
|
15
|
-
orbitData:
|
|
16
|
-
showDetailsTable:
|
|
17
|
-
allowOrbitRotation:
|
|
18
|
-
showTimeControls:
|
|
15
|
+
orbitData: i,
|
|
16
|
+
showDetailsTable: a = !1,
|
|
17
|
+
allowOrbitRotation: f = !1,
|
|
18
|
+
showTimeControls: c = !1,
|
|
19
19
|
selectedAnswer: s,
|
|
20
20
|
updateSelectedAnswer: S,
|
|
21
|
-
swappableOrbits:
|
|
21
|
+
swappableOrbits: v = !1
|
|
22
22
|
}) {
|
|
23
|
-
const [
|
|
23
|
+
const [l, r] = p({
|
|
24
24
|
neos: null,
|
|
25
25
|
activeNeo: null,
|
|
26
26
|
observations: [],
|
|
@@ -32,51 +32,47 @@ function N({
|
|
|
32
32
|
detailsRows: null,
|
|
33
33
|
refObjs: null,
|
|
34
34
|
noControls: !1
|
|
35
|
-
}), [t,
|
|
36
|
-
() =>
|
|
35
|
+
}), [t, b] = p(
|
|
36
|
+
() => l.observations ?? []
|
|
37
37
|
);
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}, [
|
|
38
|
+
j(() => {
|
|
39
|
+
r(i), b(i.observations);
|
|
40
|
+
}, [i]);
|
|
41
|
+
const m = x(
|
|
42
|
+
() => t && t.length > 0 ? t.map((e) => ({ ...e, isActive: e.label === s })) : [],
|
|
43
|
+
[s, t]
|
|
44
|
+
), d = (e) => {
|
|
41
45
|
if (t && t.length > 0) {
|
|
42
|
-
let
|
|
43
|
-
|
|
46
|
+
let h = t.map((n) => n.id == e ? { ...n, isActive: !0 } : { ...n, isActive: !1 });
|
|
47
|
+
b(h);
|
|
48
|
+
const u = t.find((n) => n.id === e);
|
|
49
|
+
S((u == null ? void 0 : u.label) || null);
|
|
44
50
|
}
|
|
45
|
-
},
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
}, C = h(() => ({
|
|
54
|
-
orbits: u,
|
|
55
|
-
showDetailsTable: c,
|
|
56
|
-
allowOrbitRotation: m,
|
|
57
|
-
showTimeControls: v,
|
|
58
|
-
setOrbits: a,
|
|
59
|
-
observations: t,
|
|
60
|
-
setObservations: e,
|
|
51
|
+
}, C = x(() => ({
|
|
52
|
+
orbits: l,
|
|
53
|
+
showDetailsTable: a,
|
|
54
|
+
allowOrbitRotation: f,
|
|
55
|
+
showTimeControls: c,
|
|
56
|
+
setOrbits: r,
|
|
57
|
+
observations: m,
|
|
61
58
|
updateActiveObservation: d,
|
|
62
59
|
selectedAnswer: s,
|
|
63
|
-
swappableOrbits:
|
|
60
|
+
swappableOrbits: v
|
|
64
61
|
}), [
|
|
65
|
-
|
|
62
|
+
l,
|
|
63
|
+
a,
|
|
64
|
+
f,
|
|
66
65
|
c,
|
|
66
|
+
r,
|
|
67
67
|
m,
|
|
68
|
-
v,
|
|
69
|
-
a,
|
|
70
|
-
t,
|
|
71
|
-
e,
|
|
72
68
|
d,
|
|
73
69
|
s,
|
|
74
|
-
|
|
70
|
+
v
|
|
75
71
|
]);
|
|
76
|
-
return /* @__PURE__ */ P(
|
|
72
|
+
return /* @__PURE__ */ P(O.Provider, { value: C, children: o });
|
|
77
73
|
}
|
|
78
74
|
export {
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
75
|
+
O as OrbitalSimContext,
|
|
76
|
+
W as OrbitalSimProvider,
|
|
77
|
+
N as useOrbitalSimContext
|
|
82
78
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),n=require("react"),c=require("@rubin-epo/epo-react-lib/Button"),u=require("../Context/index.cjs"),s=require("./styles.cjs"),d=require("../styles.cjs"),a=t=>t&&t.__esModule?t:{default:t},x=a(c);function h(){const{orbits:t}=u.useOrbitalSimContext(),{detailsRows:l}=t,[i,
|
|
1
|
+
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),n=require("react"),c=require("@rubin-epo/epo-react-lib/Button"),u=require("../Context/index.cjs"),s=require("./styles.cjs"),d=require("../styles.cjs"),a=t=>t&&t.__esModule?t:{default:t},x=a(c);function h(){const{orbits:t}=u.useOrbitalSimContext(),{detailsRows:l}=t,[i,o]=n.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsx(d.GlobalStyles,{}),e.jsx(s.ButtonWrapper,{styleAs:"secondary",isInactive:!l,onClick:()=>{o(!i)},children:i?"Hide Details":"Show Details"}),e.jsx(s.SlideoutWrapper,{slideFrom:"left",isOpen:i,children:e.jsxs(s.SlideoutPanel,{children:[e.jsx("h3",{children:"Orbital Details"}),l&&l.map(r=>e.jsxs(s.SlideoutRow,{children:[e.jsx(s.SlideoutColLeft,{children:e.jsx("p",{children:r.rowTitle})}),e.jsx(s.SlideoutColRight,{children:e.jsx("p",{children:r.rowContent})})]},r.rowTitle)),e.jsx(x.default,{isBlock:!0,onClick:()=>o(!i),children:"Close"})]})})]})}exports.default=h;
|
|
@@ -1,38 +1,38 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as
|
|
2
|
+
import { jsxs as l, Fragment as s, jsx as t } from "react/jsx-runtime";
|
|
3
3
|
import { useState as c } from "react";
|
|
4
4
|
import a from "@rubin-epo/epo-react-lib/Button";
|
|
5
5
|
import { useOrbitalSimContext as d } from "../Context/index.js";
|
|
6
6
|
import { ButtonWrapper as m, SlideoutWrapper as p, SlideoutPanel as h, SlideoutRow as u, SlideoutColLeft as f, SlideoutColRight as S } from "./styles.js";
|
|
7
|
-
import { GlobalStyles as
|
|
7
|
+
import { GlobalStyles as w } from "../styles.js";
|
|
8
8
|
function v() {
|
|
9
9
|
const { orbits: n } = d(), {
|
|
10
10
|
detailsRows: i
|
|
11
|
-
} = n, [
|
|
12
|
-
return /* @__PURE__ */
|
|
13
|
-
/* @__PURE__ */
|
|
14
|
-
/* @__PURE__ */
|
|
11
|
+
} = n, [e, r] = c(!1);
|
|
12
|
+
return /* @__PURE__ */ l(s, { children: [
|
|
13
|
+
/* @__PURE__ */ t(w, {}),
|
|
14
|
+
/* @__PURE__ */ t(
|
|
15
15
|
m,
|
|
16
16
|
{
|
|
17
17
|
styleAs: "secondary",
|
|
18
18
|
isInactive: !i,
|
|
19
19
|
onClick: () => {
|
|
20
|
-
|
|
20
|
+
r(!e);
|
|
21
21
|
},
|
|
22
|
-
children:
|
|
22
|
+
children: e ? "Hide Details" : "Show Details"
|
|
23
23
|
}
|
|
24
24
|
),
|
|
25
|
-
/* @__PURE__ */
|
|
26
|
-
/* @__PURE__ */
|
|
27
|
-
i && i.map((
|
|
28
|
-
/* @__PURE__ */
|
|
29
|
-
/* @__PURE__ */
|
|
30
|
-
] })),
|
|
31
|
-
/* @__PURE__ */
|
|
25
|
+
/* @__PURE__ */ t(p, { slideFrom: "left", isOpen: e, children: /* @__PURE__ */ l(h, { children: [
|
|
26
|
+
/* @__PURE__ */ t("h3", { children: "Orbital Details" }),
|
|
27
|
+
i && i.map((o) => /* @__PURE__ */ l(u, { children: [
|
|
28
|
+
/* @__PURE__ */ t(f, { children: /* @__PURE__ */ t("p", { children: o.rowTitle }) }),
|
|
29
|
+
/* @__PURE__ */ t(S, { children: /* @__PURE__ */ t("p", { children: o.rowContent }) })
|
|
30
|
+
] }, o.rowTitle)),
|
|
31
|
+
/* @__PURE__ */ t(
|
|
32
32
|
a,
|
|
33
33
|
{
|
|
34
34
|
isBlock: !0,
|
|
35
|
-
onClick: () =>
|
|
35
|
+
onClick: () => r(!e),
|
|
36
36
|
children: "Close"
|
|
37
37
|
}
|
|
38
38
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),a=require("react"),N=require("@rubin-epo/epo-react-lib/SortButton"),h=require("./styles.cjs"),q=r=>r&&r.__esModule?r:{default:r},p=q(N),o="asc",x="desc",y="none",b=({tableData:r})=>{const[u]=a.useState(r),s=r?Object.keys(u[0]):null,[n,g]=a.useState(s?s[0]:""),[i,S]=a.useState(o);function C(t){if(n===t){S(c=>c===o?x:o);return}g(t),S(o)}const f=a.useMemo(()=>{if(u)return[...u].sort((c,w)=>{const l=c[n],d=w[n];if(typeof l=="number"&&typeof d=="number")return i===o?l-d:d-l;const m=String(l).toLowerCase(),j=String(d).toLowerCase();return i===o?m.localeCompare(j):j.localeCompare(m)})},[u,n,i]);function _(t){return n!==t?e.jsx(p.default,{sortDirection:y}):e.jsx(p.default,{sortDirection:i===o?o:x})}return e.jsx(e.Fragment,{children:r&&e.jsxs(h.Table,{children:[e.jsx("thead",{children:e.jsx("tr",{children:s&&s.map(t=>e.jsx("th",{scope:"col","aria-sort":n===t?i===o?"ascending":"descending":"none",children:e.jsxs(h.HeaderButton,{type:"button",onClick:()=>C(t),children:[t,_(t)]})},t))})}),e.jsx("tbody",{children:f&&f.map(t=>e.jsx("tr",{children:s&&s.map(c=>e.jsx("td",{children:t[c]},c))}))})]})})};b.displayName="Widgets.SortableTable";exports.default=b;
|
|
@@ -13,7 +13,7 @@ type TableDataProps<T extends Record<string, string | number | null>> = {
|
|
|
13
13
|
* @returns the sortable table
|
|
14
14
|
*/
|
|
15
15
|
declare const SortableTable: {
|
|
16
|
-
<T extends Record<string, string | number | null>>({ tableData }: TableDataProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
<T extends Record<string, string | number | null>>({ tableData, }: TableDataProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
17
17
|
displayName: string;
|
|
18
18
|
};
|
|
19
19
|
export default SortableTable;
|
|
@@ -1,41 +1,49 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as o, Fragment as
|
|
3
|
-
import { useState as u, useMemo as
|
|
4
|
-
import
|
|
5
|
-
|
|
2
|
+
import { jsx as o, Fragment as x, jsxs as h } from "react/jsx-runtime";
|
|
3
|
+
import { useState as u, useMemo as D } from "react";
|
|
4
|
+
import b from "@rubin-epo/epo-react-lib/SortButton";
|
|
5
|
+
import { Table as T, HeaderButton as y } from "./styles.js";
|
|
6
|
+
const r = "asc", g = "desc", A = "none", B = ({
|
|
6
7
|
tableData: a
|
|
7
8
|
}) => {
|
|
8
|
-
const [i] = u(a), e = a ? Object.keys(i[0]) : null, [n,
|
|
9
|
-
function
|
|
9
|
+
const [i] = u(a), e = a ? Object.keys(i[0]) : null, [n, C] = u(e ? e[0] : ""), [c, m] = u(r);
|
|
10
|
+
function w(t) {
|
|
10
11
|
if (n === t) {
|
|
11
|
-
m((s) => s === r ?
|
|
12
|
+
m((s) => s === r ? g : r);
|
|
12
13
|
return;
|
|
13
14
|
}
|
|
14
|
-
|
|
15
|
+
C(t), m(r);
|
|
15
16
|
}
|
|
16
|
-
const p =
|
|
17
|
+
const p = D(() => {
|
|
17
18
|
if (i)
|
|
18
|
-
return [...i].sort((s,
|
|
19
|
-
const
|
|
20
|
-
if (typeof
|
|
21
|
-
return c === r ?
|
|
22
|
-
const f = String(
|
|
19
|
+
return [...i].sort((s, j) => {
|
|
20
|
+
const d = s[n], l = j[n];
|
|
21
|
+
if (typeof d == "number" && typeof l == "number")
|
|
22
|
+
return c === r ? d - l : l - d;
|
|
23
|
+
const f = String(d).toLowerCase(), S = String(l).toLowerCase();
|
|
23
24
|
return c === r ? f.localeCompare(S) : S.localeCompare(f);
|
|
24
25
|
});
|
|
25
26
|
}, [i, n, c]);
|
|
26
|
-
function
|
|
27
|
-
return n !== t ?
|
|
27
|
+
function N(t) {
|
|
28
|
+
return n !== t ? /* @__PURE__ */ o(b, { sortDirection: A }) : /* @__PURE__ */ o(b, { sortDirection: c === r ? r : g });
|
|
28
29
|
}
|
|
29
|
-
return /* @__PURE__ */ o(
|
|
30
|
-
/* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o("tr", { children: e && e.map((t) => /* @__PURE__ */ o(
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
30
|
+
return /* @__PURE__ */ o(x, { children: a && /* @__PURE__ */ h(T, { children: [
|
|
31
|
+
/* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o("tr", { children: e && e.map((t) => /* @__PURE__ */ o(
|
|
32
|
+
"th",
|
|
33
|
+
{
|
|
34
|
+
scope: "col",
|
|
35
|
+
"aria-sort": n === t ? c === r ? "ascending" : "descending" : "none",
|
|
36
|
+
children: /* @__PURE__ */ h(y, { type: "button", onClick: () => w(t), children: [
|
|
37
|
+
t,
|
|
38
|
+
N(t)
|
|
39
|
+
] })
|
|
40
|
+
},
|
|
41
|
+
t
|
|
42
|
+
)) }) }),
|
|
35
43
|
/* @__PURE__ */ o("tbody", { children: p && p.map((t) => /* @__PURE__ */ o("tr", { children: e && e.map((s) => /* @__PURE__ */ o("td", { children: t[s] }, s)) })) })
|
|
36
44
|
] }) });
|
|
37
45
|
};
|
|
38
|
-
|
|
46
|
+
B.displayName = "Widgets.SortableTable";
|
|
39
47
|
export {
|
|
40
|
-
|
|
48
|
+
B as default
|
|
41
49
|
};
|
|
@@ -1,8 +1,17 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),d=e=>e&&e.__esModule?e:{default:e},t=d(o),l=t.default.table`
|
|
2
2
|
border: 1px solid #000000;
|
|
3
|
+
font-size: medium;
|
|
3
4
|
text-align: center;
|
|
4
5
|
border-spacing: 0px;
|
|
5
6
|
& > th, td, thead, thead > tr > th{
|
|
6
7
|
border: 1px solid #000000;
|
|
7
8
|
}
|
|
8
|
-
|
|
9
|
+
|
|
10
|
+
& > thead {
|
|
11
|
+
background-color: #009FA1;
|
|
12
|
+
font-size: large;
|
|
13
|
+
}
|
|
14
|
+
`,a=t.default.button`
|
|
15
|
+
display: flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
`;exports.HeaderButton=a;exports.Table=l;
|
|
@@ -1 +1,2 @@
|
|
|
1
1
|
export declare const Table: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, never>> & string;
|
|
2
|
+
export declare const HeaderButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
|
|
@@ -1,13 +1,23 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
const
|
|
2
|
+
import e from "styled-components";
|
|
3
|
+
const o = e.table`
|
|
4
4
|
border: 1px solid #000000;
|
|
5
|
+
font-size: medium;
|
|
5
6
|
text-align: center;
|
|
6
7
|
border-spacing: 0px;
|
|
7
8
|
& > th, td, thead, thead > tr > th{
|
|
8
9
|
border: 1px solid #000000;
|
|
9
10
|
}
|
|
11
|
+
|
|
12
|
+
& > thead {
|
|
13
|
+
background-color: #009FA1;
|
|
14
|
+
font-size: large;
|
|
15
|
+
}
|
|
16
|
+
`, r = e.button`
|
|
17
|
+
display: flex;
|
|
18
|
+
align-items: center;
|
|
10
19
|
`;
|
|
11
20
|
export {
|
|
12
|
-
r as
|
|
21
|
+
r as HeaderButton,
|
|
22
|
+
o as Table
|
|
13
23
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),
|
|
1
|
+
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),l=require("react"),G=require("react-i18next"),J=require("../../layout/AspectRatio/index.cjs"),K=require("../../atomic/Loader/index.cjs"),Q=require("@rubin-epo/epo-react-lib/IconComposer"),U=require("./MovingSourceMap/index.cjs"),k=require("./utils.cjs"),Z=require("./styles.cjs"),O=require("../../hooks/useInterval.cjs"),ee=require("./Message/Message.cjs"),te=require("../../atomic/ElapsedTime/ElapsedTime.cjs"),se=e=>e&&e.__esModule?e:{default:e},ne=se(Q),oe=(e,n)=>{var d;const t={day:0,hour:0},s=e[n];if(!s)return t;const c=(s==null?void 0:s.date)-((d=e[0])==null?void 0:d.date);return c?{day:Math.round(c)||0,hour:Math.round(24/c%24)||0}:t},re=(e,n,t)=>Math.pow(e.x-n.x,2)+Math.pow(e.y-n.y,2)<=Math.pow(t,2),ce=(e,n,t)=>t?e[n]?[e[n].image]:[]:e.map(({image:s})=>s),y=({width:e=600,height:n=600,selectedSource:t=[],alerts:s=[],activeAlertIndex:c=0,alertChangeCallback:d,selectionCallback:q,blinkConfig:_,isDisplayOnly:i=!1,isLoading:P,className:w,movingSources:u=[]})=>{const[f,b]=l.useState(0),[B,F]=l.useState(!0),[p,L]=l.useState(!i),[R,I]=l.useState(),[T,m]=l.useState(!1),{t:S}=G.useTranslation(),j=!B&&!P,V=(r,g,h)=>{if(u)for(let a of u){const x=a.sources[f];if(re(r,{x:k.toDecimalPercent(x.x)*g,y:k.toDecimalPercent(x.y)*h},k.getRadius(a.type,a.radius)*g))return a.id}},v=()=>{I(S("source_selector.messages.failure")),m(!0)},N=()=>{L(r=>!r)},W=()=>{I(o.jsxs(o.Fragment,{children:[o.jsx(ne.default,{icon:"checkmark"}),S("source_selector.messages.success")]})),m(!0)},$=({clientX:r,clientY:g,target:h})=>{if(!j||i)return;const{tagName:a,clientWidth:x,clientHeight:C}=h;if(a.toLowerCase()!=="img")return;const{left:Y,top:A}=h.getBoundingClientRect(),M=V({x:r-Y,y:C-g+A},x,C);if(M){if(t.includes(M))return;q&&q(t.concat(M)),W()}else v()},z=()=>{m(!1)},{day:D,hour:E}=oe(s,c),H=ce(s,c,i),X=()=>{p&&(f>u[0].sources.length-2?b(0):b(r=>r+1))};return O.default(X,500),o.jsxs(J.default,{ratio:1,className:w,children:[!i&&o.jsx(ee.default,{onMessageChangeCallback:z,isVisible:T,children:R}),u&&o.jsx(Z.BackgroundBlinker,{images:H,activeIndex:f,blinkCallback:d,loadedCallback:()=>F(!1),onClickCallback:$,extraControls:s.length>0&&!i&&o.jsx(te.default,{day:D,hour:E}),interval:400,pauseCallback:N,..._,children:o.jsx(U.default,{width:e,height:n,isPlaying:p,currentIndex:f,movingSources:u,selectedSource:t})}),!j&&o.jsx(K.default,{})]})};y.displayName="Widgets.MovingSourceSelector";exports.default=y;
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as B, jsx as a, Fragment as
|
|
3
|
-
import { useState as
|
|
4
|
-
import { useTranslation as
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import { getRadius as
|
|
2
|
+
import { jsxs as B, jsx as a, Fragment as J } from "react/jsx-runtime";
|
|
3
|
+
import { useState as u } from "react";
|
|
4
|
+
import { useTranslation as K } from "react-i18next";
|
|
5
|
+
import Q from "../../layout/AspectRatio/index.js";
|
|
6
|
+
import U from "../../atomic/Loader/index.js";
|
|
7
|
+
import Z from "@rubin-epo/epo-react-lib/IconComposer";
|
|
8
|
+
import $ from "./MovingSourceMap/index.js";
|
|
9
|
+
import { getRadius as D, toDecimalPercent as L } from "./utils.js";
|
|
10
10
|
import { BackgroundBlinker as O } from "./styles.js";
|
|
11
11
|
import ee from "../../hooks/useInterval.js";
|
|
12
12
|
import te from "./Message/Message.js";
|
|
13
13
|
import oe from "../../atomic/ElapsedTime/ElapsedTime.js";
|
|
14
14
|
const ne = (e, n) => {
|
|
15
|
-
var
|
|
15
|
+
var d;
|
|
16
16
|
const t = { day: 0, hour: 0 }, o = e[n];
|
|
17
17
|
if (!o) return t;
|
|
18
|
-
const r = (o == null ? void 0 : o.date) - ((
|
|
18
|
+
const r = (o == null ? void 0 : o.date) - ((d = e[0]) == null ? void 0 : d.date);
|
|
19
19
|
return r ? {
|
|
20
20
|
day: Math.round(r) || 0,
|
|
21
21
|
hour: Math.round(24 / r % 24) || 0
|
|
@@ -26,17 +26,17 @@ const ne = (e, n) => {
|
|
|
26
26
|
selectedSource: t = [],
|
|
27
27
|
alerts: o = [],
|
|
28
28
|
activeAlertIndex: r = 0,
|
|
29
|
-
alertChangeCallback:
|
|
29
|
+
alertChangeCallback: d,
|
|
30
30
|
selectionCallback: M,
|
|
31
31
|
blinkConfig: P,
|
|
32
|
-
isDisplayOnly:
|
|
32
|
+
isDisplayOnly: c = !1,
|
|
33
33
|
isLoading: w,
|
|
34
34
|
className: F,
|
|
35
|
-
movingSources:
|
|
35
|
+
movingSources: l = []
|
|
36
36
|
}) => {
|
|
37
|
-
const [f, x] =
|
|
38
|
-
if (
|
|
39
|
-
for (let i of
|
|
37
|
+
const [f, x] = u(0), [R, V] = u(!0), [b, j] = u(!c), [N, I] = u(), [T, p] = u(!1), { t: y } = K(), S = !R && !w, W = (s, m, g) => {
|
|
38
|
+
if (l)
|
|
39
|
+
for (let i of l) {
|
|
40
40
|
const h = i.sources[f];
|
|
41
41
|
if (se(
|
|
42
42
|
s,
|
|
@@ -44,19 +44,19 @@ const ne = (e, n) => {
|
|
|
44
44
|
x: L(h.x) * m,
|
|
45
45
|
y: L(h.y) * g
|
|
46
46
|
},
|
|
47
|
-
|
|
47
|
+
D(i.type, i.radius) * m
|
|
48
48
|
))
|
|
49
49
|
return i.id;
|
|
50
50
|
}
|
|
51
51
|
}, _ = () => {
|
|
52
|
-
y(
|
|
52
|
+
I(y("source_selector.messages.failure")), p(!0);
|
|
53
53
|
}, v = () => {
|
|
54
54
|
j((s) => !s);
|
|
55
55
|
}, z = () => {
|
|
56
|
-
|
|
57
|
-
/* @__PURE__ */ B(
|
|
58
|
-
/* @__PURE__ */ a(
|
|
59
|
-
|
|
56
|
+
I(
|
|
57
|
+
/* @__PURE__ */ B(J, { children: [
|
|
58
|
+
/* @__PURE__ */ a(Z, { icon: "checkmark" }),
|
|
59
|
+
y("source_selector.messages.success")
|
|
60
60
|
] })
|
|
61
61
|
), p(!0);
|
|
62
62
|
}, A = ({
|
|
@@ -64,15 +64,15 @@ const ne = (e, n) => {
|
|
|
64
64
|
clientY: m,
|
|
65
65
|
target: g
|
|
66
66
|
}) => {
|
|
67
|
-
if (!S ||
|
|
67
|
+
if (!S || c) return;
|
|
68
68
|
const {
|
|
69
69
|
tagName: i,
|
|
70
70
|
clientWidth: h,
|
|
71
71
|
clientHeight: k
|
|
72
72
|
} = g;
|
|
73
73
|
if (i.toLowerCase() !== "img") return;
|
|
74
|
-
const { left: q, top:
|
|
75
|
-
{ x: s - q, y: k - m +
|
|
74
|
+
const { left: q, top: G } = g.getBoundingClientRect(), C = W(
|
|
75
|
+
{ x: s - q, y: k - m + G },
|
|
76
76
|
h,
|
|
77
77
|
k
|
|
78
78
|
);
|
|
@@ -83,11 +83,11 @@ const ne = (e, n) => {
|
|
|
83
83
|
_();
|
|
84
84
|
}, E = () => {
|
|
85
85
|
p(!1);
|
|
86
|
-
}, { day: H, hour: X } = ne(o, r), Y = re(o, r,
|
|
86
|
+
}, { day: H, hour: X } = ne(o, r), Y = re(o, r, c);
|
|
87
87
|
return ee(() => {
|
|
88
|
-
b && (f >
|
|
89
|
-
}, 500), /* @__PURE__ */ B(
|
|
90
|
-
!
|
|
88
|
+
b && (f > l[0].sources.length - 2 ? x(0) : x((s) => s + 1));
|
|
89
|
+
}, 500), /* @__PURE__ */ B(Q, { ratio: 1, className: F, children: [
|
|
90
|
+
!c && /* @__PURE__ */ a(
|
|
91
91
|
te,
|
|
92
92
|
{
|
|
93
93
|
onMessageChangeCallback: E,
|
|
@@ -95,22 +95,32 @@ const ne = (e, n) => {
|
|
|
95
95
|
children: N
|
|
96
96
|
}
|
|
97
97
|
),
|
|
98
|
-
|
|
98
|
+
l && /* @__PURE__ */ a(
|
|
99
99
|
O,
|
|
100
100
|
{
|
|
101
101
|
images: Y,
|
|
102
102
|
activeIndex: f,
|
|
103
|
-
blinkCallback:
|
|
103
|
+
blinkCallback: d,
|
|
104
104
|
loadedCallback: () => V(!1),
|
|
105
105
|
onClickCallback: A,
|
|
106
|
-
extraControls: o.length > 0 && !
|
|
106
|
+
extraControls: o.length > 0 && !c && /* @__PURE__ */ a(oe, { day: H, hour: X }),
|
|
107
107
|
interval: 400,
|
|
108
108
|
pauseCallback: v,
|
|
109
109
|
...P,
|
|
110
|
-
children: /* @__PURE__ */ a(
|
|
110
|
+
children: /* @__PURE__ */ a(
|
|
111
|
+
$,
|
|
112
|
+
{
|
|
113
|
+
width: e,
|
|
114
|
+
height: n,
|
|
115
|
+
isPlaying: b,
|
|
116
|
+
currentIndex: f,
|
|
117
|
+
movingSources: l,
|
|
118
|
+
selectedSource: t
|
|
119
|
+
}
|
|
120
|
+
)
|
|
111
121
|
}
|
|
112
122
|
),
|
|
113
|
-
!S && /* @__PURE__ */ a(
|
|
123
|
+
!S && /* @__PURE__ */ a(U, {})
|
|
114
124
|
] });
|
|
115
125
|
};
|
|
116
126
|
ie.displayName = "Widgets.MovingSourceSelector";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rubin-epo/epo-widget-lib",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.10",
|
|
4
4
|
"description": "Rubin Observatory Education & Public Outreach team React scientific and educational widgets.",
|
|
5
5
|
"author": "Rubin EPO",
|
|
6
6
|
"license": "MIT",
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
"dependencies": {
|
|
103
103
|
"@react-three/drei": "^10.7.6",
|
|
104
104
|
"@react-three/fiber": "9",
|
|
105
|
-
"@rubin-epo/epo-react-lib": "3.0.
|
|
105
|
+
"@rubin-epo/epo-react-lib": "3.0.2",
|
|
106
106
|
"@rubin-epo/epo-widget-lib": "2.0.2",
|
|
107
107
|
"context-filter-polyfill": "^0.3.6",
|
|
108
108
|
"d3-array": "^3.2.4",
|