@kud/ink-ui 0.20.0 → 0.20.2

package/dist/index.js

@@ -655,14 +655,23 @@ var ScrollView = ({
   ] });
 };
 var GAP = 2;
-var SLIDE_STEPS = 6;
-var SLIDE_MS = 25;
+var SLIDE_STEPS = 12;
+var SLIDE_MS = 28;
 var between = (from, to, t) => {
-  const ease = 1 - Math.pow(1 - t, 3);
+  const ease = t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
   const lerp = (a, b) => Math.round(a + (b - a) * ease);
-  const left = lerp(from.start, to.start);
-  const right = lerp(from.start + from.width, to.start + to.width);
-  return { start: left, width: Math.max(1, right - left) };
+  return {
+    start: lerp(from.start, to.start),
+    width: Math.max(1, lerp(from.width, to.width))
+  };
+};
+var nearestTo = (rules, rule, fallback) => {
+  const centre = (r) => r.start + r.width / 2;
+  if (rules.length === 0) return fallback;
+  return rules.reduce(
+    (best, r, i) => Math.abs(centre(r) - centre(rule)) < Math.abs(centre(rules[best]) - centre(rule)) ? i : best,
+    Math.min(fallback, rules.length - 1)
+  );
 };
 var useSlide = (rules, active) => {
   const target = rules[active] ?? null;
@@ -706,15 +715,16 @@ var Tabs = ({ active, items }) => {
   }
   const activeIndex = cells.findIndex((c) => c.isActive);
   const rule = useSlide(rules, activeIndex) ?? { start: 0, width: 0 };
+  const litIndex = nearestTo(rules, rule, Math.max(0, activeIndex));
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx(Box, { gap: GAP, children: cells.map((cell) => /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Box, { gap: GAP, children: cells.map((cell, i) => /* @__PURE__ */ jsxs(Box, { children: [
       cell.marker ? /* @__PURE__ */ jsx(Text, { color: cell.markerColor, children: cell.marker }) : null,
       /* @__PURE__ */ jsx(
         Text,
         {
-          bold: cell.isActive,
-          color: cell.isActive ? colors.accent : void 0,
-          dimColor: !cell.isActive,
+          bold: i === litIndex,
+          color: i === litIndex ? colors.accent : void 0,
+          dimColor: i !== litIndex,
           children: cell.text
         }
       )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kud/ink-ui",
-  "version": "0.20.0",
+  "version": "0.20.2",
   "description": "React component library for Ink CLIs",
   "type": "module",
   "main": "dist/index.js",