@rubin-epo/epo-widget-lib 0.9.2 → 0.9.4

package/dist/charts/Base/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),s=require("./styles.cjs"),u=({width:r=900,height:i=300,xMin:c=0,yMin:l=0,verticalLabel:t,verticalLabelId:a,horizontalLabel:n,horizontalLabelId:d,title:o,children:x,className:j})=>e.jsxs(s.ChartContainer,{children:[o&&e.jsx(s.Title,{children:o}),t&&e.jsx(s.VerticalLabel,{id:a,"aria-hidden":!!a,children:t}),e.jsx(s.SVG,{preserveAspectRatio:"xMidYMid meet",viewBox:`${c} ${l} ${r} ${i}`,className:j,style:{"--aspect-ratio":`${r} / ${i}`,"--min-width":`${r}px`},role:"group",children:x}),n&&e.jsx(s.HorizontalLabel,{id:d,"aria-hidden":!!d,children:n})]});u.displayName="Charts.Base";const p=u;exports.default=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),r=require("./styles.cjs"),c=({width:s=900,height:i=300,xMin:o=0,yMin:x=0,verticalLabel:a,verticalLabelId:t,horizontalLabel:n,horizontalLabelId:l,title:d,children:j,className:p})=>e.jsxs(r.ChartContainer,{children:[d&&e.jsx(r.TitleWrapper,{children:e.jsx(r.Title,{children:d})}),a&&e.jsxs(e.Fragment,{children:[e.jsx(r.VerticalLabelWrapper,{children:e.jsx(r.Label,{id:t,"aria-hidden":!!t,children:a})}),e.jsx(r.Filler,{})]}),e.jsx(r.SVG,{preserveAspectRatio:"xMidYMid meet",viewBox:`${o} ${x} ${s} ${i}`,className:p,style:{"--aspect-ratio":`${s} / ${i}`},role:"group",children:j}),n&&e.jsx(r.HorizontalLabelWrapper,{children:e.jsx(r.Label,{id:l,"aria-hidden":!!l,children:n})})]});c.displayName="Charts.Base";const u=c;exports.default=u;

package/dist/charts/Base/index.js

@@ -1,52 +1,47 @@
-import { jsxs as x, jsx as e } from "react/jsx-runtime";
-import { ChartContainer as h, Title as l, VerticalLabel as B, SVG as C, HorizontalLabel as f } from "./styles.js";
-const o = ({
-  width: r = 900,
+import { jsxs as t, jsx as r, Fragment as x } from "react/jsx-runtime";
+import { ChartContainer as B, TitleWrapper as C, Title as f, VerticalLabelWrapper as u, Label as l, Filler as W, SVG as j, HorizontalLabelWrapper as y } from "./styles.js";
+const c = ({
+  width: e = 900,
   height: i = 300,
-  xMin: p = 0,
-  yMin: c = 0,
-  verticalLabel: s,
-  verticalLabelId: a,
-  horizontalLabel: t,
-  horizontalLabelId: d,
-  title: n,
+  xMin: o = 0,
+  yMin: h = 0,
+  verticalLabel: a,
+  verticalLabelId: d,
+  horizontalLabel: n,
+  horizontalLabelId: s,
+  title: p,
   children: m,
   className: $
-}) => /* @__PURE__ */ x(h, { children: [
-  n && /* @__PURE__ */ e(l, { children: n }),
-  s && /* @__PURE__ */ e(
-    B,
-    {
-      id: a,
-      "aria-hidden": !!a,
-      children: s
-    }
-  ),
-  /* @__PURE__ */ e(
-    C,
+}) => /* @__PURE__ */ t(B, { children: [
+  p && /* @__PURE__ */ r(C, { children: /* @__PURE__ */ r(f, { children: p }) }),
+  a && /* @__PURE__ */ t(x, { children: [
+    /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(l, { id: d, "aria-hidden": !!d, children: a }) }),
+    /* @__PURE__ */ r(W, {})
+  ] }),
+  /* @__PURE__ */ r(
+    j,
     {
       preserveAspectRatio: "xMidYMid meet",
-      viewBox: `${p} ${c} ${r} ${i}`,
+      viewBox: `${o} ${h} ${e} ${i}`,
       className: $,
       style: {
-        "--aspect-ratio": `${r} / ${i}`,
-        "--min-width": `${r}px`
+        "--aspect-ratio": `${e} / ${i}`
       },
       role: "group",
       children: m
     }
   ),
-  t && /* @__PURE__ */ e(
-    f,
+  n && /* @__PURE__ */ r(y, { children: /* @__PURE__ */ r(
+    l,
     {
-      id: d,
-      "aria-hidden": !!d,
-      children: t
+      id: s,
+      "aria-hidden": !!s,
+      children: n
     }
-  )
+  ) })
 ] });
-o.displayName = "Charts.Base";
-const y = o;
+c.displayName = "Charts.Base";
+const T = c;
 export {
-  y as default
+  T as default
 };

package/dist/charts/Base/styles.cjs

@@ -1,36 +1,54 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),l=t=>t&&t.__esModule?t:{default:t},e=l(a),r=e.default.div`
-  --label-gutter: 2em;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("styled-components"),a=t=>t&&t.__esModule?t:{default:t},e=a(l),i=e.default.div`
+  --label-height: 3em;
+  --label-gutter: calc(var(--label-height) / 2);
 
   display: grid;
-  grid-template-columns: var(--label-gutter) 1fr;
-  grid-template-rows: auto 1fr var(--label-gutter);
+  grid-template-columns: min-content 1fr min-content;
+  grid-template-rows: min-content 1fr min-content;
   grid-template-areas:
-    "title title"
-    "vertical-label chart"
-    ". horizontal-label";
-  padding-inline-end: calc(var(--label-gutter) / 2);
-`,i=e.default.span`
-  font-size: 80%;
-  grid-area: horizontal-label;
+    "title title title"
+    "vertical-label chart filler"
+    ". horizontal-label filler";
+  /* for Safari */
+  align-items: center;
+  width: 100%;
+`;e.default.div`
   place-self: center;
   align-self: center;
-`,n=e.default.span`
-  font-size: 80%;
-  grid-area: vertical-label;
+`;e.default.div`
+  display: flex;
+  align-items: center;
   place-self: center;
   align-self: center;
-  writing-mode: vertical-rl;
-  transform: rotate(180deg);
-`,o=e.default.svg`
+`;const r=e.default.div`
+  grid-area: filler;
+  width: var(--label-height);
+`,n=e.default.svg`
   grid-area: chart;
-  height: 100%;
   max-width: 100%;
+  max-height: 100%;
   aspect-ratio: var(--aspect-ratio);
-`,c=e.default.h3`
+`,d=e.default.div`
   display: flex;
   align-items: center;
   grid-area: title;
-  height: var(--label-gutter);
-  padding-inline: calc(var(--label-gutter) / 2);
+  height: var(--label-height);
+  padding-inline: var(--label-gutter);
+`,c=e.default.h3`
   margin: 0;
-`;exports.ChartContainer=r;exports.HorizontalLabel=i;exports.SVG=o;exports.Title=c;exports.VerticalLabel=n;
+`,o=e.default.div`
+  width: var(--label-height);
+  writing-mode: vertical-rl;
+  transform: rotate(180deg);
+  grid-area: vertical-label;
+`,s=e.default.div`
+  height: var(--label-height);
+  grid-area: horizontal-label;
+`,g=e.default.span`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+  font-size: 80%;
+`;exports.ChartContainer=i;exports.Filler=r;exports.HorizontalLabelWrapper=s;exports.Label=g;exports.SVG=n;exports.Title=c;exports.TitleWrapper=d;exports.VerticalLabelWrapper=o;