@lumiastream/ui 0.9.1 → 0.9.5

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.
@@ -470,6 +470,8 @@ function ChatboxPanel({
470
470
  const prevCountRef = useRef2(0);
471
471
  const prevLastKeyRef = useRef2(null);
472
472
  const hasInitializedRef = useRef2(false);
473
+ const rootRef = useRef2(null);
474
+ const wasReplyingRef = useRef2(false);
473
475
  const lineHeight = Math.round(fontSize * 1.35);
474
476
  const isControlled = sendValue !== void 0 || onSendValueChange !== void 0;
475
477
  const inputValue = (isControlled ? sendValue : internalValue) ?? "";
@@ -479,6 +481,13 @@ function ChatboxPanel({
479
481
  useEffect(() => {
480
482
  scrollToBottom();
481
483
  }, [messageCount, lastMessageKey, scrollToBottom]);
484
+ useEffect(() => {
485
+ const isReplying = Boolean(replyingTo);
486
+ if (isReplying && !wasReplyingRef.current) {
487
+ rootRef.current?.querySelector(".ls-chatbox__input input")?.focus();
488
+ }
489
+ wasReplyingRef.current = isReplying;
490
+ }, [replyingTo]);
482
491
  useEffect(() => {
483
492
  scrollToBottom(true);
484
493
  }, [reverse, scrollToBottom]);
@@ -526,7 +535,7 @@ function ChatboxPanel({
526
535
  setInternalValue("");
527
536
  }
528
537
  };
529
- return /* @__PURE__ */ jsxs2("div", { className: classNames4("ls-chatbox", className), id, children: [
538
+ return /* @__PURE__ */ jsxs2("div", { ref: rootRef, className: classNames4("ls-chatbox", className), id, children: [
530
539
  /* @__PURE__ */ jsxs2("div", { className: "ls-chatbox__viewport", children: [
531
540
  /* @__PURE__ */ jsx5(
532
541
  "div",
@@ -3361,6 +3361,8 @@ function ChatboxPanel({
3361
3361
  const prevCountRef = useRef6(0);
3362
3362
  const prevLastKeyRef = useRef6(null);
3363
3363
  const hasInitializedRef = useRef6(false);
3364
+ const rootRef = useRef6(null);
3365
+ const wasReplyingRef = useRef6(false);
3364
3366
  const lineHeight = Math.round(fontSize * 1.35);
3365
3367
  const isControlled = sendValue !== void 0 || onSendValueChange !== void 0;
3366
3368
  const inputValue = (isControlled ? sendValue : internalValue) ?? "";
@@ -3370,6 +3372,13 @@ function ChatboxPanel({
3370
3372
  useEffect6(() => {
3371
3373
  scrollToBottom();
3372
3374
  }, [messageCount, lastMessageKey, scrollToBottom]);
3375
+ useEffect6(() => {
3376
+ const isReplying = Boolean(replyingTo);
3377
+ if (isReplying && !wasReplyingRef.current) {
3378
+ rootRef.current?.querySelector(".ls-chatbox__input input")?.focus();
3379
+ }
3380
+ wasReplyingRef.current = isReplying;
3381
+ }, [replyingTo]);
3373
3382
  useEffect6(() => {
3374
3383
  scrollToBottom(true);
3375
3384
  }, [reverse, scrollToBottom]);
@@ -3417,7 +3426,7 @@ function ChatboxPanel({
3417
3426
  setInternalValue("");
3418
3427
  }
3419
3428
  };
3420
- return /* @__PURE__ */ jsxs9("div", { className: classNames7("ls-chatbox", className), id, children: [
3429
+ return /* @__PURE__ */ jsxs9("div", { ref: rootRef, className: classNames7("ls-chatbox", className), id, children: [
3421
3430
  /* @__PURE__ */ jsxs9("div", { className: "ls-chatbox__viewport", children: [
3422
3431
  /* @__PURE__ */ jsx19(
3423
3432
  "div",
package/dist/index.js CHANGED
@@ -3361,6 +3361,8 @@ function ChatboxPanel({
3361
3361
  const prevCountRef = useRef6(0);
3362
3362
  const prevLastKeyRef = useRef6(null);
3363
3363
  const hasInitializedRef = useRef6(false);
3364
+ const rootRef = useRef6(null);
3365
+ const wasReplyingRef = useRef6(false);
3364
3366
  const lineHeight = Math.round(fontSize * 1.35);
3365
3367
  const isControlled = sendValue !== void 0 || onSendValueChange !== void 0;
3366
3368
  const inputValue = (isControlled ? sendValue : internalValue) ?? "";
@@ -3370,6 +3372,13 @@ function ChatboxPanel({
3370
3372
  useEffect6(() => {
3371
3373
  scrollToBottom();
3372
3374
  }, [messageCount, lastMessageKey, scrollToBottom]);
3375
+ useEffect6(() => {
3376
+ const isReplying = Boolean(replyingTo);
3377
+ if (isReplying && !wasReplyingRef.current) {
3378
+ rootRef.current?.querySelector(".ls-chatbox__input input")?.focus();
3379
+ }
3380
+ wasReplyingRef.current = isReplying;
3381
+ }, [replyingTo]);
3373
3382
  useEffect6(() => {
3374
3383
  scrollToBottom(true);
3375
3384
  }, [reverse, scrollToBottom]);
@@ -3417,7 +3426,7 @@ function ChatboxPanel({
3417
3426
  setInternalValue("");
3418
3427
  }
3419
3428
  };
3420
- return /* @__PURE__ */ jsxs9("div", { className: classNames7("ls-chatbox", className), id, children: [
3429
+ return /* @__PURE__ */ jsxs9("div", { ref: rootRef, className: classNames7("ls-chatbox", className), id, children: [
3421
3430
  /* @__PURE__ */ jsxs9("div", { className: "ls-chatbox__viewport", children: [
3422
3431
  /* @__PURE__ */ jsx19(
3423
3432
  "div",
package/dist/se-import.js CHANGED
@@ -7894,6 +7894,8 @@ function ChatboxPanel({
7894
7894
  const prevCountRef = useRef6(0);
7895
7895
  const prevLastKeyRef = useRef6(null);
7896
7896
  const hasInitializedRef = useRef6(false);
7897
+ const rootRef = useRef6(null);
7898
+ const wasReplyingRef = useRef6(false);
7897
7899
  const lineHeight = Math.round(fontSize * 1.35);
7898
7900
  const isControlled = sendValue !== void 0 || onSendValueChange !== void 0;
7899
7901
  const inputValue = (isControlled ? sendValue : internalValue) ?? "";
@@ -7903,6 +7905,13 @@ function ChatboxPanel({
7903
7905
  useEffect6(() => {
7904
7906
  scrollToBottom();
7905
7907
  }, [messageCount, lastMessageKey, scrollToBottom]);
7908
+ useEffect6(() => {
7909
+ const isReplying = Boolean(replyingTo);
7910
+ if (isReplying && !wasReplyingRef.current) {
7911
+ rootRef.current?.querySelector(".ls-chatbox__input input")?.focus();
7912
+ }
7913
+ wasReplyingRef.current = isReplying;
7914
+ }, [replyingTo]);
7906
7915
  useEffect6(() => {
7907
7916
  scrollToBottom(true);
7908
7917
  }, [reverse, scrollToBottom]);
@@ -7950,7 +7959,7 @@ function ChatboxPanel({
7950
7959
  setInternalValue("");
7951
7960
  }
7952
7961
  };
7953
- return /* @__PURE__ */ jsxs9("div", { className: classNames7("ls-chatbox", className), id, children: [
7962
+ return /* @__PURE__ */ jsxs9("div", { ref: rootRef, className: classNames7("ls-chatbox", className), id, children: [
7954
7963
  /* @__PURE__ */ jsxs9("div", { className: "ls-chatbox__viewport", children: [
7955
7964
  /* @__PURE__ */ jsx19(
7956
7965
  "div",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lumiastream/ui",
3
- "version": "0.9.1",
3
+ "version": "0.9.5",
4
4
  "author": "Lumia Stream",
5
5
  "license": "ISC",
6
6
  "description": "Lumia UI Kit",
@@ -196,7 +196,7 @@
196
196
  "vitest": "^4.1.6"
197
197
  },
198
198
  "dependencies": {
199
- "@lumiastream/lumia-translations": "1.19.2",
199
+ "@lumiastream/lumia-translations": "1.19.3",
200
200
  "@lumiastream/lumia-types": "3.9.0",
201
201
  "classnames": "^2.5.1",
202
202
  "globals": "^17.4.0",