@epilot/zenith-react 0.1.0-next.0

package/dist/components/scroll-area/scroll-area.js

@@ -0,0 +1,199 @@
+import { jsx as p, jsxs as j } from "react/jsx-runtime";
+import * as e from "react";
+import { Root as H, Scrollbar as W, Thumb as O, Corner as L, Viewport as q } from "../../vendor/.bun/@radix-ui_react-scroll-area@1.2.10_2b23df507bdda662/vendor/@radix-ui/react-scroll-area/dist/index.js";
+import { mergeClasses as b, SLOT_ATTR as o, shorthands as R } from "@epilot/zenith-runtime/v1";
+import { makeZenithStyles as I } from "../../styles/make-styles.js";
+import { grayA9 as M, grayA11 as Z, grayA10 as _, semFocusRing as B } from "../../tokens/index.js";
+import { useScrollbarStyles as G } from "./scrollbar-styles.js";
+const T = e.createContext(null), E = I({
+  root: {
+    position: "relative",
+    minWidth: 0,
+    minHeight: 0,
+    ...R.overflow("hidden"),
+    [`&[data-revealed='true'] > [${o}='scroll-area-scrollbar']`]: {
+      opacity: 1,
+      pointerEvents: "auto"
+    },
+    "@media (forced-colors: active)": {
+      [`& > [${o}='scroll-area-scrollbar']`]: {
+        opacity: 1,
+        pointerEvents: "auto",
+        backgroundColor: "Canvas"
+      }
+    }
+  },
+  viewport: {
+    width: "100%",
+    height: "100%",
+    minWidth: 0,
+    minHeight: 0,
+    boxSizing: "border-box",
+    borderRadius: "inherit",
+    ":focus-visible": {
+      outlineWidth: "3px",
+      outlineStyle: "solid",
+      outlineColor: B,
+      outlineOffset: "-3px"
+    }
+  },
+  verticalContent: {
+    // Radix's measurement wrapper defaults to display:table, which expands long lines.
+    "& > div": { display: "block", minWidth: "100%" }
+  },
+  reserveVertical: { paddingInlineEnd: "12px" },
+  reserveHorizontal: { paddingBottom: "12px" },
+  track: {
+    boxSizing: "border-box",
+    ...R.padding("3px"),
+    backgroundColor: "transparent",
+    opacity: 0,
+    pointerEvents: "none",
+    transitionProperty: "opacity",
+    transitionDuration: "120ms",
+    "@media (prefers-reduced-motion: reduce)": { transitionDuration: "0s" },
+    [`&:hover > [${o}='scroll-area-thumb']`]: {
+      backgroundColor: _
+    },
+    [`&:active > [${o}='scroll-area-thumb']`]: {
+      backgroundColor: Z
+    },
+    "@media (forced-colors: active)": {
+      [`& > [${o}='scroll-area-thumb']`]: {
+        backgroundColor: "ButtonText",
+        forcedColorAdjust: "none"
+      }
+    }
+  },
+  vertical: { width: "12px" },
+  horizontal: { height: "12px", flexDirection: "column" },
+  thumb: { backgroundColor: M },
+  // Radix owns thumb length (including its 18px minimum) and uses it in drag math.
+  // A CSS-only minimum overrides the paint but not that math, overshooting the track.
+  corner: { backgroundColor: "transparent", pointerEvents: "none" }
+}), F = e.forwardRef(
+  function({
+    orientation: a = "vertical",
+    visibility: u = "interaction",
+    className: v,
+    children: g,
+    onPointerEnter: t,
+    onPointerLeave: l,
+    onFocusCapture: n,
+    onBlurCapture: x,
+    ...D
+  }, f) {
+    const d = E(), y = G(), w = e.useRef(null), k = e.useRef(
+      void 0
+    ), s = e.useRef({
+      hover: !1,
+      focus: !1,
+      drag: !1
+    }), [V, C] = e.useState(!1), c = e.useCallback(() => {
+      clearTimeout(k.current);
+    }, []), m = e.useCallback(() => {
+      c(), C(!0);
+    }, [c]), i = e.useCallback(() => {
+      c(), Object.values(s.current).some(Boolean) || (k.current = setTimeout(() => C(!1), 600));
+    }, [c]), S = e.useCallback(() => {
+      m(), i();
+    }, [m, i]);
+    e.useEffect(() => {
+      var A;
+      const r = (A = w.current) == null ? void 0 : A.ownerDocument, h = () => {
+        s.current.drag && (s.current.drag = !1, i());
+      };
+      return r == null || r.addEventListener("pointerup", h, !0), r == null || r.addEventListener("pointercancel", h, !0), () => {
+        c(), r == null || r.removeEventListener("pointerup", h, !0), r == null || r.removeEventListener("pointercancel", h, !0);
+      };
+    }, [c, i]);
+    const N = e.useMemo(
+      () => ({ orientation: a, onScroll: S }),
+      [a, S]
+    ), $ = a === "both" ? ["vertical", "horizontal"] : [a];
+    return /* @__PURE__ */ p(T.Provider, { value: N, children: /* @__PURE__ */ j(
+      H,
+      {
+        ...D,
+        type: "auto",
+        ref: (r) => {
+          w.current = r, typeof f == "function" ? f(r) : f && (f.current = r);
+        },
+        "data-slot": "scroll-area",
+        [o]: "scroll-area",
+        "data-orientation": a,
+        "data-revealed": u === "always" || V,
+        className: b(d.root, v),
+        onPointerEnter: (r) => {
+          r.pointerType !== "touch" && (s.current.hover = !0, m()), t == null || t(r);
+        },
+        onPointerLeave: (r) => {
+          s.current.hover = !1, i(), l == null || l(r);
+        },
+        onFocusCapture: (r) => {
+          s.current.focus = !0, m(), n == null || n(r);
+        },
+        onBlurCapture: (r) => {
+          r.currentTarget.contains(r.relatedTarget) || (s.current.focus = !1, i()), x == null || x(r);
+        },
+        children: [
+          g,
+          $.map((r) => /* @__PURE__ */ p(
+            W,
+            {
+              orientation: r,
+              "data-slot": "scroll-area-scrollbar",
+              [o]: "scroll-area-scrollbar",
+              className: b(
+                y.track,
+                d.track,
+                d[r]
+              ),
+              onPointerDown: () => {
+                s.current.drag = !0, m();
+              },
+              children: /* @__PURE__ */ p(
+                O,
+                {
+                  "data-slot": "scroll-area-thumb",
+                  [o]: "scroll-area-thumb",
+                  className: b(y.thumb, d.thumb)
+                }
+              )
+            },
+            r
+          )),
+          a === "both" && /* @__PURE__ */ p(L, { className: d.corner })
+        ]
+      }
+    ) });
+  }
+), P = e.forwardRef(function({ className: a, onScroll: u, ...v }, g) {
+  const t = e.useContext(T), l = E();
+  if (!t)
+    throw new Error("ScrollAreaViewport requires a ScrollArea parent");
+  return /* @__PURE__ */ p(
+    q,
+    {
+      ...v,
+      ref: g,
+      "data-slot": "scroll-area-viewport",
+      [o]: "scroll-area-viewport",
+      className: b(
+        l.viewport,
+        t.orientation === "vertical" && l.verticalContent,
+        t.orientation !== "horizontal" && l.reserveVertical,
+        t.orientation !== "vertical" && l.reserveHorizontal,
+        a
+      ),
+      onScroll: (n) => {
+        n.target === n.currentTarget && (t.onScroll(), u == null || u(n));
+      }
+    }
+  );
+});
+export {
+  F as ScrollArea,
+  P as ScrollAreaViewport
+};
+//# sourceMappingURL=scroll-area.js.map

package/dist/components/scroll-area/scroll-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.js","sources":["../../../src/components/scroll-area/scroll-area.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as Primitive from \"@radix-ui/react-scroll-area\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { useScrollbarStyles } from \"./scrollbar-styles\"\n\nexport type ScrollAreaOrientation = \"vertical\" | \"horizontal\" | \"both\"\nexport type ScrollAreaVisibility = \"interaction\" | \"always\"\nexport type ScrollAreaProps = Omit<\n  React.ComponentPropsWithoutRef<typeof Primitive.Root>,\n  \"asChild\" | \"type\" | \"scrollHideDelay\"\n> & {\n  orientation?: ScrollAreaOrientation\n  visibility?: ScrollAreaVisibility\n}\nexport type ScrollAreaViewportProps = Omit<\n  React.ComponentPropsWithoutRef<typeof Primitive.Viewport>,\n  \"asChild\"\n>\n\nconst Context = React.createContext<{\n  orientation: ScrollAreaOrientation\n  onScroll: () => void\n} | null>(null)\n\nconst useStyles = makeZenithStyles({\n  root: {\n    position: \"relative\",\n    minWidth: 0,\n    minHeight: 0,\n    ...shorthands.overflow(\"hidden\"),\n    [`&[data-revealed='true'] > [${SLOT_ATTR}='scroll-area-scrollbar']`]: {\n      opacity: 1,\n      pointerEvents: \"auto\",\n    },\n    \"@media (forced-colors: active)\": {\n      [`& > [${SLOT_ATTR}='scroll-area-scrollbar']`]: {\n        opacity: 1,\n        pointerEvents: \"auto\",\n        backgroundColor: \"Canvas\",\n      },\n    },\n  },\n  viewport: {\n    width: \"100%\",\n    height: \"100%\",\n    minWidth: 0,\n    minHeight: 0,\n    boxSizing: \"border-box\",\n    borderRadius: \"inherit\",\n    \":focus-visible\": {\n      outlineWidth: \"3px\",\n      outlineStyle: \"solid\",\n      outlineColor: tokens.semFocusRing,\n      outlineOffset: \"-3px\",\n    },\n  },\n  verticalContent: {\n    // Radix's measurement wrapper defaults to display:table, which expands long lines.\n    \"& > div\": { display: \"block\", minWidth: \"100%\" },\n  },\n  reserveVertical: { paddingInlineEnd: \"12px\" },\n  reserveHorizontal: { paddingBottom: \"12px\" },\n  track: {\n    boxSizing: \"border-box\",\n    ...shorthands.padding(\"3px\"),\n    backgroundColor: \"transparent\",\n    opacity: 0,\n    pointerEvents: \"none\",\n    transitionProperty: \"opacity\",\n    transitionDuration: \"120ms\",\n    \"@media (prefers-reduced-motion: reduce)\": { transitionDuration: \"0s\" },\n    [`&:hover > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n      backgroundColor: tokens.grayA10,\n    },\n    [`&:active > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n      backgroundColor: tokens.grayA11,\n    },\n    \"@media (forced-colors: active)\": {\n      [`& > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n        backgroundColor: \"ButtonText\",\n        forcedColorAdjust: \"none\",\n      },\n    },\n  },\n  vertical: { width: \"12px\" },\n  horizontal: { height: \"12px\", flexDirection: \"column\" },\n  thumb: { backgroundColor: tokens.grayA9 },\n  // Radix owns thumb length (including its 18px minimum) and uses it in drag math.\n  // A CSS-only minimum overrides the paint but not that math, overshooting the track.\n  corner: { backgroundColor: \"transparent\", pointerEvents: \"none\" },\n})\n\n/** Native scrolling with Radix tracks. Dimensions belong here; scroll refs belong to the viewport. */\nexport const ScrollArea = React.forwardRef<HTMLDivElement, ScrollAreaProps>(\n  function ScrollArea(\n    {\n      orientation = \"vertical\",\n      visibility = \"interaction\",\n      className,\n      children,\n      onPointerEnter,\n      onPointerLeave,\n      onFocusCapture,\n      onBlurCapture,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const scrollbar = useScrollbarStyles()\n    const root = React.useRef<HTMLDivElement | null>(null)\n    const timer = React.useRef<ReturnType<typeof setTimeout> | undefined>(\n      undefined\n    )\n    const interaction = React.useRef({\n      hover: false,\n      focus: false,\n      drag: false,\n    })\n    const [revealed, setRevealed] = React.useState(false)\n    const clear = React.useCallback(() => {\n      clearTimeout(timer.current)\n    }, [])\n    const reveal = React.useCallback(() => {\n      clear()\n      setRevealed(true)\n    }, [clear])\n    const settle = React.useCallback(() => {\n      clear()\n      if (!Object.values(interaction.current).some(Boolean)) {\n        timer.current = setTimeout(() => setRevealed(false), 600)\n      }\n    }, [clear])\n    const pulse = React.useCallback(() => {\n      reveal()\n      settle()\n    }, [reveal, settle])\n    React.useEffect(() => {\n      const doc = root.current?.ownerDocument\n      const endDrag = () => {\n        if (interaction.current.drag) {\n          interaction.current.drag = false\n          settle()\n        }\n      }\n      doc?.addEventListener(\"pointerup\", endDrag, true)\n      doc?.addEventListener(\"pointercancel\", endDrag, true)\n      return () => {\n        clear()\n        doc?.removeEventListener(\"pointerup\", endDrag, true)\n        doc?.removeEventListener(\"pointercancel\", endDrag, true)\n      }\n    }, [clear, settle])\n    const context = React.useMemo(\n      () => ({ orientation, onScroll: pulse }),\n      [orientation, pulse]\n    )\n    const tracks =\n      orientation === \"both\"\n        ? ([\"vertical\", \"horizontal\"] as const)\n        : [orientation]\n    return (\n      <Context.Provider value={context}>\n        <Primitive.Root\n          {...props}\n          type=\"auto\"\n          ref={(node) => {\n            root.current = node\n            if (typeof ref === \"function\") ref(node)\n            else if (ref) ref.current = node\n          }}\n          data-slot=\"scroll-area\"\n          {...{ [SLOT_ATTR]: \"scroll-area\" }}\n          data-orientation={orientation}\n          data-revealed={visibility === \"always\" || revealed}\n          className={mergeClasses(styles.root, className)}\n          onPointerEnter={(event) => {\n            if (event.pointerType !== \"touch\") {\n              interaction.current.hover = true\n              reveal()\n            }\n            onPointerEnter?.(event)\n          }}\n          onPointerLeave={(event) => {\n            interaction.current.hover = false\n            settle()\n            onPointerLeave?.(event)\n          }}\n          onFocusCapture={(event) => {\n            interaction.current.focus = true\n            reveal()\n            onFocusCapture?.(event)\n          }}\n          onBlurCapture={(event) => {\n            if (!event.currentTarget.contains(event.relatedTarget)) {\n              interaction.current.focus = false\n              settle()\n            }\n            onBlurCapture?.(event)\n          }}\n        >\n          {children}\n          {tracks.map((axis) => (\n            <Primitive.Scrollbar\n              key={axis}\n              orientation={axis}\n              data-slot=\"scroll-area-scrollbar\"\n              {...{ [SLOT_ATTR]: \"scroll-area-scrollbar\" }}\n              className={mergeClasses(\n                scrollbar.track,\n                styles.track,\n                styles[axis]\n              )}\n              onPointerDown={() => {\n                interaction.current.drag = true\n                reveal()\n              }}\n            >\n              <Primitive.Thumb\n                data-slot=\"scroll-area-thumb\"\n                {...{ [SLOT_ATTR]: \"scroll-area-thumb\" }}\n                className={mergeClasses(scrollbar.thumb, styles.thumb)}\n              />\n            </Primitive.Scrollbar>\n          ))}\n          {orientation === \"both\" && (\n            <Primitive.Corner className={styles.corner} />\n          )}\n        </Primitive.Root>\n      </Context.Provider>\n    )\n  }\n)\n\n/** Put keyboard focus, accessible naming and onScroll on this actual scroll element. */\nexport const ScrollAreaViewport = React.forwardRef<\n  HTMLDivElement,\n  ScrollAreaViewportProps\n>(function ScrollAreaViewport({ className, onScroll, ...props }, ref) {\n  const context = React.useContext(Context)\n  const styles = useStyles()\n  if (!context)\n    throw new Error(\"ScrollAreaViewport requires a ScrollArea parent\")\n  return (\n    <Primitive.Viewport\n      {...props}\n      ref={ref}\n      data-slot=\"scroll-area-viewport\"\n      {...{ [SLOT_ATTR]: \"scroll-area-viewport\" }}\n      className={mergeClasses(\n        styles.viewport,\n        context.orientation === \"vertical\" && styles.verticalContent,\n        context.orientation !== \"horizontal\" && styles.reserveVertical,\n        context.orientation !== \"vertical\" && styles.reserveHorizontal,\n        className\n      )}\n      onScroll={(event) => {\n        if (event.target === event.currentTarget) {\n          context.onScroll()\n          onScroll?.(event)\n        }\n      }}\n    />\n  )\n})\n"],"names":["Context","React","useStyles","makeZenithStyles","shorthands","SLOT_ATTR","tokens.semFocusRing","tokens.grayA10","tokens.grayA11","tokens.grayA9","ScrollArea","orientation","visibility","className","children","onPointerEnter","onPointerLeave","onFocusCapture","onBlurCapture","props","ref","styles","scrollbar","useScrollbarStyles","root","timer","interaction","revealed","setRevealed","clear","reveal","settle","pulse","doc","_a","endDrag","context","tracks","jsx","jsxs","Primitive.Root","node","mergeClasses","event","axis","Primitive.Scrollbar","Primitive.Thumb","Primitive.Corner","ScrollAreaViewport","onScroll","Primitive.Viewport"],"mappings":"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"}

package/dist/components/scroll-area/scrollbar-styles.js

@@ -0,0 +1,21 @@
+import { makeZenithStyles as e } from "../../styles/make-styles.js";
+import { shorthands as o } from "@epilot/zenith-runtime/v1";
+const i = e({
+  track: {
+    position: "relative",
+    display: "flex",
+    touchAction: "none",
+    userSelect: "none"
+  },
+  thumb: {
+    position: "relative",
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: "0%",
+    ...o.borderRadius("9999px")
+  }
+});
+export {
+  i as useScrollbarStyles
+};
+//# sourceMappingURL=scrollbar-styles.js.map

package/dist/components/scroll-area/scrollbar-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollbar-styles.js","sources":["../../../src/components/scroll-area/scrollbar-styles.ts"],"sourcesContent":["import { makeZenithStyles } from \"../../styles/make-styles\"\nimport { shorthands } from \"@epilot/zenith-runtime/v1\"\n\n/** Shared mechanics only. Each consumer owns its size, colour and visibility policy. */\nexport const useScrollbarStyles = makeZenithStyles({\n  track: {\n    position: \"relative\",\n    display: \"flex\",\n    touchAction: \"none\",\n    userSelect: \"none\",\n  },\n  thumb: {\n    position: \"relative\",\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    ...shorthands.borderRadius(\"9999px\"),\n  },\n})\n"],"names":["useScrollbarStyles","makeZenithStyles","shorthands"],"mappings":";;AAIO,MAAMA,IAAqBC,EAAiB;AAAA,EACjD,OAAO;AAAA,IACL,UAAU;AAAA,IACV,SAAS;AAAA,IACT,aAAa;AAAA,IACb,YAAY;AAAA,EAAA;AAAA,EAEd,OAAO;AAAA,IACL,UAAU;AAAA,IACV,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,GAAGC,EAAW,aAAa,QAAQ;AAAA,EAAA;AAEvC,CAAC;"}