@hackcove/ui-react 0.10.3 → 0.10.5

package/dist/trend.js

@@ -0,0 +1,64 @@
+/**
+ * The scale shared by `TrendChart` and the `StatTile` sparkline. Internal: not exported from
+ * `index.ts`.
+ */
+/**
+ * The top of a y-axis that starts at 0: the smallest of 2, 4 or 10 times a whole power of ten
+ * (1, 10, 100, …) that is at least `top`. Its half is then a whole number: 1 gives 2, 3 gives
+ * 4, 5 gives 10, 13 gives 20. Nothing above 0 gives 2.
+ */
+export function scaleMax(top) {
+    for (let power = 1;; power *= 10) {
+        for (const step of [2, 4, 10]) {
+            if (step * power >= top)
+                return step * power;
+        }
+    }
+}
+/** A value as drawn: a negative one is 0, and a missing or non-finite one is `null`. */
+export function drawn(value) {
+    if (value == null || !Number.isFinite(value))
+        return null;
+    return Math.max(0, value);
+}
+/** The largest drawn value of every list, or 0. */
+export function largest(lists) {
+    let top = 0;
+    for (const list of lists) {
+        for (const value of list)
+            top = Math.max(top, drawn(value) ?? 0);
+    }
+    return top;
+}
+/** `value` as a height on a 0 to 100 plot, measured down from the top (SVG's y). */
+export function plotY(value, max) {
+    return 100 - (value / max) * 100;
+}
+/**
+ * The polylines of a line through `points`, broken at every missing one: one `points` string per
+ * run of present values. A run of one point repeats it, so a round cap draws it as a dot.
+ */
+export function runs(points) {
+    const out = [];
+    let run = [];
+    const close = () => {
+        const [only] = run;
+        if (run.length === 1 && only !== undefined)
+            run.push(only);
+        if (run.length > 0)
+            out.push(run.join(" "));
+        run = [];
+    };
+    for (const point of points) {
+        if (point === null)
+            close();
+        else
+            run.push(`${round(point.x)},${round(point.y)}`);
+    }
+    close();
+    return out;
+}
+/** Four decimals, so the markup stays short and stable. */
+export function round(n) {
+    return Math.round(n * 10000) / 10000;
+}

package/dist/typography.js

@@ -118,6 +118,8 @@ const SECTION = {
     app: "text-base/6 font-semibold",
     prose: "text-2xl/8 font-semibold tracking-tight",
 };
+/** The offset an anchored heading keeps from the top, so the sticky header does not cover it. */
+const SCROLL_TARGET = "scroll-mt-28";
 /**
  * Top-level section header. `h2`, text-base/6 semibold, primary text (text-2xl/8 semibold tight
  * inside a `Prose`). `rule` sets
@@ -129,10 +131,12 @@ export function SectionHeading({ rule, description, ...props }) {
     const hairline = "mb-4 border-b border-slate-200/70 pb-2";
     const size = useProse() ? SECTION.prose : SECTION.app;
     const hasDescription = description != null && description !== false;
+    // An `id` makes the heading a link target, so an anchor jump leaves it clear of the sticky header.
+    const scroll = props.id === undefined ? undefined : SCROLL_TARGET;
     if (!hasDescription) {
-        return pinned("h2", cx(rule && hairline, size), "default", props);
+        return pinned("h2", cx(rule && hairline, size, scroll), "default", props);
     }
-    return (_jsxs("div", { className: cx("flex flex-col gap-1", rule && hairline), children: [pinned("h2", size, "default", props), _jsx(Text, { as: "p", color: "tertiary", children: description })] }));
+    return (_jsxs("div", { className: cx("flex flex-col gap-1", rule && hairline), children: [pinned("h2", cx(size, scroll), "default", props), _jsx(Text, { as: "p", color: "tertiary", children: description })] }));
 }
 const SUBSECTION_SIZE = {
     sm: { app: "text-sm/5 font-semibold", prose: "text-base/7 font-semibold" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hackcove/ui-react",
-  "version": "0.10.3",
+  "version": "0.10.5",
   "description": "Hack Cove React components: primitives, typography roles and a safe Markdown renderer, written against Tailwind v4 utilities. Pair with a theme from @hackcove/themes.",
   "keywords": [
     "components",
@@ -78,16 +78,6 @@
     }
   },
   "nx": {
-    "name": "ui-react",
-    "tags": [
-      "kind:package"
-    ],
-    "targets": {
-      "build": {
-        "outputs": [
-          "{projectRoot}/dist"
-        ]
-      }
-    }
+    "name": "ui-react"
   }
 }