streamator-react 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -47,6 +47,7 @@ const { logs, active } = useLogStream(url, {
47
47
  className="my-log" // appended to root class
48
48
  style={{}}
49
49
  renderEntry={(entry, i) => <div />} // fully custom row renderer
50
+ autoScroll={true} // set false to disable auto-scroll
50
51
  />
51
52
  ```
52
53
 
package/dist/index.cjs.js CHANGED
@@ -85,20 +85,20 @@ function LogPanel({
85
85
  maxHeight,
86
86
  className,
87
87
  style,
88
- renderEntry
88
+ renderEntry,
89
+ autoScroll = true
89
90
  }) {
90
- const bottomRef = react.useRef(null);
91
+ const panelRef = react.useRef(null);
91
92
  react.useEffect(() => {
92
- bottomRef.current?.scrollIntoView({
93
- behavior: "smooth"
94
- });
95
- }, [logs]);
93
+ if (autoScroll && panelRef.current) panelRef.current.scrollTop = panelRef.current.scrollHeight;
94
+ }, [logs, autoScroll]);
96
95
  if (!active && logs.length === 0) return null;
97
96
  const rootStyle = maxHeight ? {
98
97
  ...style,
99
98
  "--streamator-max-height": maxHeight
100
99
  } : style;
101
100
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
101
+ ref: panelRef,
102
102
  className: ["streamator-log", className].filter(Boolean).join(" "),
103
103
  style: rootStyle,
104
104
  children: [active && logs.length === 0 && /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -112,9 +112,7 @@ function LogPanel({
112
112
  }), /*#__PURE__*/jsxRuntime.jsx("span", {
113
113
  children: entry.text
114
114
  })]
115
- }, i)), /*#__PURE__*/jsxRuntime.jsx("div", {
116
- ref: bottomRef
117
- })]
115
+ }, i))]
118
116
  });
119
117
  }
120
118
 
package/dist/index.esm.js CHANGED
@@ -83,20 +83,20 @@ function LogPanel({
83
83
  maxHeight,
84
84
  className,
85
85
  style,
86
- renderEntry
86
+ renderEntry,
87
+ autoScroll = true
87
88
  }) {
88
- const bottomRef = useRef(null);
89
+ const panelRef = useRef(null);
89
90
  useEffect(() => {
90
- bottomRef.current?.scrollIntoView({
91
- behavior: "smooth"
92
- });
93
- }, [logs]);
91
+ if (autoScroll && panelRef.current) panelRef.current.scrollTop = panelRef.current.scrollHeight;
92
+ }, [logs, autoScroll]);
94
93
  if (!active && logs.length === 0) return null;
95
94
  const rootStyle = maxHeight ? {
96
95
  ...style,
97
96
  "--streamator-max-height": maxHeight
98
97
  } : style;
99
98
  return /*#__PURE__*/jsxs("div", {
99
+ ref: panelRef,
100
100
  className: ["streamator-log", className].filter(Boolean).join(" "),
101
101
  style: rootStyle,
102
102
  children: [active && logs.length === 0 && /*#__PURE__*/jsx("div", {
@@ -110,9 +110,7 @@ function LogPanel({
110
110
  }), /*#__PURE__*/jsx("span", {
111
111
  children: entry.text
112
112
  })]
113
- }, i)), /*#__PURE__*/jsx("div", {
114
- ref: bottomRef
115
- })]
113
+ }, i))]
116
114
  });
117
115
  }
118
116
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "streamator-react",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "description": "Frontend primitives for displaying live log streams",
5
5
  "author": "Arved Klöhn <arved.kloehn@gmail.com>",
6
6
  "license": "MIT",