npm - @smwb/ui-react - Versions diffs - 2.0.1 → 2.0.2 - Mend

@smwb/ui-react 2.0.1 → 2.0.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.

Files changed (8) hide show

package/README.md +5 -5
package/dist/components/layout/screenDivider/screenDivider.js +47 -56
package/dist/components/layout/screenDivider/screenDivider.js.map +1 -1
package/dist/headless/components/layout/screenDivider/screenDivider.js +47 -56
package/dist/headless/components/layout/screenDivider/screenDivider.js.map +1 -1
package/dist/index.cjs +2 -2
package/dist/index.cjs.map +1 -1
package/package.json +1 -1

package/README.md CHANGED Viewed

@@ -9,11 +9,11 @@ runtime light/dark theming and LESS-based customization. Part of the `@smwb` des
 | Package | What it is |
 | --- | --- |
-| **`@smwb/ui-react`** | This package — React components. |
-| `@smwb/ui-solid` | SolidJS port, same design system and class names. |
-| `@smwb/ui-styles` | Framework-agnostic **LESS source** + design tokens (`smwb-*`). |
-| `@smwb/ui-css` | **Prebuilt aggregate stylesheet** (`import "@smwb/ui-css"`). |
-| `@smwb/ui-mcp-react` | MCP server exposing this catalog to AI tools. |
+| [**`@smwb/ui-react`**](https://www.npmjs.com/package/@smwb/ui-react) | This package — React components. |
+| [`@smwb/ui-solid`](https://www.npmjs.com/package/@smwb/ui-solid) | SolidJS port, same design system and class names. |
+| [`@smwb/ui-styles`](https://www.npmjs.com/package/@smwb/ui-styles) | Framework-agnostic **LESS source** + design tokens (`smwb-*`). |
+| [`@smwb/ui-css`](https://www.npmjs.com/package/@smwb/ui-css) | **Prebuilt aggregate stylesheet** (`import "@smwb/ui-css"`). |
+| [`@smwb/ui-mcp-react`](https://www.npmjs.com/package/@smwb/ui-mcp-react) | MCP server exposing this catalog to AI tools. |
 ## Component catalog

package/dist/components/layout/screenDivider/screenDivider.js CHANGED Viewed

@@ -1,89 +1,80 @@
-import { jsxs as I, jsx as h } from "react/jsx-runtime";
+import { jsxs as B, jsx as w } from "react/jsx-runtime";
 import '../../../assets/styles/less/components/screenDivider/screenDivider.entry.css';/* empty css                                                                     */
-import { forwardRef as j, useRef as P, useState as y, useEffect as b, Children as X, useMemo as Y, useCallback as O } from "react";
+import { forwardRef as C, useRef as O, useState as y, useEffect as b, Children as P, useMemo as U, useCallback as W } from "react";
 import D from "clsx";
-import { throttle as T } from "../../../utils/throttle.js";
-import { useForkRef as U } from "../../../hooks/useForkRef.js";
-const _ = (o, d) => d * (o / 100), x = (o, d) => !o && d ? 100 - d : o || 50, V = j(function({
+import { throttle as X } from "../../../utils/throttle.js";
+import { useForkRef as Y } from "../../../hooks/useForkRef.js";
+const x = (c, d) => !c && d ? 100 - d : c || 50, Z = C(function({
   className: d,
   orientation: e = "horizontal",
-  sizeFirst: m,
+  sizeFirst: f,
   sizeSecond: v,
-  children: $,
-  onSizeChange: a,
+  children: L,
+  onSizeChange: i,
   keyboardStep: g = 5,
-  resizerAriaLabel: k = "Resize panels"
-}, A) {
-  const p = P(null), M = U(A, p), [i, l] = y(x(m, v)), [E, L] = y(null), [f, R] = y(!1);
+  resizerAriaLabel: $ = "Resize panels"
+}, k) {
+  const p = O(null), A = Y(k, p), [t, n] = y(x(f, v)), [E, R] = y(null), [m, _] = y(!1);
   b(() => {
-    l(x(m, v));
-  }, [m, v]);
-  const w = X.toArray($);
-  if (w.length > 2)
+    n(x(f, v));
+  }, [f, v]);
+  const h = P.toArray(L);
+  if (h.length > 2)
     throw new Error("Allowed not more than 2 children");
-  const K = () => {
-    L(p.current), R(!0);
-  }, c = Y(
-    () => T((r) => {
-      if (!f) return;
-      const n = p.current;
-      if (!(!n || n !== E))
-        if (e === "vertical") {
-          let s = r.clientY - n.offsetTop;
-          s < 0 && (s = 0);
-          const t = s / n.clientHeight * 100;
-          _(t, n.clientWidth) > 5 && t < 101 && l(t - 7);
-        } else {
-          let s = r.clientX - n.offsetLeft;
-          s < 0 && (s = 0);
-          const t = s / n.clientWidth * 100;
-          _(t, n.clientWidth) > 5 && t < 101 && l(t);
-        }
+  const M = () => {
+    R(p.current), _(!0);
+  }, o = U(
+    () => X((r) => {
+      if (!m) return;
+      const a = p.current;
+      if (!a || a !== E) return;
+      const s = a.getBoundingClientRect(), l = e === "vertical" ? s.height : s.width, j = e === "vertical" ? r.clientY - s.top : r.clientX - s.left, H = Math.max(5, Math.min(l - 5, j));
+      n(H / l * 100);
     }, 1e3 / 60),
-    [f, E, e]
-  ), u = O(() => {
-    L(null), R(!1), document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", c);
-  }, [c]);
+    [m, E, e]
+  ), u = W(() => {
+    R(null), _(!1), document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", o);
+  }, [o]);
   b(() => {
-    a == null || a(i);
-  }, [i, a]);
-  const N = (r) => {
-    const n = e === "vertical" ? "ArrowUp" : "ArrowLeft", s = e === "vertical" ? "ArrowDown" : "ArrowRight";
-    r.key === n ? (r.preventDefault(), l((t) => Math.max(0, t - g))) : r.key === s ? (r.preventDefault(), l((t) => Math.min(100, t + g))) : r.key === "Home" ? (r.preventDefault(), l(0)) : r.key === "End" && (r.preventDefault(), l(100));
-  }, W = e === "vertical" ? { height: `${100 - i}%` } : { width: `${100 - i}%` }, H = e === "vertical" ? { height: `${i}%` } : { width: `${i}%` };
-  return b(() => (f ? (document.body.addEventListener("pointerup", u), document.body.addEventListener("pointermove", c), document.body.style.cursor = e === "horizontal" ? "e-resize" : "n-resize") : document.body.style.cursor = "default", () => {
-    document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", c);
-  }), [c, u, f, e]), /* @__PURE__ */ I(
+    i == null || i(t);
+  }, [t, i]);
+  const K = (r) => {
+    const a = e === "vertical" ? "ArrowUp" : "ArrowLeft", s = e === "vertical" ? "ArrowDown" : "ArrowRight";
+    r.key === a ? (r.preventDefault(), n((l) => Math.max(0, l - g))) : r.key === s ? (r.preventDefault(), n((l) => Math.min(100, l + g))) : r.key === "Home" ? (r.preventDefault(), n(0)) : r.key === "End" && (r.preventDefault(), n(100));
+  }, N = e === "vertical" ? { height: `${100 - t}%` } : { width: `${100 - t}%` }, I = e === "vertical" ? { height: `${t}%` } : { width: `${t}%` };
+  return b(() => (m ? (document.body.addEventListener("pointerup", u), document.body.addEventListener("pointermove", o), document.body.style.cursor = e === "horizontal" ? "e-resize" : "n-resize") : document.body.style.cursor = "default", () => {
+    document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", o);
+  }), [o, u, m, e]), /* @__PURE__ */ B(
     "div",
     {
       className: D("smwb-screen-divider__wrapper", `smwb-${e}`, d),
-      ref: M,
+      ref: A,
       "data-testid": "screen-divider",
       children: [
-        /* @__PURE__ */ h("div", { className: D("smwb-screen-divider__first", `smwb-${e}`), style: H, children: w[0] || "" }),
-        /* @__PURE__ */ h(
+        /* @__PURE__ */ w("div", { className: D("smwb-screen-divider__first", `smwb-${e}`), style: I, children: h[0] || "" }),
+        /* @__PURE__ */ w(
           "span",
           {
             className: "smwb-screen-divider__resizer",
-            onPointerDown: K,
+            onPointerDown: M,
             draggable: !1,
             role: "separator",
             "aria-orientation": e === "vertical" ? "horizontal" : "vertical",
-            "aria-valuenow": Math.round(i),
+            "aria-valuenow": Math.round(t),
             "aria-valuemin": 0,
             "aria-valuemax": 100,
-            "aria-label": k,
+            "aria-label": $,
             tabIndex: 0,
-            onKeyDown: N
+            onKeyDown: K
           }
         ),
-        /* @__PURE__ */ h("div", { className: D("smwb-screen-divider__second", `smwb-${e}`), style: W, children: w[1] || "" })
+        /* @__PURE__ */ w("div", { className: D("smwb-screen-divider__second", `smwb-${e}`), style: N, children: h[1] || "" })
       ]
     }
   );
 });
 export {
-  V as ScreenDivider,
-  V as default
+  Z as ScreenDivider,
+  Z as default
 };
 //# sourceMappingURL=screenDivider.js.map

package/dist/components/layout/screenDivider/screenDivider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"screenDivider.js","sources":["../../../../src/components/layout/screenDivider/screenDivider.tsx"],"sourcesContent":["import React, {\n Children,\n forwardRef,\n KeyboardEvent,\n PropsWithChildren,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport cn from \"clsx\";\nimport { throttle } from \"../../../utils/throttle\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\n\nexport interface ScreenDividerProps {\n sizeFirst?: number;\n sizeSecond?: number;\n className?: string;\n orientation?: \"horizontal\" \| \"vertical\";\n /** Called with the first pane size (percent) whenever it changes. /\n onSizeChange?: (sizeFirst: number) => void;\n /* Step (in percent) applied on arrow-key resize. /\n keyboardStep?: number;\n /* Accessible label for the resizer handle. /\n resizerAriaLabel?: string;\n}\n\nconst toPixels = (percent: number, parentSize: number) => {\n return parentSize (percent / 100);\n};\n\nconst getInitialDivider = (sizeFirst?: number \| null, sizeSecond?: number \| null) => {\n if (!sizeFirst && sizeSecond) {\n return 100 - sizeSecond;\n }\n if (sizeFirst) {\n return sizeFirst;\n }\n return 50;\n};\n\nexport const ScreenDivider = forwardRef<HTMLDivElement, PropsWithChildren<ScreenDividerProps>>(function ScreenDivider(\n {\n className,\n orientation = \"horizontal\",\n sizeFirst,\n sizeSecond,\n children,\n onSizeChange,\n keyboardStep = 5,\n resizerAriaLabel = \"Resize panels\",\n },\n ref\n) {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const forkedWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const [divider, setDivider] = useState<number>(getInitialDivider(sizeFirst, sizeSecond));\n const [currentElement, setCurrentElement] = useState<HTMLDivElement \| null>(null);\n const [isDragging, setIsDragging] = useState(false);\n\n useEffect(() => {\n setDivider(getInitialDivider(sizeFirst, sizeSecond));\n }, [sizeFirst, sizeSecond]);\n\n const child = Children.toArray(children);\n if (child.length > 2) {\n throw new Error(\"Allowed not more than 2 children\");\n }\n\n const handleDragStart = () => {\n setCurrentElement(wrapperRef.current);\n setIsDragging(true);\n };\n\n const dragOverHandler = useMemo(\n () =>\n throttle((e: PointerEvent) => {\n if (!isDragging) return;\n\n const wrapper = wrapperRef.current;\n if (!wrapper \|\| wrapper !== currentElement) return;\n if (orientation === \"vertical\") {\n let relativeMouseY = e.clientY - wrapper.offsetTop;\n if (relativeMouseY < 0) {\n relativeMouseY = 0;\n }\n const newDivider = (relativeMouseY / wrapper.clientHeight) * 100;\n if (toPixels(newDivider, wrapper.clientWidth) > 5 && newDivider < 101) {\n setDivider(newDivider - 7);\n }\n } else {\n let relativeMouseX = e.clientX - wrapper.offsetLeft;\n if (relativeMouseX < 0) {\n relativeMouseX = 0;\n }\n const newDivider = (relativeMouseX / wrapper.clientWidth) * 100;\n if (toPixels(newDivider, wrapper.clientWidth) > 5 && newDivider < 101) {\n setDivider(newDivider);\n }\n }\n }, 1000 / 60),\n [isDragging, currentElement, orientation]\n );\n\n const handleDragEnd = useCallback(() => {\n setCurrentElement(null);\n setIsDragging(false);\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n }, [dragOverHandler]);\n\n useEffect(() => {\n onSizeChange?.(divider);\n }, [divider, onSizeChange]);\n\n const onResizerKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {\n const decreaseKey = orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n const increaseKey = orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n\n if (event.key === decreaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.max(0, prev - keyboardStep));\n } else if (event.key === increaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.min(100, prev + keyboardStep));\n } else if (event.key === \"Home\") {\n event.preventDefault();\n setDivider(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n setDivider(100);\n }\n };\n\n const secondChildStyle =\n orientation === \"vertical\" ? { height: `${100 - divider}%` } : { width: `${100 - divider}%` };\n\n const firstChildStyle = orientation === \"vertical\" ? { height: `${divider}%` } : { width: `${divider}%` };\n\n useEffect(() => {\n if (isDragging) {\n document.body.addEventListener(\"pointerup\", handleDragEnd);\n document.body.addEventListener(\"pointermove\", dragOverHandler);\n document.body.style.cursor = orientation === \"horizontal\" ? \"e-resize\" : \"n-resize\";\n } else {\n document.body.style.cursor = \"default\";\n }\n\n return () => {\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n };\n }, [dragOverHandler, handleDragEnd, isDragging, orientation]);\n\n return (\n <div\n className={cn(\"smwb-screen-divider__wrapper\", `smwb-${orientation}`, className)}\n ref={forkedWrapperRef}\n data-testid=\"screen-divider\"\n >\n <div className={cn(\"smwb-screen-divider__first\", `smwb-${orientation}`)} style={firstChildStyle}>\n {child[0] \|\| \"\"}\n </div>\n <span\n className=\"smwb-screen-divider__resizer\"\n onPointerDown={handleDragStart}\n draggable={false}\n role=\"separator\"\n aria-orientation={orientation === \"vertical\" ? \"horizontal\" : \"vertical\"}\n aria-valuenow={Math.round(divider)}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-label={resizerAriaLabel}\n tabIndex={0}\n onKeyDown={onResizerKeyDown}\n />\n <div className={cn(\"smwb-screen-divider__second\", `smwb-${orientation}`)} style={secondChildStyle}>\n {child[1] \|\| \"\"}\n </div>\n </div>\n );\n});\n\nexport default ScreenDivider;\n"],"names":["toPixels","percent","parentSize","getInitialDivider","sizeFirst","sizeSecond","ScreenDivider","forwardRef","className","orientation","children","onSizeChange","keyboardStep","resizerAriaLabel","ref","wrapperRef","useRef","forkedWrapperRef","useForkRef","divider","setDivider","useState","currentElement","setCurrentElement","isDragging","setIsDragging","useEffect","child","Children","handleDragStart","dragOverHandler","useMemo","throttle","e","wrapper","relativeMouseY","newDivider","relativeMouseX","handleDragEnd","useCallback","onResizerKeyDown","event","decreaseKey","increaseKey","prev","secondChildStyle","firstChildStyle","jsxs","cn","jsx"],"mappings":"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"}
1	+ {"version":3,"file":"screenDivider.js","sources":["../../../../src/components/layout/screenDivider/screenDivider.tsx"],"sourcesContent":["import React, {\n Children,\n forwardRef,\n KeyboardEvent,\n PropsWithChildren,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport cn from \"clsx\";\nimport { throttle } from \"../../../utils/throttle\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\n\nexport interface ScreenDividerProps {\n sizeFirst?: number;\n sizeSecond?: number;\n className?: string;\n orientation?: \"horizontal\" \| \"vertical\";\n /** Called with the first pane size (percent) whenever it changes. /\n onSizeChange?: (sizeFirst: number) => void;\n /* Step (in percent) applied on arrow-key resize. /\n keyboardStep?: number;\n /* Accessible label for the resizer handle. /\n resizerAriaLabel?: string;\n}\n\nconst getInitialDivider = (sizeFirst?: number \| null, sizeSecond?: number \| null) => {\n if (!sizeFirst && sizeSecond) {\n return 100 - sizeSecond;\n }\n if (sizeFirst) {\n return sizeFirst;\n }\n return 50;\n};\n\nexport const ScreenDivider = forwardRef<HTMLDivElement, PropsWithChildren<ScreenDividerProps>>(function ScreenDivider(\n {\n className,\n orientation = \"horizontal\",\n sizeFirst,\n sizeSecond,\n children,\n onSizeChange,\n keyboardStep = 5,\n resizerAriaLabel = \"Resize panels\",\n },\n ref\n) {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const forkedWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const [divider, setDivider] = useState<number>(getInitialDivider(sizeFirst, sizeSecond));\n const [currentElement, setCurrentElement] = useState<HTMLDivElement \| null>(null);\n const [isDragging, setIsDragging] = useState(false);\n\n useEffect(() => {\n setDivider(getInitialDivider(sizeFirst, sizeSecond));\n }, [sizeFirst, sizeSecond]);\n\n const child = Children.toArray(children);\n if (child.length > 2) {\n throw new Error(\"Allowed not more than 2 children\");\n }\n\n const handleDragStart = () => {\n setCurrentElement(wrapperRef.current);\n setIsDragging(true);\n };\n\n const dragOverHandler = useMemo(\n () =>\n throttle((e: PointerEvent) => {\n if (!isDragging) return;\n const wrapper = wrapperRef.current;\n if (!wrapper \|\| wrapper !== currentElement) return;\n // Viewport-relative rect — using offsetLeft/offsetTop here is wrong\n // because they are relative to the nearest positioned ancestor, not\n // the viewport that clientX/clientY live in (this is what made the\n // divider drift away from the cursor when the wrapper was nested).\n const rect = wrapper.getBoundingClientRect();\n const total = orientation === \"vertical\" ? rect.height : rect.width;\n const cursor = orientation === \"vertical\" ? e.clientY - rect.top : e.clientX - rect.left;\n // 5px margin on each side so neither pane fully collapses.\n const clamped = Math.max(5, Math.min(total - 5, cursor));\n setDivider((clamped / total) 100);\n }, 1000 / 60),\n [isDragging, currentElement, orientation]\n );\n\n const handleDragEnd = useCallback(() => {\n setCurrentElement(null);\n setIsDragging(false);\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n }, [dragOverHandler]);\n\n useEffect(() => {\n onSizeChange?.(divider);\n }, [divider, onSizeChange]);\n\n const onResizerKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {\n const decreaseKey = orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n const increaseKey = orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n\n if (event.key === decreaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.max(0, prev - keyboardStep));\n } else if (event.key === increaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.min(100, prev + keyboardStep));\n } else if (event.key === \"Home\") {\n event.preventDefault();\n setDivider(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n setDivider(100);\n }\n };\n\n const secondChildStyle =\n orientation === \"vertical\" ? { height: `${100 - divider}%` } : { width: `${100 - divider}%` };\n\n const firstChildStyle = orientation === \"vertical\" ? { height: `${divider}%` } : { width: `${divider}%` };\n\n useEffect(() => {\n if (isDragging) {\n document.body.addEventListener(\"pointerup\", handleDragEnd);\n document.body.addEventListener(\"pointermove\", dragOverHandler);\n document.body.style.cursor = orientation === \"horizontal\" ? \"e-resize\" : \"n-resize\";\n } else {\n document.body.style.cursor = \"default\";\n }\n\n return () => {\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n };\n }, [dragOverHandler, handleDragEnd, isDragging, orientation]);\n\n return (\n <div\n className={cn(\"smwb-screen-divider__wrapper\", `smwb-${orientation}`, className)}\n ref={forkedWrapperRef}\n data-testid=\"screen-divider\"\n >\n <div className={cn(\"smwb-screen-divider__first\", `smwb-${orientation}`)} style={firstChildStyle}>\n {child[0] \|\| \"\"}\n </div>\n <span\n className=\"smwb-screen-divider__resizer\"\n onPointerDown={handleDragStart}\n draggable={false}\n role=\"separator\"\n aria-orientation={orientation === \"vertical\" ? \"horizontal\" : \"vertical\"}\n aria-valuenow={Math.round(divider)}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-label={resizerAriaLabel}\n tabIndex={0}\n onKeyDown={onResizerKeyDown}\n />\n <div className={cn(\"smwb-screen-divider__second\", `smwb-${orientation}`)} style={secondChildStyle}>\n {child[1] \|\| \"\"}\n </div>\n </div>\n );\n});\n\nexport default ScreenDivider;\n"],"names":["getInitialDivider","sizeFirst","sizeSecond","ScreenDivider","forwardRef","className","orientation","children","onSizeChange","keyboardStep","resizerAriaLabel","ref","wrapperRef","useRef","forkedWrapperRef","useForkRef","divider","setDivider","useState","currentElement","setCurrentElement","isDragging","setIsDragging","useEffect","child","Children","handleDragStart","dragOverHandler","useMemo","throttle","e","wrapper","rect","total","cursor","clamped","handleDragEnd","useCallback","onResizerKeyDown","event","decreaseKey","increaseKey","prev","secondChildStyle","firstChildStyle","jsxs","cn","jsx"],"mappings":"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"}

package/dist/headless/components/layout/screenDivider/screenDivider.js CHANGED Viewed

@@ -1,88 +1,79 @@
-import { jsxs as I, jsx as h } from "react/jsx-runtime";
-import { forwardRef as j, useRef as P, useState as y, useEffect as b, Children as X, useMemo as Y, useCallback as O } from "react";
+import { jsxs as B, jsx as w } from "react/jsx-runtime";
+import { forwardRef as C, useRef as O, useState as y, useEffect as b, Children as P, useMemo as U, useCallback as W } from "react";
 import D from "clsx";
-import { throttle as T } from "../../../utils/throttle.js";
-import { useForkRef as U } from "../../../hooks/useForkRef.js";
-const _ = (o, d) => d * (o / 100), x = (o, d) => !o && d ? 100 - d : o || 50, Q = j(function({
+import { throttle as X } from "../../../utils/throttle.js";
+import { useForkRef as Y } from "../../../hooks/useForkRef.js";
+const x = (c, d) => !c && d ? 100 - d : c || 50, V = C(function({
   className: d,
   orientation: e = "horizontal",
-  sizeFirst: m,
+  sizeFirst: f,
   sizeSecond: v,
-  children: $,
-  onSizeChange: a,
+  children: L,
+  onSizeChange: i,
   keyboardStep: g = 5,
-  resizerAriaLabel: k = "Resize panels"
-}, A) {
-  const p = P(null), M = U(A, p), [i, l] = y(x(m, v)), [E, L] = y(null), [f, R] = y(!1);
+  resizerAriaLabel: $ = "Resize panels"
+}, k) {
+  const p = O(null), A = Y(k, p), [t, n] = y(x(f, v)), [E, R] = y(null), [m, _] = y(!1);
   b(() => {
-    l(x(m, v));
-  }, [m, v]);
-  const w = X.toArray($);
-  if (w.length > 2)
+    n(x(f, v));
+  }, [f, v]);
+  const h = P.toArray(L);
+  if (h.length > 2)
     throw new Error("Allowed not more than 2 children");
-  const K = () => {
-    L(p.current), R(!0);
-  }, c = Y(
-    () => T((r) => {
-      if (!f) return;
-      const n = p.current;
-      if (!(!n || n !== E))
-        if (e === "vertical") {
-          let s = r.clientY - n.offsetTop;
-          s < 0 && (s = 0);
-          const t = s / n.clientHeight * 100;
-          _(t, n.clientWidth) > 5 && t < 101 && l(t - 7);
-        } else {
-          let s = r.clientX - n.offsetLeft;
-          s < 0 && (s = 0);
-          const t = s / n.clientWidth * 100;
-          _(t, n.clientWidth) > 5 && t < 101 && l(t);
-        }
+  const M = () => {
+    R(p.current), _(!0);
+  }, o = U(
+    () => X((r) => {
+      if (!m) return;
+      const a = p.current;
+      if (!a || a !== E) return;
+      const s = a.getBoundingClientRect(), l = e === "vertical" ? s.height : s.width, j = e === "vertical" ? r.clientY - s.top : r.clientX - s.left, H = Math.max(5, Math.min(l - 5, j));
+      n(H / l * 100);
     }, 1e3 / 60),
-    [f, E, e]
-  ), u = O(() => {
-    L(null), R(!1), document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", c);
-  }, [c]);
+    [m, E, e]
+  ), u = W(() => {
+    R(null), _(!1), document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", o);
+  }, [o]);
   b(() => {
-    a == null || a(i);
-  }, [i, a]);
-  const N = (r) => {
-    const n = e === "vertical" ? "ArrowUp" : "ArrowLeft", s = e === "vertical" ? "ArrowDown" : "ArrowRight";
-    r.key === n ? (r.preventDefault(), l((t) => Math.max(0, t - g))) : r.key === s ? (r.preventDefault(), l((t) => Math.min(100, t + g))) : r.key === "Home" ? (r.preventDefault(), l(0)) : r.key === "End" && (r.preventDefault(), l(100));
-  }, W = e === "vertical" ? { height: `${100 - i}%` } : { width: `${100 - i}%` }, H = e === "vertical" ? { height: `${i}%` } : { width: `${i}%` };
-  return b(() => (f ? (document.body.addEventListener("pointerup", u), document.body.addEventListener("pointermove", c), document.body.style.cursor = e === "horizontal" ? "e-resize" : "n-resize") : document.body.style.cursor = "default", () => {
-    document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", c);
-  }), [c, u, f, e]), /* @__PURE__ */ I(
+    i == null || i(t);
+  }, [t, i]);
+  const K = (r) => {
+    const a = e === "vertical" ? "ArrowUp" : "ArrowLeft", s = e === "vertical" ? "ArrowDown" : "ArrowRight";
+    r.key === a ? (r.preventDefault(), n((l) => Math.max(0, l - g))) : r.key === s ? (r.preventDefault(), n((l) => Math.min(100, l + g))) : r.key === "Home" ? (r.preventDefault(), n(0)) : r.key === "End" && (r.preventDefault(), n(100));
+  }, N = e === "vertical" ? { height: `${100 - t}%` } : { width: `${100 - t}%` }, I = e === "vertical" ? { height: `${t}%` } : { width: `${t}%` };
+  return b(() => (m ? (document.body.addEventListener("pointerup", u), document.body.addEventListener("pointermove", o), document.body.style.cursor = e === "horizontal" ? "e-resize" : "n-resize") : document.body.style.cursor = "default", () => {
+    document.body.removeEventListener("pointerup", u), document.body.removeEventListener("pointermove", o);
+  }), [o, u, m, e]), /* @__PURE__ */ B(
     "div",
     {
       className: D("smwb-screen-divider__wrapper", `smwb-${e}`, d),
-      ref: M,
+      ref: A,
       "data-testid": "screen-divider",
       children: [
-        /* @__PURE__ */ h("div", { className: D("smwb-screen-divider__first", `smwb-${e}`), style: H, children: w[0] || "" }),
-        /* @__PURE__ */ h(
+        /* @__PURE__ */ w("div", { className: D("smwb-screen-divider__first", `smwb-${e}`), style: I, children: h[0] || "" }),
+        /* @__PURE__ */ w(
           "span",
           {
             className: "smwb-screen-divider__resizer",
-            onPointerDown: K,
+            onPointerDown: M,
             draggable: !1,
             role: "separator",
             "aria-orientation": e === "vertical" ? "horizontal" : "vertical",
-            "aria-valuenow": Math.round(i),
+            "aria-valuenow": Math.round(t),
             "aria-valuemin": 0,
             "aria-valuemax": 100,
-            "aria-label": k,
+            "aria-label": $,
             tabIndex: 0,
-            onKeyDown: N
+            onKeyDown: K
           }
         ),
-        /* @__PURE__ */ h("div", { className: D("smwb-screen-divider__second", `smwb-${e}`), style: W, children: w[1] || "" })
+        /* @__PURE__ */ w("div", { className: D("smwb-screen-divider__second", `smwb-${e}`), style: N, children: h[1] || "" })
       ]
     }
   );
 });
 export {
-  Q as ScreenDivider,
-  Q as default
+  V as ScreenDivider,
+  V as default
 };
 //# sourceMappingURL=screenDivider.js.map

package/dist/headless/components/layout/screenDivider/screenDivider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"screenDivider.js","sources":["../../../../../src/components/layout/screenDivider/screenDivider.tsx"],"sourcesContent":["import React, {\n Children,\n forwardRef,\n KeyboardEvent,\n PropsWithChildren,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport cn from \"clsx\";\nimport { throttle } from \"../../../utils/throttle\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\n\nexport interface ScreenDividerProps {\n sizeFirst?: number;\n sizeSecond?: number;\n className?: string;\n orientation?: \"horizontal\" \| \"vertical\";\n /** Called with the first pane size (percent) whenever it changes. /\n onSizeChange?: (sizeFirst: number) => void;\n /* Step (in percent) applied on arrow-key resize. /\n keyboardStep?: number;\n /* Accessible label for the resizer handle. /\n resizerAriaLabel?: string;\n}\n\nconst toPixels = (percent: number, parentSize: number) => {\n return parentSize (percent / 100);\n};\n\nconst getInitialDivider = (sizeFirst?: number \| null, sizeSecond?: number \| null) => {\n if (!sizeFirst && sizeSecond) {\n return 100 - sizeSecond;\n }\n if (sizeFirst) {\n return sizeFirst;\n }\n return 50;\n};\n\nexport const ScreenDivider = forwardRef<HTMLDivElement, PropsWithChildren<ScreenDividerProps>>(function ScreenDivider(\n {\n className,\n orientation = \"horizontal\",\n sizeFirst,\n sizeSecond,\n children,\n onSizeChange,\n keyboardStep = 5,\n resizerAriaLabel = \"Resize panels\",\n },\n ref\n) {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const forkedWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const [divider, setDivider] = useState<number>(getInitialDivider(sizeFirst, sizeSecond));\n const [currentElement, setCurrentElement] = useState<HTMLDivElement \| null>(null);\n const [isDragging, setIsDragging] = useState(false);\n\n useEffect(() => {\n setDivider(getInitialDivider(sizeFirst, sizeSecond));\n }, [sizeFirst, sizeSecond]);\n\n const child = Children.toArray(children);\n if (child.length > 2) {\n throw new Error(\"Allowed not more than 2 children\");\n }\n\n const handleDragStart = () => {\n setCurrentElement(wrapperRef.current);\n setIsDragging(true);\n };\n\n const dragOverHandler = useMemo(\n () =>\n throttle((e: PointerEvent) => {\n if (!isDragging) return;\n\n const wrapper = wrapperRef.current;\n if (!wrapper \|\| wrapper !== currentElement) return;\n if (orientation === \"vertical\") {\n let relativeMouseY = e.clientY - wrapper.offsetTop;\n if (relativeMouseY < 0) {\n relativeMouseY = 0;\n }\n const newDivider = (relativeMouseY / wrapper.clientHeight) * 100;\n if (toPixels(newDivider, wrapper.clientWidth) > 5 && newDivider < 101) {\n setDivider(newDivider - 7);\n }\n } else {\n let relativeMouseX = e.clientX - wrapper.offsetLeft;\n if (relativeMouseX < 0) {\n relativeMouseX = 0;\n }\n const newDivider = (relativeMouseX / wrapper.clientWidth) * 100;\n if (toPixels(newDivider, wrapper.clientWidth) > 5 && newDivider < 101) {\n setDivider(newDivider);\n }\n }\n }, 1000 / 60),\n [isDragging, currentElement, orientation]\n );\n\n const handleDragEnd = useCallback(() => {\n setCurrentElement(null);\n setIsDragging(false);\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n }, [dragOverHandler]);\n\n useEffect(() => {\n onSizeChange?.(divider);\n }, [divider, onSizeChange]);\n\n const onResizerKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {\n const decreaseKey = orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n const increaseKey = orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n\n if (event.key === decreaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.max(0, prev - keyboardStep));\n } else if (event.key === increaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.min(100, prev + keyboardStep));\n } else if (event.key === \"Home\") {\n event.preventDefault();\n setDivider(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n setDivider(100);\n }\n };\n\n const secondChildStyle =\n orientation === \"vertical\" ? { height: `${100 - divider}%` } : { width: `${100 - divider}%` };\n\n const firstChildStyle = orientation === \"vertical\" ? { height: `${divider}%` } : { width: `${divider}%` };\n\n useEffect(() => {\n if (isDragging) {\n document.body.addEventListener(\"pointerup\", handleDragEnd);\n document.body.addEventListener(\"pointermove\", dragOverHandler);\n document.body.style.cursor = orientation === \"horizontal\" ? \"e-resize\" : \"n-resize\";\n } else {\n document.body.style.cursor = \"default\";\n }\n\n return () => {\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n };\n }, [dragOverHandler, handleDragEnd, isDragging, orientation]);\n\n return (\n <div\n className={cn(\"smwb-screen-divider__wrapper\", `smwb-${orientation}`, className)}\n ref={forkedWrapperRef}\n data-testid=\"screen-divider\"\n >\n <div className={cn(\"smwb-screen-divider__first\", `smwb-${orientation}`)} style={firstChildStyle}>\n {child[0] \|\| \"\"}\n </div>\n <span\n className=\"smwb-screen-divider__resizer\"\n onPointerDown={handleDragStart}\n draggable={false}\n role=\"separator\"\n aria-orientation={orientation === \"vertical\" ? \"horizontal\" : \"vertical\"}\n aria-valuenow={Math.round(divider)}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-label={resizerAriaLabel}\n tabIndex={0}\n onKeyDown={onResizerKeyDown}\n />\n <div className={cn(\"smwb-screen-divider__second\", `smwb-${orientation}`)} style={secondChildStyle}>\n {child[1] \|\| \"\"}\n </div>\n </div>\n );\n});\n\nexport default ScreenDivider;\n"],"names":["toPixels","percent","parentSize","getInitialDivider","sizeFirst","sizeSecond","ScreenDivider","forwardRef","className","orientation","children","onSizeChange","keyboardStep","resizerAriaLabel","ref","wrapperRef","useRef","forkedWrapperRef","useForkRef","divider","setDivider","useState","currentElement","setCurrentElement","isDragging","setIsDragging","useEffect","child","Children","handleDragStart","dragOverHandler","useMemo","throttle","e","wrapper","relativeMouseY","newDivider","relativeMouseX","handleDragEnd","useCallback","onResizerKeyDown","event","decreaseKey","increaseKey","prev","secondChildStyle","firstChildStyle","jsxs","cn","jsx"],"mappings":";;;;;AA4BA,MAAMA,IAAW,CAACC,GAAiBC,MAC1BA,KAAcD,IAAU,MAG3BE,IAAoB,CAACC,GAA2BC,MAChD,CAACD,KAAaC,IACT,MAAMA,IAEXD,KAGG,IAGIE,IAAgBC,EAAkE,SAC7F;AAAA,EACE,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAL;AAAA,EACA,YAAAC;AAAA,EACA,UAAAK;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,kBAAAC,IAAmB;AACrB,GACAC,GACA;AACA,QAAMC,IAAaC,EAAuB,IAAI,GACxCC,IAAmBC,EAA2BJ,GAAKC,CAAU,GAC7D,CAACI,GAASC,CAAU,IAAIC,EAAiBlB,EAAkBC,GAAWC,CAAU,CAAC,GACjF,CAACiB,GAAgBC,CAAiB,IAAIF,EAAgC,IAAI,GAC1E,CAACG,GAAYC,CAAa,IAAIJ,EAAS,EAAK;AAElD,EAAAK,EAAU,MAAM;AACd,IAAAN,EAAWjB,EAAkBC,GAAWC,CAAU,CAAC;AAAA,EACrD,GAAG,CAACD,GAAWC,CAAU,CAAC;AAE1B,QAAMsB,IAAQC,EAAS,QAAQlB,CAAQ;AACvC,MAAIiB,EAAM,SAAS;AACjB,UAAM,IAAI,MAAM,kCAAkC;AAGpD,QAAME,IAAkB,MAAM;AAC5B,IAAAN,EAAkBR,EAAW,OAAO,GACpCU,EAAc,EAAI;AAAA,EACpB,GAEMK,IAAkBC;AAAA,IACtB,MACEC,EAAS,CAACC,MAAoB;AAC5B,UAAI,CAACT,EAAY;AAEjB,YAAMU,IAAUnB,EAAW;AAC3B,UAAI,GAACmB,KAAWA,MAAYZ;AAC5B,YAAIb,MAAgB,YAAY;AAC9B,cAAI0B,IAAiBF,EAAE,UAAUC,EAAQ;AACzC,UAAIC,IAAiB,MACnBA,IAAiB;AAEnB,gBAAMC,IAAcD,IAAiBD,EAAQ,eAAgB;AAC7D,UAAIlC,EAASoC,GAAYF,EAAQ,WAAW,IAAI,KAAKE,IAAa,OAChEhB,EAAWgB,IAAa,CAAC;AAAA,QAE7B,OAAO;AACL,cAAIC,IAAiBJ,EAAE,UAAUC,EAAQ;AACzC,UAAIG,IAAiB,MACnBA,IAAiB;AAEnB,gBAAMD,IAAcC,IAAiBH,EAAQ,cAAe;AAC5D,UAAIlC,EAASoC,GAAYF,EAAQ,WAAW,IAAI,KAAKE,IAAa,OAChEhB,EAAWgB,CAAU;AAAA,QAEzB;AAAA,IACF,GAAG,MAAO,EAAE;AAAA,IACd,CAACZ,GAAYF,GAAgBb,CAAW;AAAA,EAAA,GAGpC6B,IAAgBC,EAAY,MAAM;AACtC,IAAAhB,EAAkB,IAAI,GACtBE,EAAc,EAAK,GACnB,SAAS,KAAK,oBAAoB,aAAaa,CAAa,GAC5D,SAAS,KAAK,oBAAoB,eAAeR,CAAe;AAAA,EAClE,GAAG,CAACA,CAAe,CAAC;AAEpB,EAAAJ,EAAU,MAAM;AACd,IAAAf,KAAA,QAAAA,EAAeQ;AAAA,EACjB,GAAG,CAACA,GAASR,CAAY,CAAC;AAE1B,QAAM6B,IAAmB,CAACC,MAA0C;AAClE,UAAMC,IAAcjC,MAAgB,aAAa,YAAY,aACvDkC,IAAclC,MAAgB,aAAa,cAAc;AAE/D,IAAIgC,EAAM,QAAQC,KAChBD,EAAM,eAAA,GACNrB,EAAW,CAACwB,MAAS,KAAK,IAAI,GAAGA,IAAOhC,CAAY,CAAC,KAC5C6B,EAAM,QAAQE,KACvBF,EAAM,eAAA,GACNrB,EAAW,CAACwB,MAAS,KAAK,IAAI,KAAKA,IAAOhC,CAAY,CAAC,KAC9C6B,EAAM,QAAQ,UACvBA,EAAM,eAAA,GACNrB,EAAW,CAAC,KACHqB,EAAM,QAAQ,UACvBA,EAAM,eAAA,GACNrB,EAAW,GAAG;AAAA,EAElB,GAEMyB,IACJpC,MAAgB,aAAa,EAAE,QAAQ,GAAG,MAAMU,CAAO,IAAA,IAAQ,EAAE,OAAO,GAAG,MAAMA,CAAO,IAAA,GAEpF2B,IAAkBrC,MAAgB,aAAa,EAAE,QAAQ,GAAGU,CAAO,IAAA,IAAQ,EAAE,OAAO,GAAGA,CAAO,IAAA;AAEpG,SAAAO,EAAU,OACJF,KACF,SAAS,KAAK,iBAAiB,aAAac,CAAa,GACzD,SAAS,KAAK,iBAAiB,eAAeR,CAAe,GAC7D,SAAS,KAAK,MAAM,SAASrB,MAAgB,eAAe,aAAa,cAEzE,SAAS,KAAK,MAAM,SAAS,WAGxB,MAAM;AACX,aAAS,KAAK,oBAAoB,aAAa6B,CAAa,GAC5D,SAAS,KAAK,oBAAoB,eAAeR,CAAe;AAAA,EAClE,IACC,CAACA,GAAiBQ,GAAed,GAAYf,CAAW,CAAC,GAG1D,gBAAAsC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAG,gCAAgC,QAAQvC,CAAW,IAAID,CAAS;AAAA,MAC9E,KAAKS;AAAA,MACL,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAgC,EAAC,OAAA,EAAI,WAAWD,EAAG,8BAA8B,QAAQvC,CAAW,EAAE,GAAG,OAAOqC,GAC7E,UAAAnB,EAAM,CAAC,KAAK,IACf;AAAA,QACA,gBAAAsB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAepB;AAAA,YACf,WAAW;AAAA,YACX,MAAK;AAAA,YACL,oBAAkBpB,MAAgB,aAAa,eAAe;AAAA,YAC9D,iBAAe,KAAK,MAAMU,CAAO;AAAA,YACjC,iBAAe;AAAA,YACf,iBAAe;AAAA,YACf,cAAYN;AAAA,YACZ,UAAU;AAAA,YACV,WAAW2B;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb,gBAAAS,EAAC,OAAA,EAAI,WAAWD,EAAG,+BAA+B,QAAQvC,CAAW,EAAE,GAAG,OAAOoC,GAC9E,UAAAlB,EAAM,CAAC,KAAK,GAAA,CACf;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
1	+ {"version":3,"file":"screenDivider.js","sources":["../../../../../src/components/layout/screenDivider/screenDivider.tsx"],"sourcesContent":["import React, {\n Children,\n forwardRef,\n KeyboardEvent,\n PropsWithChildren,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport cn from \"clsx\";\nimport { throttle } from \"../../../utils/throttle\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\n\nexport interface ScreenDividerProps {\n sizeFirst?: number;\n sizeSecond?: number;\n className?: string;\n orientation?: \"horizontal\" \| \"vertical\";\n /** Called with the first pane size (percent) whenever it changes. /\n onSizeChange?: (sizeFirst: number) => void;\n /* Step (in percent) applied on arrow-key resize. /\n keyboardStep?: number;\n /* Accessible label for the resizer handle. /\n resizerAriaLabel?: string;\n}\n\nconst getInitialDivider = (sizeFirst?: number \| null, sizeSecond?: number \| null) => {\n if (!sizeFirst && sizeSecond) {\n return 100 - sizeSecond;\n }\n if (sizeFirst) {\n return sizeFirst;\n }\n return 50;\n};\n\nexport const ScreenDivider = forwardRef<HTMLDivElement, PropsWithChildren<ScreenDividerProps>>(function ScreenDivider(\n {\n className,\n orientation = \"horizontal\",\n sizeFirst,\n sizeSecond,\n children,\n onSizeChange,\n keyboardStep = 5,\n resizerAriaLabel = \"Resize panels\",\n },\n ref\n) {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const forkedWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const [divider, setDivider] = useState<number>(getInitialDivider(sizeFirst, sizeSecond));\n const [currentElement, setCurrentElement] = useState<HTMLDivElement \| null>(null);\n const [isDragging, setIsDragging] = useState(false);\n\n useEffect(() => {\n setDivider(getInitialDivider(sizeFirst, sizeSecond));\n }, [sizeFirst, sizeSecond]);\n\n const child = Children.toArray(children);\n if (child.length > 2) {\n throw new Error(\"Allowed not more than 2 children\");\n }\n\n const handleDragStart = () => {\n setCurrentElement(wrapperRef.current);\n setIsDragging(true);\n };\n\n const dragOverHandler = useMemo(\n () =>\n throttle((e: PointerEvent) => {\n if (!isDragging) return;\n const wrapper = wrapperRef.current;\n if (!wrapper \|\| wrapper !== currentElement) return;\n // Viewport-relative rect — using offsetLeft/offsetTop here is wrong\n // because they are relative to the nearest positioned ancestor, not\n // the viewport that clientX/clientY live in (this is what made the\n // divider drift away from the cursor when the wrapper was nested).\n const rect = wrapper.getBoundingClientRect();\n const total = orientation === \"vertical\" ? rect.height : rect.width;\n const cursor = orientation === \"vertical\" ? e.clientY - rect.top : e.clientX - rect.left;\n // 5px margin on each side so neither pane fully collapses.\n const clamped = Math.max(5, Math.min(total - 5, cursor));\n setDivider((clamped / total) 100);\n }, 1000 / 60),\n [isDragging, currentElement, orientation]\n );\n\n const handleDragEnd = useCallback(() => {\n setCurrentElement(null);\n setIsDragging(false);\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n }, [dragOverHandler]);\n\n useEffect(() => {\n onSizeChange?.(divider);\n }, [divider, onSizeChange]);\n\n const onResizerKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {\n const decreaseKey = orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n const increaseKey = orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n\n if (event.key === decreaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.max(0, prev - keyboardStep));\n } else if (event.key === increaseKey) {\n event.preventDefault();\n setDivider((prev) => Math.min(100, prev + keyboardStep));\n } else if (event.key === \"Home\") {\n event.preventDefault();\n setDivider(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n setDivider(100);\n }\n };\n\n const secondChildStyle =\n orientation === \"vertical\" ? { height: `${100 - divider}%` } : { width: `${100 - divider}%` };\n\n const firstChildStyle = orientation === \"vertical\" ? { height: `${divider}%` } : { width: `${divider}%` };\n\n useEffect(() => {\n if (isDragging) {\n document.body.addEventListener(\"pointerup\", handleDragEnd);\n document.body.addEventListener(\"pointermove\", dragOverHandler);\n document.body.style.cursor = orientation === \"horizontal\" ? \"e-resize\" : \"n-resize\";\n } else {\n document.body.style.cursor = \"default\";\n }\n\n return () => {\n document.body.removeEventListener(\"pointerup\", handleDragEnd);\n document.body.removeEventListener(\"pointermove\", dragOverHandler);\n };\n }, [dragOverHandler, handleDragEnd, isDragging, orientation]);\n\n return (\n <div\n className={cn(\"smwb-screen-divider__wrapper\", `smwb-${orientation}`, className)}\n ref={forkedWrapperRef}\n data-testid=\"screen-divider\"\n >\n <div className={cn(\"smwb-screen-divider__first\", `smwb-${orientation}`)} style={firstChildStyle}>\n {child[0] \|\| \"\"}\n </div>\n <span\n className=\"smwb-screen-divider__resizer\"\n onPointerDown={handleDragStart}\n draggable={false}\n role=\"separator\"\n aria-orientation={orientation === \"vertical\" ? \"horizontal\" : \"vertical\"}\n aria-valuenow={Math.round(divider)}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-label={resizerAriaLabel}\n tabIndex={0}\n onKeyDown={onResizerKeyDown}\n />\n <div className={cn(\"smwb-screen-divider__second\", `smwb-${orientation}`)} style={secondChildStyle}>\n {child[1] \|\| \"\"}\n </div>\n </div>\n );\n});\n\nexport default ScreenDivider;\n"],"names":["getInitialDivider","sizeFirst","sizeSecond","ScreenDivider","forwardRef","className","orientation","children","onSizeChange","keyboardStep","resizerAriaLabel","ref","wrapperRef","useRef","forkedWrapperRef","useForkRef","divider","setDivider","useState","currentElement","setCurrentElement","isDragging","setIsDragging","useEffect","child","Children","handleDragStart","dragOverHandler","useMemo","throttle","e","wrapper","rect","total","cursor","clamped","handleDragEnd","useCallback","onResizerKeyDown","event","decreaseKey","increaseKey","prev","secondChildStyle","firstChildStyle","jsxs","cn","jsx"],"mappings":";;;;;AA4BA,MAAMA,IAAoB,CAACC,GAA2BC,MAChD,CAACD,KAAaC,IACT,MAAMA,IAEXD,KAGG,IAGIE,IAAgBC,EAAkE,SAC7F;AAAA,EACE,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAL;AAAA,EACA,YAAAC;AAAA,EACA,UAAAK;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,kBAAAC,IAAmB;AACrB,GACAC,GACA;AACA,QAAMC,IAAaC,EAAuB,IAAI,GACxCC,IAAmBC,EAA2BJ,GAAKC,CAAU,GAC7D,CAACI,GAASC,CAAU,IAAIC,EAAiBlB,EAAkBC,GAAWC,CAAU,CAAC,GACjF,CAACiB,GAAgBC,CAAiB,IAAIF,EAAgC,IAAI,GAC1E,CAACG,GAAYC,CAAa,IAAIJ,EAAS,EAAK;AAElD,EAAAK,EAAU,MAAM;AACd,IAAAN,EAAWjB,EAAkBC,GAAWC,CAAU,CAAC;AAAA,EACrD,GAAG,CAACD,GAAWC,CAAU,CAAC;AAE1B,QAAMsB,IAAQC,EAAS,QAAQlB,CAAQ;AACvC,MAAIiB,EAAM,SAAS;AACjB,UAAM,IAAI,MAAM,kCAAkC;AAGpD,QAAME,IAAkB,MAAM;AAC5B,IAAAN,EAAkBR,EAAW,OAAO,GACpCU,EAAc,EAAI;AAAA,EACpB,GAEMK,IAAkBC;AAAA,IACtB,MACEC,EAAS,CAACC,MAAoB;AAC5B,UAAI,CAACT,EAAY;AACjB,YAAMU,IAAUnB,EAAW;AAC3B,UAAI,CAACmB,KAAWA,MAAYZ,EAAgB;AAK5C,YAAMa,IAAOD,EAAQ,sBAAA,GACfE,IAAQ3B,MAAgB,aAAa0B,EAAK,SAASA,EAAK,OACxDE,IAAS5B,MAAgB,aAAawB,EAAE,UAAUE,EAAK,MAAMF,EAAE,UAAUE,EAAK,MAE9EG,IAAU,KAAK,IAAI,GAAG,KAAK,IAAIF,IAAQ,GAAGC,CAAM,CAAC;AACvD,MAAAjB,EAAYkB,IAAUF,IAAS,GAAG;AAAA,IACpC,GAAG,MAAO,EAAE;AAAA,IACd,CAACZ,GAAYF,GAAgBb,CAAW;AAAA,EAAA,GAGpC8B,IAAgBC,EAAY,MAAM;AACtC,IAAAjB,EAAkB,IAAI,GACtBE,EAAc,EAAK,GACnB,SAAS,KAAK,oBAAoB,aAAac,CAAa,GAC5D,SAAS,KAAK,oBAAoB,eAAeT,CAAe;AAAA,EAClE,GAAG,CAACA,CAAe,CAAC;AAEpB,EAAAJ,EAAU,MAAM;AACd,IAAAf,KAAA,QAAAA,EAAeQ;AAAA,EACjB,GAAG,CAACA,GAASR,CAAY,CAAC;AAE1B,QAAM8B,IAAmB,CAACC,MAA0C;AAClE,UAAMC,IAAclC,MAAgB,aAAa,YAAY,aACvDmC,IAAcnC,MAAgB,aAAa,cAAc;AAE/D,IAAIiC,EAAM,QAAQC,KAChBD,EAAM,eAAA,GACNtB,EAAW,CAACyB,MAAS,KAAK,IAAI,GAAGA,IAAOjC,CAAY,CAAC,KAC5C8B,EAAM,QAAQE,KACvBF,EAAM,eAAA,GACNtB,EAAW,CAACyB,MAAS,KAAK,IAAI,KAAKA,IAAOjC,CAAY,CAAC,KAC9C8B,EAAM,QAAQ,UACvBA,EAAM,eAAA,GACNtB,EAAW,CAAC,KACHsB,EAAM,QAAQ,UACvBA,EAAM,eAAA,GACNtB,EAAW,GAAG;AAAA,EAElB,GAEM0B,IACJrC,MAAgB,aAAa,EAAE,QAAQ,GAAG,MAAMU,CAAO,IAAA,IAAQ,EAAE,OAAO,GAAG,MAAMA,CAAO,IAAA,GAEpF4B,IAAkBtC,MAAgB,aAAa,EAAE,QAAQ,GAAGU,CAAO,IAAA,IAAQ,EAAE,OAAO,GAAGA,CAAO,IAAA;AAEpG,SAAAO,EAAU,OACJF,KACF,SAAS,KAAK,iBAAiB,aAAae,CAAa,GACzD,SAAS,KAAK,iBAAiB,eAAeT,CAAe,GAC7D,SAAS,KAAK,MAAM,SAASrB,MAAgB,eAAe,aAAa,cAEzE,SAAS,KAAK,MAAM,SAAS,WAGxB,MAAM;AACX,aAAS,KAAK,oBAAoB,aAAa8B,CAAa,GAC5D,SAAS,KAAK,oBAAoB,eAAeT,CAAe;AAAA,EAClE,IACC,CAACA,GAAiBS,GAAef,GAAYf,CAAW,CAAC,GAG1D,gBAAAuC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAG,gCAAgC,QAAQxC,CAAW,IAAID,CAAS;AAAA,MAC9E,KAAKS;AAAA,MACL,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAiC,EAAC,OAAA,EAAI,WAAWD,EAAG,8BAA8B,QAAQxC,CAAW,EAAE,GAAG,OAAOsC,GAC7E,UAAApB,EAAM,CAAC,KAAK,IACf;AAAA,QACA,gBAAAuB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAerB;AAAA,YACf,WAAW;AAAA,YACX,MAAK;AAAA,YACL,oBAAkBpB,MAAgB,aAAa,eAAe;AAAA,YAC9D,iBAAe,KAAK,MAAMU,CAAO;AAAA,YACjC,iBAAe;AAAA,YACf,iBAAe;AAAA,YACf,cAAYN;AAAA,YACZ,UAAU;AAAA,YACV,WAAW4B;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb,gBAAAS,EAAC,OAAA,EAAI,WAAWD,EAAG,+BAA+B,QAAQxC,CAAW,EAAE,GAAG,OAAOqC,GAC9E,UAAAnB,EAAM,CAAC,KAAK,GAAA,CACf;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}