@flytedan/flytebot-design-system 0.34.0 → 0.35.0

package/dist/index.js

@@ -3488,9 +3488,14 @@ function MultiSelectPanel({
   const [unmatchedTokens, setUnmatchedTokens] = React25.useState([]);
   const [pasteError, setPasteError] = React25.useState(null);
   const pasteWrapRef = React25.useRef(null);
+  const [resolvedAt, setResolvedAt] = React25.useState(0);
   React25.useEffect(() => {
     if (mode2 === "paste") pasteWrapRef.current?.querySelector("textarea")?.focus();
   }, [mode2]);
+  React25.useLayoutEffect(() => {
+    if (resolvedAt === 0) return;
+    pasteWrapRef.current?.querySelector("textarea")?.focus();
+  }, [resolvedAt]);
   const doResolve = () => {
     if (!field.resolve) return;
     const tokens = Array.from(new Set(pasteText.split(/[\n,]/).map((t) => t.trim()).filter(Boolean)));
@@ -3513,6 +3518,7 @@ function MultiSelectPanel({
         return;
       }
       setPasteText("");
+      setResolvedAt((n) => n + 1);
     }, (err) => {
       if (!mountedRef.current) return;
       setPasteLoading(false);
@@ -3700,6 +3706,20 @@ function useReseedFromProps(value, applies, reseed) {
     if (!sameValue(value, applies())) reseed(value);
   }, [value, applies, reseed]);
 }
+function usePreserveFocusAcrossRemount(seed) {
+  const pendingId = React25.useRef(null);
+  const capture = (ids) => {
+    const active = document.activeElement;
+    pendingId.current = active instanceof HTMLElement && ids.includes(active.id) ? active.id : null;
+  };
+  React25.useLayoutEffect(() => {
+    const id = pendingId.current;
+    if (!id) return;
+    pendingId.current = null;
+    document.getElementById(id)?.focus();
+  }, [seed]);
+  return capture;
+}
 var rangeDraft = (value) => ({ min: value?.min, max: value?.max });
 function RangePanel({
   field,
@@ -3710,6 +3730,9 @@ function RangePanel({
 }) {
   const [draft, setDraft] = React25.useState(() => rangeDraft(value));
   const [seed, setSeed] = React25.useState(0);
+  const preserveFocus = usePreserveFocusAcrossRemount(seed);
+  const minId = field.key + "-min";
+  const maxId = field.key + "-max";
   const draftRef = React25.useRef(draft);
   const shown = () => {
     const { min, max } = draftRef.current;
@@ -3720,6 +3743,7 @@ function RangePanel({
   };
   const validity = useTextValidity(publish);
   useReseedFromProps(value, shown, (next) => {
+    preserveFocus([minId, maxId]);
     draftRef.current = rangeDraft(next);
     setDraft(draftRef.current);
     validity.reset();
@@ -3752,6 +3776,7 @@ function RangePanel({
         /* @__PURE__ */ jsx45(
           NumberInput,
           {
+            id: minId,
             label: field.minLabel || "At least",
             value: draftMin ?? "",
             min: field.min,
@@ -3767,6 +3792,7 @@ function RangePanel({
         /* @__PURE__ */ jsx45(
           NumberInput,
           {
+            id: maxId,
             label: field.maxLabel || "At most",
             value: draftMax ?? "",
             min: field.min,
@@ -3806,6 +3832,8 @@ function DatePanel({
   const daysConfirmed = React25.useRef(value?.kind === "withinDays");
   const [between, setBetween] = React25.useState(initial.between);
   const [seed, setSeed] = React25.useState(0);
+  const preserveFocus = usePreserveFocusAcrossRemount(seed);
+  const daysId = field.key + "-days";
   const shownWithinDays = () => {
     const days = daysRef.current;
     return applicable(field, days == null ? void 0 : { kind: "withinDays", days }, validity.allValid());
@@ -3821,6 +3849,7 @@ function DatePanel({
     return daysConfirmed.current ? shownWithinDays() : void 0;
   };
   useReseedFromProps(value, applies, (next) => {
+    preserveFocus([daysId]);
     const d = dateDraft(field, next);
     setKind(d.kind);
     daysRef.current = d.days;
@@ -3890,6 +3919,7 @@ function DatePanel({
         kind === "withinDays" ? /* @__PURE__ */ jsx45(
           NumberInput,
           {
+            id: daysId,
             label: "Days",
             min: 1,
             max: maxDays,