@rubin-epo/epo-widget-lib 1.0.3 → 1.0.5

package/dist/IsochronePlot.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),y=require("react"),Q=require("react-i18next"),U=require("use-resize-observer"),X=require("lodash/round"),F=require("@rubin-epo/epo-react-lib/styles"),Y=require("./layout/Controls/index.cjs"),Z=require("./charts/ScatterPlot/index.cjs"),ee=require("./atomic/Button/patterns/Reset.cjs");require("./atomic/PlotWrapper/index.cjs");const te=require("./charts/Readout/index.cjs"),se=require("./charts/PathFromPoints/index.cjs"),u=require("./lib/utils.cjs"),ie=require("./lib/helpers.cjs"),re=require("./widgets/IsochronePlot/Controls/index.cjs"),i=require("./widgets/IsochronePlot/defaults.cjs"),ne=require("./widgets/IsochronePlot/A11Y/CurveFit.cjs"),oe=require("./atomic/PlotWrapper/styles.cjs"),W=e=>e&&e.__esModule?e:{default:e},ae=W(U),le=W(X),ue=e=>e?e<parseFloat(F.token("BREAK_PHABLET_MIN"))?i.default.pointRadius.md:e<parseFloat(F.token("BREAK_LARGE_TABLET"))?i.default.pointRadius.sm:i.default.pointRadius.lg:i.default.pointRadius.lg,ce=({data:e,value:D,ageLibrary:I,isDisplayOnly:M=!1,isLoading:P,xAxis:k,yAxis:T,name:$,onChangeCallback:c})=>{const{ref:B,width:E}=ae.default(),{t:d,i18n:{language:x}}=Q.useTranslation(),[K,O]=y.useState(!0),h=y.useId(),n=!P&&!K,w={top:0,right:0,bottom:20,left:20},{width:f,height:g}=i.default,{ages:q={}}=I,s=Object.keys(q).sort((r,l)=>parseFloat(r)-parseFloat(l)).map(parseFloat),z=u.mergeWithDefaults(k,{...i.default.xAxis,label:d("isochrone_plot.plot.x_label")}),_=u.mergeWithDefaults(T,{...i.default.yAxis,label:d("isochrone_plot.plot.y_label")}),o={age:{min:s.length>0?Math.min(...s):0,max:s.length>0?Math.max(...s):0,step:le.default(s[1]-s[0],1)||.5,marks:s},distance:{min:0,max:_.min+1,step:.05}},b={age:s.length>0?u.middle(s):0,distance:(o.distance.max-o.distance.min)/2+o.distance.min},{age:a,distance:p}=u.mergeWithDefaults(D,b),H=ue(E),R={age:a.toLocaleString(x,{minimumFractionDigits:1}),distance:ie.parsecsToLightyears(Math.pow(10,p/5+1)).toLocaleString(x,{maximumFractionDigits:0})},S=t.jsx(oe.PlotWrapper,{ref:B,children:t.jsx(Z.default,{renderer:"canvas",title:$,onLoadedCallback:()=>O(!1),data:{label:"Star Cluster",points:e.map(r=>({...r,radius:H,stroke:"rgba(18,114,108,0.5)",fill:"rgba(18,114,108,0.25)"}))},plotChildren:({Data:r,xScale:l,yScale:m,yStart:V,yEnd:j,xStart:v,xEnd:C,yDomain:G})=>{const A=(q[a.toFixed(1)]||[]).map(({x:N,y:J})=>({x:l(N),y:m(J)}))||[],L=m(p+G[1]);return t.jsxs(t.Fragment,{children:[r,a&&t.jsx(se.default,{points:A,svgProps:{strokeWidth:2,transform:`translate(0,${L})`}}),n&&t.jsx(te.default,{viewport:{x:v,y:j,outerHeight:V-j,outerWidth:C-v,innerWidth:f,innerHeight:g},position:"center right",forIds:h,forScreenreaders:t.jsx(ne.default,{points:e,value:R,isochrone:A,offset:L,xScale:l,yScale:m,width:f,height:g}),children:d("isochrone_plot.output",{...R})})]})},width:f,height:g,xAxis:z,yAxis:_,margins:w})});return t.jsx(Y.default,{ratio:{portrait:2/3,landscape:3/2},widget:S,controls:t.jsx(re.default,{isDisabled:!n,value:{age:a,distance:p},configs:o,onChangeCallback:c}),actions:t.jsx(ee.default,{isDisabled:!n,onResetCallback:()=>{c&&c(b)}}),isLoading:!n,isDisplayOnly:M,controlsId:h})};exports.default=ce;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),L=require("react"),X=require("react-i18next"),Y=require("use-resize-observer"),Z=require("lodash/round"),D=require("@rubin-epo/epo-react-lib/styles"),ee=require("./layout/Controls/index.cjs"),te=require("./charts/ScatterPlot/index.cjs"),se=require("./atomic/Button/patterns/Reset.cjs");require("./atomic/PlotWrapper/index.cjs");const ie=require("./charts/Readout/index.cjs"),re=require("./charts/PathFromPoints/index.cjs"),u=require("./lib/utils.cjs"),ne=require("./widgets/IsochronePlot/Controls/index.cjs"),r=require("./widgets/IsochronePlot/defaults.cjs"),oe=require("./widgets/IsochronePlot/A11Y/CurveFit.cjs"),W=require("./widgets/IsochronePlot/helpers.cjs"),ae=require("./atomic/PlotWrapper/styles.cjs"),I=e=>e&&e.__esModule?e:{default:e},le=I(Y),ue=I(Z),ce=e=>e?e<parseFloat(D.token("BREAK_PHABLET_MIN"))?r.default.pointRadius.md:e<parseFloat(D.token("BREAK_LARGE_TABLET"))?r.default.pointRadius.sm:r.default.pointRadius.lg:r.default.pointRadius.lg,de=({data:e,value:P,ageLibrary:T,isDisplayOnly:k=!1,isLoading:M,xAxis:$,yAxis:z,name:B,onChangeCallback:c})=>{const{ref:E,width:K}=le.default(),{t:d,i18n:{language:h}}=X.useTranslation(),[O,H]=L.useState(!0),q=L.useId(),n=!M&&!O,S={top:0,right:0,bottom:20,left:20},{width:g,height:f}=r.default,{ages:_={}}=T,s=Object.keys(_).sort((i,l)=>parseFloat(i)-parseFloat(l)).map(parseFloat),V=u.mergeWithDefaults($,{...r.default.xAxis,label:d("isochrone_plot.plot.x_label")}),b=u.mergeWithDefaults(z,{...r.default.yAxis,label:d("isochrone_plot.plot.y_label")}),o={age:{min:s.length>0?Math.min(...s):0,max:s.length>0?Math.max(...s):0,step:ue.default(s[1]-s[0],1)||.5,marks:s},distance:{min:0,max:b.min+1,step:.05}},R={age:s.length>0?u.middle(s):0,distance:(o.distance.max-o.distance.min)/2+o.distance.min},{age:a,distance:p}=u.mergeWithDefaults(P,R),w=ce(K),m={age:i=>W.ageToGyrs(i).toLocaleString(h,{minimumFractionDigits:1,maximumFractionDigits:1}),distance:i=>W.distanceToLyrs(i).toLocaleString(h,{maximumFractionDigits:0})},j={age:m.age(a),distance:m.distance(p)},G=t.jsx(ae.PlotWrapper,{ref:E,children:t.jsx(te.default,{renderer:"canvas",title:B,onLoadedCallback:()=>H(!1),data:{label:"Star Cluster",points:e.map(i=>({...i,radius:w,stroke:"rgba(18,114,108,0.5)",fill:"rgba(18,114,108,0.25)"}))},plotChildren:({Data:i,xScale:l,yScale:x,yStart:C,yEnd:v,xStart:y,xEnd:N,yDomain:J})=>{const A=(_[a.toFixed(1)]||[]).map(({x:Q,y:U})=>({x:l(Q),y:x(U)}))||[],F=x(p+J[1]);return t.jsxs(t.Fragment,{children:[i,a&&t.jsx(re.default,{points:A,svgProps:{strokeWidth:2,transform:`translate(0,${F})`}}),n&&t.jsx(ie.default,{viewport:{x:y,y:v,outerHeight:C-v,outerWidth:N-y,innerWidth:g,innerHeight:f},position:"center right",forIds:q,forScreenreaders:t.jsx(oe.default,{points:e,value:j,isochrone:A,offset:F,xScale:l,yScale:x,width:g,height:f}),children:d("isochrone_plot.output",{...j})})]})},width:g,height:f,xAxis:V,yAxis:b,margins:S})});return t.jsx(ee.default,{ratio:{portrait:2/3,landscape:3/2},widget:G,controls:t.jsx(ne.default,{isDisabled:!n,value:{age:a,distance:p},localizers:m,configs:o,onChangeCallback:c}),actions:t.jsx(se.default,{isDisabled:!n,onResetCallback:()=>{c&&c(R)}}),isLoading:!n,isDisplayOnly:k,controlsId:q})};exports.default=de;

package/dist/IsochronePlot.js

@@ -1,161 +1,164 @@
 "use client";
-import { jsx as o, jsxs as q, Fragment as J } from "react/jsx-runtime";
-import { useState as Q, useId as U } from "react";
-import { useTranslation as X } from "react-i18next";
-import Y from "use-resize-observer";
-import Z from "lodash/round";
+import { jsx as e, jsxs as J, Fragment as Q } from "react/jsx-runtime";
+import { useState as U, useId as X } from "react";
+import { useTranslation as Y } from "react-i18next";
+import Z from "use-resize-observer";
+import tt from "lodash/round";
 import { token as W } from "@rubin-epo/epo-react-lib/styles";
-import tt from "./layout/Controls/index.js";
-import ot from "./charts/ScatterPlot/index.js";
-import et from "./atomic/Button/patterns/Reset.js";
+import ot from "./layout/Controls/index.js";
+import et from "./charts/ScatterPlot/index.js";
+import it from "./atomic/Button/patterns/Reset.js";
 import "./atomic/PlotWrapper/index.js";
 import rt from "./charts/Readout/index.js";
-import it from "./charts/PathFromPoints/index.js";
-import { mergeWithDefaults as f, middle as st } from "./lib/utils.js";
-import { parsecsToLightyears as nt } from "./lib/helpers.js";
+import st from "./charts/PathFromPoints/index.js";
+import { mergeWithDefaults as h, middle as nt } from "./lib/utils.js";
 import at from "./widgets/IsochronePlot/Controls/index.js";
-import e from "./widgets/IsochronePlot/defaults.js";
+import i from "./widgets/IsochronePlot/defaults.js";
 import mt from "./widgets/IsochronePlot/A11Y/CurveFit.js";
-import { PlotWrapper as lt } from "./atomic/PlotWrapper/styles.js";
-const pt = (r) => r ? r < parseFloat(W("BREAK_PHABLET_MIN")) ? e.pointRadius.md : r < parseFloat(W("BREAK_LARGE_TABLET")) ? e.pointRadius.sm : e.pointRadius.lg : e.pointRadius.lg, kt = ({
+import { ageToGyrs as lt, distanceToLyrs as ct } from "./widgets/IsochronePlot/helpers.js";
+import { PlotWrapper as pt } from "./atomic/PlotWrapper/styles.js";
+const dt = (r) => r ? r < parseFloat(W("BREAK_PHABLET_MIN")) ? i.pointRadius.md : r < parseFloat(W("BREAK_LARGE_TABLET")) ? i.pointRadius.sm : i.pointRadius.lg : i.pointRadius.lg, kt = ({
   data: r,
-  value: y,
-  ageLibrary: B,
+  value: B,
+  ageLibrary: D,
   isDisplayOnly: I = !1,
-  isLoading: k,
-  xAxis: D,
-  yAxis: T,
-  name: E,
+  isLoading: T,
+  xAxis: k,
+  yAxis: E,
+  name: K,
   onChangeCallback: l
 }) => {
-  const { ref: K, width: M } = Y(), {
-    t: p,
-    i18n: { language: h }
-  } = X(), [j, w] = Q(!0), x = U(), s = !k && !j, C = { top: 0, right: 0, bottom: 20, left: 20 }, { width: c, height: d } = e, { ages: b = {} } = B, t = Object.keys(b).sort(
-    (i, m) => parseFloat(i) - parseFloat(m)
-  ).map(parseFloat), H = f(D, {
-    ...e.xAxis,
-    label: p("isochrone_plot.plot.x_label")
-  }), R = f(T, {
-    ...e.yAxis,
-    label: p("isochrone_plot.plot.y_label")
+  const { ref: j, width: z } = Z(), {
+    t: c,
+    i18n: { language: x }
+  } = Y(), [C, H] = U(!0), b = X(), s = !T && !C, M = { top: 0, right: 0, bottom: 20, left: 20 }, { width: p, height: d } = i, { ages: F = {} } = D, t = Object.keys(F).sort(
+    (o, m) => parseFloat(o) - parseFloat(m)
+  ).map(parseFloat), V = h(k, {
+    ...i.xAxis,
+    label: c("isochrone_plot.plot.x_label")
+  }), R = h(E, {
+    ...i.yAxis,
+    label: c("isochrone_plot.plot.y_label")
   }), n = {
     age: {
       min: t.length > 0 ? Math.min(...t) : 0,
       max: t.length > 0 ? Math.max(...t) : 0,
-      step: Z(t[1] - t[0], 1) || 0.5,
+      step: tt(t[1] - t[0], 1) || 0.5,
       marks: t
     },
     distance: { min: 0, max: R.min + 1, step: 0.05 }
   }, A = {
-    age: t.length > 0 ? st(t) : 0,
+    age: t.length > 0 ? nt(t) : 0,
     distance: (n.distance.max - n.distance.min) / 2 + n.distance.min
-  }, { age: a, distance: u } = f(
-    y,
+  }, { age: a, distance: u } = h(
+    B,
     A
-  ), V = pt(M), F = {
-    age: a.toLocaleString(h, {
-      minimumFractionDigits: 1
+  ), w = dt(z), g = {
+    age: (o) => lt(o).toLocaleString(x, {
+      minimumFractionDigits: 1,
+      maximumFractionDigits: 1
     }),
-    distance: nt(
-      Math.pow(10, u / 5 + 1)
-    ).toLocaleString(h, {
+    distance: (o) => ct(o).toLocaleString(x, {
       maximumFractionDigits: 0
     })
-  }, z = /* @__PURE__ */ o(lt, { ref: K, children: /* @__PURE__ */ o(
-    ot,
+  }, L = {
+    age: g.age(a),
+    distance: g.distance(u)
+  }, G = /* @__PURE__ */ e(pt, { ref: j, children: /* @__PURE__ */ e(
+    et,
     {
       renderer: "canvas",
-      title: E,
-      onLoadedCallback: () => w(!1),
+      title: K,
+      onLoadedCallback: () => H(!1),
       data: {
         label: "Star Cluster",
-        points: r.map((i) => ({
-          ...i,
-          radius: V,
+        points: r.map((o) => ({
+          ...o,
+          radius: w,
           stroke: "rgba(18,114,108,0.5)",
           fill: "rgba(18,114,108,0.25)"
         }))
       },
       plotChildren: ({
-        Data: i,
+        Data: o,
         xScale: m,
-        yScale: g,
+        yScale: f,
         yStart: O,
-        yEnd: L,
-        xStart: P,
+        yEnd: P,
+        xStart: _,
         xEnd: S,
-        yDomain: G
+        yDomain: N
       }) => {
-        const _ = (b[a.toFixed(1)] || []).map(({ x: N, y: $ }) => ({ x: m(N), y: g($) })) || [], v = g(u + G[1]);
-        return /* @__PURE__ */ q(J, { children: [
-          i,
-          a && /* @__PURE__ */ o(
-            it,
+        const v = (F[a.toFixed(1)] || []).map(({ x: $, y: q }) => ({ x: m($), y: f(q) })) || [], y = f(u + N[1]);
+        return /* @__PURE__ */ J(Q, { children: [
+          o,
+          a && /* @__PURE__ */ e(
+            st,
             {
-              points: _,
+              points: v,
               svgProps: {
                 strokeWidth: 2,
-                transform: `translate(0,${v})`
+                transform: `translate(0,${y})`
               }
             }
           ),
-          s && /* @__PURE__ */ o(
+          s && /* @__PURE__ */ e(
             rt,
             {
               viewport: {
-                x: P,
-                y: L,
-                outerHeight: O - L,
-                outerWidth: S - P,
-                innerWidth: c,
+                x: _,
+                y: P,
+                outerHeight: O - P,
+                outerWidth: S - _,
+                innerWidth: p,
                 innerHeight: d
               },
               position: "center right",
-              forIds: x,
-              forScreenreaders: /* @__PURE__ */ o(
+              forIds: b,
+              forScreenreaders: /* @__PURE__ */ e(
                 mt,
                 {
                   points: r,
-                  value: F,
-                  isochrone: _,
-                  offset: v,
+                  value: L,
+                  isochrone: v,
+                  offset: y,
                   xScale: m,
-                  yScale: g,
-                  width: c,
+                  yScale: f,
+                  width: p,
                   height: d
                 }
               ),
-              children: p("isochrone_plot.output", {
-                ...F
+              children: c("isochrone_plot.output", {
+                ...L
               })
             }
           )
         ] });
       },
-      width: c,
+      width: p,
       height: d,
-      xAxis: H,
+      xAxis: V,
       yAxis: R,
-      margins: C
+      margins: M
     }
   ) });
-  return /* @__PURE__ */ o(
-    tt,
+  return /* @__PURE__ */ e(
+    ot,
     {
       ratio: { portrait: 2 / 3, landscape: 3 / 2 },
-      widget: z,
-      controls: /* @__PURE__ */ o(
+      widget: G,
+      controls: /* @__PURE__ */ e(
         at,
         {
           isDisabled: !s,
           value: { age: a, distance: u },
+          localizers: g,
           configs: n,
           onChangeCallback: l
         }
       ),
-      actions: /* @__PURE__ */ o(
-        et,
+      actions: /* @__PURE__ */ e(
+        it,
         {
           isDisabled: !s,
           onResetCallback: () => {
@@ -165,7 +168,7 @@ const pt = (r) => r ? r < parseFloat(W("BREAK_PHABLET_MIN")) ? e.pointRadius.md
       ),
       isLoading: !s,
       isDisplayOnly: I,
-      controlsId: x
+      controlsId: b
     }
   );
 };

package/dist/charts/Points/index.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),P=require("react"),E=require("./ErrorBar.cjs"),$=require("../defaults.cjs"),l=({data:r,label:a,xScale:t,yScale:s,onHoverCallback:i,onHoverOutCallback:n,onLoadedCallback:o,className:c})=>(P.useEffect(()=>{o&&o()},[]),r.length===0?null:e.jsx("g",{role:"list","aria-label":a,className:c,children:r.map((d,f)=>{const{stroke:p,fill:j,radius:m,x:g,y:x,description:h,error:u,id:q,props:M}={...$.default.point,...d};return e.jsxs("g",{role:"listitem","aria-label":h,transform:`translate(${t(g)},${s(x)})`,onMouseEnter:()=>i&&i(f),onMouseLeave:()=>n&&n(),children:[u&&e.jsx(E.default,{error:u,xScale:t,yScale:s}),e.jsx("circle",{cursor:"pointer",r:m,stroke:p,fill:j,...M})]},q)})}));l.displayName="Charts.Points";const y=l;exports.default=y;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),E=require("react"),$=require("./ErrorBar.cjs"),y=require("../defaults.cjs"),l=({data:r,label:a,xScale:t,yScale:s,onHoverCallback:i,onHoverOutCallback:n,onLoadedCallback:o,className:c})=>(E.useEffect(()=>{o&&o()},[]),r.length===0?null:e.jsx("g",{role:"list","aria-label":a,className:c,children:r.map((d,f)=>{const{stroke:p,fill:j,radius:m,x,y:g,description:h,error:u,id:q,index:M,props:P}={...y.default.point,...d};return e.jsxs("g",{role:"listitem","aria-label":h,transform:`translate(${t(x)},${s(g)})`,onMouseEnter:()=>i&&i(f),onMouseLeave:()=>n&&n(),children:[u&&e.jsx($.default,{error:u,xScale:t,yScale:s}),e.jsx("circle",{cursor:"pointer",r:m,stroke:p,fill:j,...P})]},q||M)})}));l.displayName="Charts.Points";const _=l;exports.default=_;

package/dist/charts/Points/index.js

@@ -1,34 +1,45 @@
 "use client";
-import { jsx as r, jsxs as j } from "react/jsx-runtime";
-import { useEffect as M } from "react";
-import y from "./ErrorBar.js";
-import B from "../defaults.js";
+import { jsx as r, jsxs as M } from "react/jsx-runtime";
+import { useEffect as y } from "react";
+import B from "./ErrorBar.js";
+import N from "../defaults.js";
 const m = ({
   data: t,
   label: p,
-  xScale: s,
-  yScale: e,
-  onHoverCallback: i,
+  xScale: e,
+  yScale: i,
+  onHoverCallback: s,
   onHoverOutCallback: o,
   onLoadedCallback: n,
   className: f
-}) => (M(() => {
+}) => (y(() => {
   n && n();
 }, []), t.length === 0 ? null : /* @__PURE__ */ r("g", { role: "list", "aria-label": p, className: f, children: t.map((u, a) => {
-  const { stroke: c, fill: d, radius: h, x: g, y: x, description: E, error: l, id: P, props: $ } = {
-    ...B.point,
+  const {
+    stroke: c,
+    fill: d,
+    radius: h,
+    x,
+    y: g,
+    description: E,
+    error: l,
+    id: P,
+    index: $,
+    props: j
+  } = {
+    ...N.point,
     ...u
   };
-  return /* @__PURE__ */ j(
+  return /* @__PURE__ */ M(
     "g",
     {
       role: "listitem",
       "aria-label": E,
-      transform: `translate(${s(g)},${e(x)})`,
-      onMouseEnter: () => i && i(a),
+      transform: `translate(${e(x)},${i(g)})`,
+      onMouseEnter: () => s && s(a),
       onMouseLeave: () => o && o(),
       children: [
-        l && /* @__PURE__ */ r(y, { error: l, xScale: s, yScale: e }),
+        l && /* @__PURE__ */ r(B, { error: l, xScale: e, yScale: i }),
         /* @__PURE__ */ r(
           "circle",
           {
@@ -36,16 +47,16 @@ const m = ({
             r: h,
             stroke: c,
             fill: d,
-            ...$
+            ...j
           }
         )
       ]
     },
-    P
+    P || $
   );
 }) }));
 m.displayName = "Charts.Points";
-const A = m;
+const D = m;
 export {
-  A as default
+  D as default
 };

package/dist/widgets/ColorTool/FilterControls/styles.d.ts

@@ -1238,6 +1238,11 @@ export declare const Slider: import('styled-components').IStyledComponent<"web",
     color?: string | undefined;
     darkMode?: boolean | undefined;
     isDisabled?: boolean | undefined;
+    renderLabel?: ((state: {
+        index: number;
+        value: number | readonly number[];
+        valueNow: number;
+    }) => import('react').ReactNode) | undefined;
     className?: string | undefined;
     defaultValue?: number | readonly number[] | undefined;
     value?: number | readonly number[] | undefined;

package/dist/widgets/IsochronePlot/Controls/index.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),_=require("@rubin-epo/epo-react-lib/HorizontalSlider"),b=require("../../../atomic/ControlLabel/index.cjs"),p=require("react-i18next"),x=t=>t&&t.__esModule?t:{default:t},f=x(_),a=({value:t,onChangeCallback:r,configs:s,isDisabled:u=!1})=>{const{t:n}=p.useTranslation(),i=(e,l)=>{r&&r({...t,[e]:l})},c={isDisabled:u,color:"var(--turquoise85, #12726D)"};return o.jsx(o.Fragment,{children:Object.keys(s).map(e=>o.jsx(b.default,{label:n(`isochrone_plot.controls.${e}.label`),input:l=>o.jsx(f.default,{labelledbyId:l,value:t[e],ariaValuetext:n(`isochrone_plot.controls.${e}.textValue`,{value:t[e]})||void 0,onChangeCallback:d=>i(e,d),...c,...s[e]}),labelBy:!0},e))})};a.displayName="Widgets.IsochronePlot.Controls";const h=a;exports.default=h;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),_=require("@rubin-epo/epo-react-lib/HorizontalSlider"),p=require("../../../atomic/ControlLabel/index.cjs"),x=require("react-i18next"),f=t=>t&&t.__esModule?t:{default:t},h=f(_),u=({value:t,onChangeCallback:n,configs:s,localizers:i,isDisabled:c=!1})=>{const{t:a}=x.useTranslation(),d=(e,l)=>{n&&n({...t,[e]:l})},b={isDisabled:c,color:"var(--turquoise85, #12726D)"};return o.jsx(o.Fragment,{children:Object.keys(s).map(e=>o.jsx(p.default,{label:a(`isochrone_plot.controls.${e}.label`),input:l=>o.jsx(h.default,{labelledbyId:l,value:t[e],ariaValuetext:a(`isochrone_plot.controls.${e}.textValue`,{value:t[e]})||void 0,renderLabel:({valueNow:r})=>i[e](r),onChangeCallback:r=>d(e,r),...b,...s[e]}),labelBy:!0},e))})};u.displayName="Widgets.IsochronePlot.Controls";const j=u;exports.default=j;

package/dist/widgets/IsochronePlot/Controls/index.d.ts

@@ -10,6 +10,7 @@ interface Config {
 type Props = {
     value: Required<IsochroneValue>;
     configs: Record<keyof IsochroneValue, Config>;
+    localizers: Record<keyof IsochroneValue, (value: number) => string>;
     onChangeCallback?: (value: IsochroneValue) => void;
     isDisabled?: boolean;
 };

package/dist/widgets/IsochronePlot/Controls/index.js

@@ -1,35 +1,37 @@
 "use client";
-import { jsx as l, Fragment as u } from "react/jsx-runtime";
-import d from "@rubin-epo/epo-react-lib/HorizontalSlider";
-import b from "../../../atomic/ControlLabel/index.js";
-import { useTranslation as h } from "react-i18next";
-const a = ({
-  value: t,
-  onChangeCallback: e,
-  configs: n,
-  isDisabled: i = !1
+import { jsx as e, Fragment as u } from "react/jsx-runtime";
+import b from "@rubin-epo/epo-react-lib/HorizontalSlider";
+import h from "../../../atomic/ControlLabel/index.js";
+import { useTranslation as f } from "react-i18next";
+const i = ({
+  value: r,
+  onChangeCallback: n,
+  configs: a,
+  localizers: c,
+  isDisabled: d = !1
 }) => {
-  const { t: s } = h(), c = (o, r) => {
-    e && e({ ...t, [o]: r });
-  }, m = {
-    isDisabled: i,
+  const { t: s } = f(), m = (o, t) => {
+    n && n({ ...r, [o]: t });
+  }, p = {
+    isDisabled: d,
     color: "var(--turquoise85, #12726D)"
   };
-  return /* @__PURE__ */ l(u, { children: Object.keys(n).map((o) => /* @__PURE__ */ l(
-    b,
+  return /* @__PURE__ */ e(u, { children: Object.keys(a).map((o) => /* @__PURE__ */ e(
+    h,
     {
       label: s(`isochrone_plot.controls.${o}.label`),
-      input: (r) => /* @__PURE__ */ l(
-        d,
+      input: (t) => /* @__PURE__ */ e(
+        b,
         {
-          labelledbyId: r,
-          value: t[o],
+          labelledbyId: t,
+          value: r[o],
           ariaValuetext: s(`isochrone_plot.controls.${o}.textValue`, {
-            value: t[o]
+            value: r[o]
           }) || void 0,
-          onChangeCallback: (p) => c(o, p),
-          ...m,
-          ...n[o]
+          renderLabel: ({ valueNow: l }) => c[o](l),
+          onChangeCallback: (l) => m(o, l),
+          ...p,
+          ...a[o]
         }
       ),
       labelBy: !0
@@ -37,8 +39,8 @@ const a = ({
     o
   )) });
 };
-a.displayName = "Widgets.IsochronePlot.Controls";
-const g = a;
+i.displayName = "Widgets.IsochronePlot.Controls";
+const j = i;
 export {
-  g as default
+  j as default
 };

package/dist/widgets/IsochronePlot/helpers.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../lib/helpers.cjs"),o=e=>Math.pow(10,e-9),t=e=>s.parsecsToLightyears(Math.pow(10,e/5+1));exports.ageToGyrs=o;exports.distanceToLyrs=t;

package/dist/widgets/IsochronePlot/helpers.d.ts

@@ -0,0 +1,2 @@
+export declare const ageToGyrs: (age: number) => number;
+export declare const distanceToLyrs: (distance: number) => number;

package/dist/widgets/IsochronePlot/helpers.js

@@ -0,0 +1,6 @@
+import { parsecsToLightyears as s } from "../../lib/helpers.js";
+const r = (o) => Math.pow(10, o - 9), a = (o) => s(Math.pow(10, o / 5 + 1));
+export {
+  r as ageToGyrs,
+  a as distanceToLyrs
+};

package/dist/widgets/LightCurvePlot/PlotWithCurve/index.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),E=require("react"),N=require("react-i18next"),J=require("d3-array"),K=require("@rubin-epo/epo-react-lib/HorizontalSlider"),t=require("../defaults.cjs"),O=require("../Plot/index.cjs"),Q=require("./A11Y/LightCurveLabel/index.cjs"),c=require("../helpers.cjs"),S=require("../../../atomic/Button/patterns/Reset.cjs"),V=require("./MagnitudeSlider/index.cjs"),X=require("./styles.cjs"),Z=require("../../../charts/Viewport/index.cjs"),k=require("../../../layout/Controls/index.cjs"),$=require("../../../atomic/ControlLabel/index.cjs"),G=require("../../../charts/PathFromPoints/index.cjs"),U=require("../../../lib/utils.cjs"),Y=r=>r&&r.__esModule?r:{default:r},A=Y(K),D=({gaussianWidth:r=t.default.gaussianWidth,yOffset:l=t.default.yOffset,alerts:I,peakMjd:P,yMin:f,yMax:x,width:m=t.default.width,height:p=t.default.height,userMagnitude:W,onUserMagnitudeChangeCallback:n,onGaussianChangeCallback:o,onYOffsetChangeCallback:d,className:F,isDisplayOnly:q,...H})=>{const{t:j}=N.useTranslation(),u=U.mergeWithDefaults({min:f,max:x},t.default.yAxis),g=(u.max-u.min)/2+u.min,h=c.useAlertsAsPoints(I,P),R=E.useId(),w=()=>{n&&n(g),d&&d(t.default.yOffset),o&&o(t.default.gaussianWidth)},v=c.estimateMagnitudeWithOffset(0,r,l),B=e.jsx(O.default,{slider:e.jsx(V.default,{magnitude:W||g,onMagnitudeChangeCallback:s=>n&&n(s),disabled:q,yMin:u.min-u.step/2,yMax:u.max+u.step/2,estimatedPeak:v}),plotChildren:({xScale:s,yScale:i,xDomain:y,yDomain:L,xStart:_,xEnd:z,yStart:M,yEnd:a,Data:T})=>e.jsxs(e.Fragment,{children:[e.jsx("rect",{x:s(0),y:a,width:s(15)-s(0),height:M-a,stroke:"var(--neutral60,##6A6E6E)",strokeDasharray:6,fill:"var(--neutral20,#DCE0E3)"}),T,e.jsx(G.default,{points:J.range(y[0],y[1],.5).map(b=>({x:s(b),y:i(c.estimateMagnitude(b,r))})),svgProps:{transform:`translate(0,${i(L[1]-l)})`}}),e.jsx(Z.default,{x:_,y:a,outerHeight:M-a,outerWidth:z-_,innerWidth:m,innerHeight:p,children:e.jsx(X.DM15Display,{gaussianWidth:r})})]}),...H,data:h,width:m,height:p,yMin:f,yMax:x});return e.jsx(e.Fragment,{children:e.jsx(k.default,{className:F,isDisplayOnly:q,ratio:{landscape:3/2,portrait:2/3},widget:B,controls:e.jsxs(e.Fragment,{children:[e.jsx($.default,{label:j("light_curve.curve.controls.gaussian_width"),input:s=>e.jsx(A.default,{labelledbyId:s,color:"var(--turquoise85, #12726D)",min:t.default.gaussianMin,max:t.default.gaussianMax,step:t.default.gaussianStep,value:r,onChangeCallback:i=>typeof i=="number"&&o&&o(i)}),labelBy:!0}),e.jsx($.default,{label:j("light_curve.curve.controls.y_offset"),input:s=>e.jsx(A.default,{labelledbyId:s,color:"var(--turquoise85, #12726D)",min:t.default.yOffsetMin,max:t.default.yOffsetMax,step:t.default.yOffsetStep,value:l,onChangeCallback:i=>typeof i=="number"&&d&&d(i)}),labelBy:!0}),e.jsx(Q.default,{controlledById:R,data:h,gaussianWidth:r,yOffset:l,estimatedPeak:v})]}),actions:e.jsx(S.default,{onResetCallback:w})})})};D.displayName="Widgets.LightCurve";const C=D;exports.default=C;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),T=require("react"),E=require("react-i18next"),N=require("d3-array"),J=require("@rubin-epo/epo-react-lib/HorizontalSlider"),t=require("../defaults.cjs"),K=require("../Plot/index.cjs"),O=require("./A11Y/LightCurveLabel/index.cjs"),c=require("../helpers.cjs"),Q=require("../../../atomic/Button/patterns/Reset.cjs"),S=require("./MagnitudeSlider/index.cjs"),V=require("./styles.cjs"),X=require("../../../charts/Viewport/index.cjs"),Z=require("../../../layout/Controls/index.cjs"),b=require("../../../atomic/ControlLabel/index.cjs"),k=require("../../../charts/PathFromPoints/index.cjs"),G=require("../../../lib/utils.cjs"),U=r=>r&&r.__esModule?r:{default:r},$=U(J),D=({gaussianWidth:r=t.default.gaussianWidth,yOffset:n=t.default.yOffset,alerts:A,peakMjd:I,yMin:f,yMax:x,width:m=t.default.width,height:p=t.default.height,userMagnitude:P,onUserMagnitudeChangeCallback:l,onGaussianChangeCallback:o,onYOffsetChangeCallback:d,className:W,isDisplayOnly:q,...F})=>{const{t:j}=E.useTranslation(),u=G.mergeWithDefaults({min:f,max:x},t.default.yAxis),g=(u.max-u.min)/2+u.min,h=c.useAlertsAsPoints(A,I),H=T.useId(),L=()=>{l&&l(g),d&&d(t.default.yOffset),o&&o(t.default.gaussianWidth)},v=c.estimateMagnitudeWithOffset(0,r,n),R=e.jsx(K.default,{slider:e.jsx(S.default,{magnitude:P||g,onMagnitudeChangeCallback:s=>l&&l(s),disabled:q,yMin:u.min-u.step/2,yMax:u.max+u.step/2,estimatedPeak:v}),plotChildren:({xScale:s,yScale:i,yDomain:w,xStart:y,xEnd:B,yStart:_,yEnd:a,Data:z})=>e.jsxs(e.Fragment,{children:[e.jsx("rect",{x:s(0),y:a,width:s(15)-s(0),height:_-a,stroke:"var(--neutral60,##6A6E6E)",strokeDasharray:6,fill:"var(--neutral20,#DCE0E3)"}),z,e.jsx(k.default,{points:N.range(-10,40,.5).map(M=>({x:s(M),y:i(c.estimateMagnitude(M,r))})),svgProps:{transform:`translate(0,${i(w[1]-n)})`,strokeLinecap:"round"}}),e.jsx(X.default,{x:y,y:a,outerHeight:_-a,outerWidth:B-y,innerWidth:m,innerHeight:p,children:e.jsx(V.DM15Display,{gaussianWidth:r})})]}),...F,data:h,width:m,height:p,yMin:f,yMax:x});return e.jsx(e.Fragment,{children:e.jsx(Z.default,{className:W,isDisplayOnly:q,ratio:{landscape:3/2,portrait:2/3},widget:R,controls:e.jsxs(e.Fragment,{children:[e.jsx(b.default,{label:j("light_curve.curve.controls.gaussian_width"),input:s=>e.jsx($.default,{labelledbyId:s,color:"var(--turquoise85, #12726D)",min:t.default.gaussianMin,max:t.default.gaussianMax,step:t.default.gaussianStep,value:r,onChangeCallback:i=>typeof i=="number"&&o&&o(i)}),labelBy:!0}),e.jsx(b.default,{label:j("light_curve.curve.controls.y_offset"),input:s=>e.jsx($.default,{labelledbyId:s,color:"var(--turquoise85, #12726D)",min:t.default.yOffsetMin,max:t.default.yOffsetMax,step:t.default.yOffsetStep,value:n,onChangeCallback:i=>typeof i=="number"&&d&&d(i)}),labelBy:!0}),e.jsx(O.default,{controlledById:H,data:h,gaussianWidth:r,yOffset:n,estimatedPeak:v})]}),actions:e.jsx(Q.default,{onResetCallback:L})})})};D.displayName="Widgets.LightCurve";const Y=D;exports.default=Y;

package/dist/widgets/LightCurvePlot/PlotWithCurve/index.js

@@ -1,50 +1,50 @@
 "use client";
-import { jsx as t, jsxs as A, Fragment as a } from "react/jsx-runtime";
-import { useId as T } from "react";
-import { useTranslation as V } from "react-i18next";
-import { range as J } from "d3-array";
+import { jsx as t, jsxs as W, Fragment as a } from "react/jsx-runtime";
+import { useId as N } from "react";
+import { useTranslation as T } from "react-i18next";
+import { range as V } from "d3-array";
 import D from "@rubin-epo/epo-react-lib/HorizontalSlider";
 import r from "../defaults.js";
-import K from "../Plot/index.js";
-import Q from "./A11Y/LightCurveLabel/index.js";
-import { useAlertsAsPoints as X, estimateMagnitudeWithOffset as Z, estimateMagnitude as O } from "../helpers.js";
+import J from "../Plot/index.js";
+import K from "./A11Y/LightCurveLabel/index.js";
+import { useAlertsAsPoints as Q, estimateMagnitudeWithOffset as X, estimateMagnitude as Z } from "../helpers.js";
 import k from "../../../atomic/Button/patterns/Reset.js";
-import S from "./MagnitudeSlider/index.js";
-import { DM15Display as C } from "./styles.js";
-import G from "../../../charts/Viewport/index.js";
-import U from "../../../layout/Controls/index.js";
-import I from "../../../atomic/ControlLabel/index.js";
-import Y from "../../../charts/PathFromPoints/index.js";
-import { mergeWithDefaults as tt } from "../../../lib/utils.js";
-const w = ({
+import O from "./MagnitudeSlider/index.js";
+import { DM15Display as S } from "./styles.js";
+import C from "../../../charts/Viewport/index.js";
+import G from "../../../layout/Controls/index.js";
+import A from "../../../atomic/ControlLabel/index.js";
+import U from "../../../charts/PathFromPoints/index.js";
+import { mergeWithDefaults as Y } from "../../../lib/utils.js";
+const I = ({
   gaussianWidth: m = r.gaussianWidth,
   yOffset: s = r.yOffset,
-  alerts: B,
-  peakMjd: _,
+  alerts: w,
+  peakMjd: B,
   yMin: d,
   yMax: f,
   width: c = r.width,
   height: h = r.height,
-  userMagnitude: F,
+  userMagnitude: _,
   onUserMagnitudeChangeCallback: n,
   onGaussianChangeCallback: l,
   onYOffsetChangeCallback: p,
-  className: H,
+  className: F,
   isDisplayOnly: g,
-  ...R
+  ...H
 }) => {
-  const { t: v } = V(), i = tt(
+  const { t: v } = T(), i = Y(
     { min: d, max: f },
     r.yAxis
-  ), y = (i.max - i.min) / 2 + i.min, x = X(B, _), j = T(), q = () => {
+  ), y = (i.max - i.min) / 2 + i.min, x = Q(w, B), R = N(), j = () => {
     n && n(y), p && p(r.yOffset), l && l(r.gaussianWidth);
-  }, b = Z(0, m, s), $ = /* @__PURE__ */ t(
-    K,
+  }, b = X(0, m, s), q = /* @__PURE__ */ t(
+    J,
     {
       slider: /* @__PURE__ */ t(
-        S,
+        O,
         {
-          magnitude: F || y,
+          magnitude: _ || y,
           onMagnitudeChangeCallback: (o) => n && n(o),
           disabled: g,
           yMin: i.min - i.step / 2,
@@ -55,53 +55,53 @@ const w = ({
       plotChildren: ({
         xScale: o,
         yScale: e,
-        xDomain: P,
-        yDomain: z,
-        xStart: M,
-        xEnd: E,
-        yStart: W,
+        yDomain: $,
+        xStart: P,
+        xEnd: z,
+        yStart: L,
         yEnd: u,
-        Data: N
-      }) => /* @__PURE__ */ A(a, { children: [
+        Data: E
+      }) => /* @__PURE__ */ W(a, { children: [
         /* @__PURE__ */ t(
           "rect",
           {
             x: o(0),
             y: u,
             width: o(15) - o(0),
-            height: W - u,
+            height: L - u,
             stroke: "var(--neutral60,##6A6E6E)",
             strokeDasharray: 6,
             fill: "var(--neutral20,#DCE0E3)"
           }
         ),
-        N,
+        E,
         /* @__PURE__ */ t(
-          Y,
+          U,
           {
-            points: J(P[0], P[1], 0.5).map((L) => ({
-              x: o(L),
-              y: e(O(L, m))
+            points: V(-10, 40, 0.5).map((M) => ({
+              x: o(M),
+              y: e(Z(M, m))
             })),
             svgProps: {
-              transform: `translate(0,${e(z[1] - s)})`
+              transform: `translate(0,${e($[1] - s)})`,
+              strokeLinecap: "round"
             }
           }
         ),
         /* @__PURE__ */ t(
-          G,
+          C,
           {
-            x: M,
+            x: P,
             y: u,
-            outerHeight: W - u,
-            outerWidth: E - M,
+            outerHeight: L - u,
+            outerWidth: z - P,
             innerWidth: c,
             innerHeight: h,
-            children: /* @__PURE__ */ t(C, { gaussianWidth: m })
+            children: /* @__PURE__ */ t(S, { gaussianWidth: m })
           }
         )
       ] }),
-      ...R,
+      ...H,
       data: x,
       width: c,
       height: h,
@@ -110,15 +110,15 @@ const w = ({
     }
   );
   return /* @__PURE__ */ t(a, { children: /* @__PURE__ */ t(
-    U,
+    G,
     {
-      className: H,
+      className: F,
       isDisplayOnly: g,
       ratio: { landscape: 3 / 2, portrait: 2 / 3 },
-      widget: $,
-      controls: /* @__PURE__ */ A(a, { children: [
+      widget: q,
+      controls: /* @__PURE__ */ W(a, { children: [
         /* @__PURE__ */ t(
-          I,
+          A,
           {
             label: v("light_curve.curve.controls.gaussian_width"),
             input: (o) => /* @__PURE__ */ t(
@@ -137,7 +137,7 @@ const w = ({
           }
         ),
         /* @__PURE__ */ t(
-          I,
+          A,
           {
             label: v("light_curve.curve.controls.y_offset"),
             input: (o) => /* @__PURE__ */ t(
@@ -156,9 +156,9 @@ const w = ({
           }
         ),
         /* @__PURE__ */ t(
-          Q,
+          K,
           {
-            controlledById: j,
+            controlledById: R,
             data: x,
             gaussianWidth: m,
             yOffset: s,
@@ -166,12 +166,12 @@ const w = ({
           }
         )
       ] }),
-      actions: /* @__PURE__ */ t(k, { onResetCallback: q })
+      actions: /* @__PURE__ */ t(k, { onResetCallback: j })
     }
   ) });
 };
-w.displayName = "Widgets.LightCurve";
-const yt = w;
+I.displayName = "Widgets.LightCurve";
+const vt = I;
 export {
-  yt as default
+  vt as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rubin-epo/epo-widget-lib",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "Rubin Observatory Education & Public Outreach team React scientific and educational widgets.",
   "author": "Rubin EPO",
   "license": "MIT",
@@ -38,7 +38,7 @@
     "react-i18next": "^12.0.0 || ^13.0.0"
   },
   "dependencies": {
-    "@rubin-epo/epo-react-lib": "^2.0.32",
+    "@rubin-epo/epo-react-lib": "2.1.0",
     "context-filter-polyfill": "^0.3.6",
     "d3-array": "^3.2.4",
     "d3-geo": "^3.1.0",