@rubin-epo/epo-widget-lib 0.9.10 → 0.9.12

package/dist/widgets/CameraFilter/styles.cjs

@@ -1,16 +1,17 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),t=require("@rubin-epo/epo-react-lib/styles"),o=n=>n&&n.__esModule?n:{default:n},e=o(i),a=e.default.div`
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),t=require("@rubin-epo/epo-react-lib/styles"),o=require("../../layout/AspectRatio/index.cjs"),a=n=>n&&n.__esModule?n:{default:n},e=a(i),l=e.default(o.default)`
+  display: flex;
+  align-items: center;
+`,r=e.default.div`
   container-type: inline-size;
-  container-name: camera-filter;
 
   display: grid;
   grid-template-columns: 1fr;
   grid-auto-rows: min-content;
   text-align: center;
-  padding-block: var(--PADDING_SMALL, 20px);
-  position: relative;
-`,l=e.default.h3`
+  width: 100%;
+`,s=e.default.h3`
   margin: 0;
-`,r=e.default.table`
+`,d=e.default.table`
   border-collapse: collapse;
   text-align: center;
   margin-inline-start: var(--filter-table-margin-inline-start);
@@ -19,16 +20,16 @@
   @container (min-width: ${t.token("BREAK_TABLET")}) {
     margin-block-start: var(--PADDING_SMALL, 20px);
   }
-`,s=e.default.tbody`
+`,c=e.default.tbody`
   display: table-header-group;
-`,d=e.default.thead`
+`,f=e.default.thead`
   display: table-row-group;
-`,c=e.default.td`
+`,m=e.default.td`
   line-height: 1.2;
   font-size: 80%;
-`,m=e.default.span`
+`,u=e.default.span`
   font-size: 80%;
-`,f=e.default.th`
+`,p=e.default.th`
   font-size: 120%;
   font-weight: var(--FONT_WEIGHT_NORMAL, 400);
   border: var(--filter-name-border);
@@ -37,15 +38,15 @@
   @container (min-width: ${t.token("BREAK_TABLET")}) {
     border-width: 3px;
   }
-`,u=e.default.div`
+`,g=e.default.div`
   min-width: 20ch;
   width: 50%;
   max-width: 30ch;
   justify-self: center;
   text-align: left;
-`,p=e.default.label`
+`,h=e.default.label`
   font-size: 0.75em;
-`,g=e.default.text`
+`,w=e.default.text`
   font-size: 2em;
 
   @container (min-width: ${t.token("BREAK_MOBILE")}) {
@@ -55,7 +56,7 @@
   @container (min-width: ${t.token("BREAK_PHABLET_MIN")}) {
     font-size: 0.75em;
   }
-`,h=e.default.tspan`
+`,b=e.default.tspan`
   font-size: 2em;
 
   @container (min-width: ${t.token("BREAK_MOBILE")}) {
@@ -65,7 +66,7 @@
   @container (min-width: ${t.token("BREAK_PHABLET_MIN")}) {
     font-size: 0.75em;
   }
-`,b=e.default.tspan`
+`,_=e.default.tspan`
   font-size: 1.5em;
 
   @container (min-width: ${t.token("BREAK_MOBILE")}) {
@@ -75,7 +76,7 @@
   @container (min-width: ${t.token("BREAK_PHABLET_MIN")}) {
     font-size: 0.5em;
   }
-`,_=e.default.tspan`
+`,A=e.default.tspan`
   font-size: 1.3em;
 
   @container (min-width: ${t.token("BREAK_MOBILE")}) {
@@ -85,7 +86,7 @@
   @container (min-width: ${t.token("BREAK_PHABLET_MIN")}) {
     font-size: 0.4em;
   }
-`,w=e.default.ul`
+`,B=e.default.ul`
   display: flex;
   justify-content: space-between;
   line-height: 1.2;
@@ -93,7 +94,7 @@
   margin: var(--PADDING_SMALL, 20px) 0 0;
   padding: 0;
   list-style-type: none;
-`,A=e.default.li`
+`,E=e.default.li`
   list-style-type: none;
   margin: 0;
   padding: 0;
@@ -101,4 +102,4 @@
   &:before {
     content: "\200B";
   }
-`;exports.ColorName=h;exports.ColorSpectrum=b;exports.ColorSpectrumUnit=_;exports.CondensedRange=A;exports.CondensedRangeRow=w;exports.FilterContainer=a;exports.FilterName=f;exports.FilterNames=d;exports.FilterRange=c;exports.FilterRanges=s;exports.FilterTable=r;exports.FilterTitle=l;exports.SelectContainer=u;exports.SelectLabel=p;exports.SpectrumLabel=g;exports.Wavelength=m;
+`;exports.ColorName=b;exports.ColorSpectrum=_;exports.ColorSpectrumUnit=A;exports.CondensedRange=E;exports.CondensedRangeRow=B;exports.FilterContainer=r;exports.FilterName=p;exports.FilterNames=f;exports.FilterRange=m;exports.FilterRanges=c;exports.FilterTable=d;exports.FilterTitle=s;exports.FilterWrapper=l;exports.SelectContainer=g;exports.SelectLabel=h;exports.SpectrumLabel=w;exports.Wavelength=u;

package/dist/widgets/CameraFilter/styles.d.ts

@@ -1,3 +1,12 @@
+/// <reference types="react" />
+import AspectRatio from '../../layout/AspectRatio';
+export declare const FilterWrapper: import("styled-components").IStyledComponent<"web", {
+    ratio: AspectRatio;
+    medScreenRatio?: AspectRatio | undefined;
+    smallScreenRatio?: AspectRatio | undefined;
+    className?: string | undefined;
+    children?: import("react").ReactNode;
+}> & import("react").FunctionComponent<import("react").PropsWithChildren<import('../../layout/AspectRatio').AspectRatioProps>>;
 export declare const FilterContainer: import("styled-components").IStyledComponent<"web", {
     ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
     key?: import("react").Key | null | undefined;
@@ -2941,7 +2950,7 @@ export declare const SpectrumLabel: import("styled-components").IStyledComponent
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -3423,7 +3432,7 @@ export declare const ColorName: import("styled-components").IStyledComponent<"we
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -3905,7 +3914,7 @@ export declare const ColorSpectrum: import("styled-components").IStyledComponent
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -4387,7 +4396,7 @@ export declare const ColorSpectrumUnit: import("styled-components").IStyledCompo
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;

package/dist/widgets/CameraFilter/styles.js

@@ -1,94 +1,96 @@
 "use client";
-import e from "styled-components";
-import { token as t } from "@rubin-epo/epo-react-lib/styles";
-const o = e.div`
+import t from "styled-components";
+import { token as e } from "@rubin-epo/epo-react-lib/styles";
+import n from "../../layout/AspectRatio/index.js";
+const a = t(n)`
+  display: flex;
+  align-items: center;
+`, s = t.div`
   container-type: inline-size;
-  container-name: camera-filter;
 
   display: grid;
   grid-template-columns: 1fr;
   grid-auto-rows: min-content;
   text-align: center;
-  padding-block: var(--PADDING_SMALL, 20px);
-  position: relative;
-`, r = e.h3`
+  width: 100%;
+`, l = t.h3`
   margin: 0;
-`, a = e.table`
+`, c = t.table`
   border-collapse: collapse;
   text-align: center;
   margin-inline-start: var(--filter-table-margin-inline-start);
   width: var(--filter-table-width);
 
-  @container (min-width: ${t("BREAK_TABLET")}) {
+  @container (min-width: ${e("BREAK_TABLET")}) {
     margin-block-start: var(--PADDING_SMALL, 20px);
   }
-`, s = e.tbody`
+`, m = t.tbody`
   display: table-header-group;
-`, l = e.thead`
+`, d = t.thead`
   display: table-row-group;
-`, c = e.td`
+`, p = t.td`
   line-height: 1.2;
   font-size: 80%;
-`, m = e.span`
+`, f = t.span`
   font-size: 80%;
-`, d = e.th`
+`, h = t.th`
   font-size: 120%;
   font-weight: var(--FONT_WEIGHT_NORMAL, 400);
   border: var(--filter-name-border);
   border-width: 1px;
 
-  @container (min-width: ${t("BREAK_TABLET")}) {
+  @container (min-width: ${e("BREAK_TABLET")}) {
     border-width: 3px;
   }
-`, p = e.div`
+`, g = t.div`
   min-width: 20ch;
   width: 50%;
   max-width: 30ch;
   justify-self: center;
   text-align: left;
-`, f = e.label`
+`, w = t.label`
   font-size: 0.75em;
-`, h = e.text`
+`, A = t.text`
   font-size: 2em;
 
-  @container (min-width: ${t("BREAK_MOBILE")}) {
+  @container (min-width: ${e("BREAK_MOBILE")}) {
     font-size: 1.25em;
   }
 
-  @container (min-width: ${t("BREAK_PHABLET_MIN")}) {
+  @container (min-width: ${e("BREAK_PHABLET_MIN")}) {
     font-size: 0.75em;
   }
-`, g = e.tspan`
+`, B = t.tspan`
   font-size: 2em;
 
-  @container (min-width: ${t("BREAK_MOBILE")}) {
+  @container (min-width: ${e("BREAK_MOBILE")}) {
     font-size: 1.25em;
   }
 
-  @container (min-width: ${t("BREAK_PHABLET_MIN")}) {
+  @container (min-width: ${e("BREAK_PHABLET_MIN")}) {
     font-size: 0.75em;
   }
-`, A = e.tspan`
+`, E = t.tspan`
   font-size: 1.5em;
 
-  @container (min-width: ${t("BREAK_MOBILE")}) {
+  @container (min-width: ${e("BREAK_MOBILE")}) {
     font-size: 1em;
   }
 
-  @container (min-width: ${t("BREAK_PHABLET_MIN")}) {
+  @container (min-width: ${e("BREAK_PHABLET_MIN")}) {
     font-size: 0.5em;
   }
-`, w = e.tspan`
+`, b = t.tspan`
   font-size: 1.3em;
 
-  @container (min-width: ${t("BREAK_MOBILE")}) {
+  @container (min-width: ${e("BREAK_MOBILE")}) {
     font-size: 0.8em;
   }
 
-  @container (min-width: ${t("BREAK_PHABLET_MIN")}) {
+  @container (min-width: ${e("BREAK_PHABLET_MIN")}) {
     font-size: 0.4em;
   }
-`, B = e.ul`
+`, z = t.ul`
   display: flex;
   justify-content: space-between;
   line-height: 1.2;
@@ -96,7 +98,7 @@ const o = e.div`
   margin: var(--PADDING_SMALL, 20px) 0 0;
   padding: 0;
   list-style-type: none;
-`, E = e.li`
+`, _ = t.li`
   list-style-type: none;
   margin: 0;
   padding: 0;
@@ -106,20 +108,21 @@ const o = e.div`
   }
 `;
 export {
-  g as ColorName,
-  A as ColorSpectrum,
-  w as ColorSpectrumUnit,
-  E as CondensedRange,
-  B as CondensedRangeRow,
-  o as FilterContainer,
-  d as FilterName,
-  l as FilterNames,
-  c as FilterRange,
-  s as FilterRanges,
-  a as FilterTable,
-  r as FilterTitle,
-  p as SelectContainer,
-  f as SelectLabel,
-  h as SpectrumLabel,
-  m as Wavelength
+  B as ColorName,
+  E as ColorSpectrum,
+  b as ColorSpectrumUnit,
+  _ as CondensedRange,
+  z as CondensedRangeRow,
+  s as FilterContainer,
+  h as FilterName,
+  d as FilterNames,
+  p as FilterRange,
+  m as FilterRanges,
+  c as FilterTable,
+  l as FilterTitle,
+  a as FilterWrapper,
+  g as SelectContainer,
+  w as SelectLabel,
+  A as SpectrumLabel,
+  f as Wavelength
 };

package/dist/widgets/FilterTool/styles.d.ts

@@ -750,7 +750,7 @@ export declare const PrismSVG: import("styled-components").IStyledComponent<"web
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -1232,7 +1232,7 @@ export declare const WhiteLine: import("styled-components").IStyledComponent<"we
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -1714,7 +1714,7 @@ export declare const Ray: import("styled-components").IStyledComponent<"web", {
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -2196,7 +2196,7 @@ export declare const Arrow: import("styled-components").IStyledComponent<"web",
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -2678,7 +2678,7 @@ export declare const PrismOutline: import("styled-components").IStyledComponent<
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;
@@ -3160,7 +3160,7 @@ export declare const Filter: import("styled-components").IStyledComponent<"web",
     stroke?: string | undefined;
     strokeDasharray?: string | number | undefined;
     strokeDashoffset?: string | number | undefined;
-    strokeLinecap?: "inherit" | "butt" | "round" | "square" | undefined;
+    strokeLinecap?: "inherit" | "square" | "butt" | "round" | undefined;
     strokeLinejoin?: "inherit" | "round" | "miter" | "bevel" | undefined;
     strokeMiterlimit?: string | number | undefined;
     strokeOpacity?: string | number | undefined;

package/dist/widgets/SourceSelector/Point/Point.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("react/jsx-runtime"),P=require("./styles.cjs"),o=({type:i,isActive:n,isSelected:s,x:u,y:l,radius:c,className:d,color:f,onClickCallback:g})=>{const x={supernova:20,galaxy:60,galaxyFilter:25},y=(e,t)=>{if(t)return Math.abs(t);const{[e]:r=8}=x;return r},b=(e,t,r)=>e?"#fed828":t?r:"transparent",a=y(i,c),m=Math.max(10,a*1.2);return p.jsx(P.Point,{onClick:g,cx:u,cy:l,r:n?m:a,fill:"transparent",stroke:b(n,s,f),tabIndex:0,role:"listitem",$isSelected:s,className:d})};o.displayName="Widgets.SourceSelector.Point";const R=o;exports.default=R;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react/jsx-runtime"),g=require("./styles.cjs"),y=(e,t)=>{const r={supernova:20,galaxy:60,galaxyFilter:25};if(t)return typeof t=="number"?Math.abs(t):t;const{[e]:n=8}=r;return n},m=(e,t,r)=>e?"#fed828":t?r:"transparent",o=({type:e,isActive:t,isSelected:r,x:n,y:s,radius:i,className:a,color:l,onClickCallback:u,id:c})=>{const f=y(e,i);return d.jsx(g.Point,{onClick:u,cx:n,cy:s,fill:"transparent",stroke:m(t,r,l),strokeWidth:3,transform:`scale(${t?1.2:1})`,tabIndex:0,role:"listitem",className:a,r:f,id:c})};o.displayName="Widgets.SourceSelector.Point";const p=o;exports.default=p;

package/dist/widgets/SourceSelector/Point/Point.d.ts

@@ -1,14 +1,9 @@
-import { SourceType } from '../../../types/astro';
+import { Source } from '../../../types/astro';
 import { FunctionComponent, MouseEventHandler } from "react";
-export interface PointProps {
-    type: SourceType;
+export interface PointProps extends Source {
     isSelected: boolean;
     isActive: boolean;
-    x: number;
-    y: number;
-    radius?: number;
     className?: string;
-    color: string;
     onClickCallback?: MouseEventHandler<SVGCircleElement>;
 }
 declare const Point: FunctionComponent<PointProps>;

package/dist/widgets/SourceSelector/Point/Point.js

@@ -1,44 +1,48 @@
-import { jsx as y } from "react/jsx-runtime";
-import { Point as R } from "./styles.js";
-const s = ({
-  type: i,
-  isActive: n,
-  isSelected: a,
-  x: c,
-  y: l,
-  radius: u,
-  className: d,
-  color: f,
-  onClickCallback: m
-}) => {
-  const p = {
+import { jsx as m } from "react/jsx-runtime";
+import { Point as p } from "./styles.js";
+const d = (r, t) => {
+  const e = {
     supernova: 20,
     galaxy: 60,
     galaxyFilter: 25
-  }, x = (r, t) => {
-    if (t)
-      return Math.abs(t);
-    const { [r]: e = 8 } = p;
-    return e;
-  }, g = (r, t, e) => r ? "#fed828" : t ? e : "transparent", o = x(i, u), P = Math.max(10, o * 1.2);
-  return /* @__PURE__ */ y(
-    R,
+  };
+  if (t)
+    return typeof t == "number" ? Math.abs(t) : t;
+  const { [r]: n = 8 } = e;
+  return n;
+}, x = (r, t, e) => r ? "#fed828" : t ? e : "transparent", o = ({
+  type: r,
+  isActive: t,
+  isSelected: e,
+  x: n,
+  y: a,
+  radius: s,
+  className: i,
+  color: l,
+  onClickCallback: c,
+  id: f
+}) => {
+  const u = d(r, s);
+  return /* @__PURE__ */ m(
+    p,
     {
-      onClick: m,
-      cx: c,
-      cy: l,
-      r: n ? P : o,
+      onClick: c,
+      cx: n,
+      cy: a,
       fill: "transparent",
-      stroke: g(n, a, f),
+      stroke: x(t, e, l),
+      strokeWidth: 3,
+      transform: `scale(${t ? 1.2 : 1})`,
       tabIndex: 0,
       role: "listitem",
-      $isSelected: a,
-      className: d
+      className: i,
+      r: u,
+      id: f
     }
   );
 };
-s.displayName = "Widgets.SourceSelector.Point";
-const S = s;
+o.displayName = "Widgets.SourceSelector.Point";
+const P = o;
 export {
-  S as default
+  P as default
 };

package/dist/widgets/SourceSelector/Point/styles.cjs

@@ -1,11 +1,9 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),o=t=>t&&t.__esModule?t:{default:t},s=o(e),n=s.default.circle`
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),o=t=>t&&t.__esModule?t:{default:t},n=o(e),r=n.default.circle`
   cursor: pointer;
-  transition: fill ease var(--DURATION, 0.2s), r ease-out 400ms;
-  ${({$isSelected:t})=>t&&e.css`
-      stroke-width: 3;
-    `}
+  transition: transform ease var(--DURATION, 0.2s);
+  transform-origin: center;
 
   &:focus {
     outline: none;
   }
-`;exports.Point=n;
+`;exports.Point=r;