@sberbusiness/triplex-next 0.17.0 → 0.19.0

package/components/Tooltip/components/common/TooltipLink.js

@@ -2,17 +2,17 @@ import { jsx as t } from "react/jsx-runtime";
 import n from "react";
 import { c as l } from "../../../../chunks/vendor-DE8Zvm0w.js";
 import { MobileView as a } from "../../../MobileView/MobileView.js";
-const k = "tooltipLink__84b2f16d", r = "desktop__d7a3c87b", m = "mobile__aee13862", o = {
+const k = "tooltipLink__64094d8a", r = "desktop__f7963cce", c = "mobile__d33cfefe", o = {
   tooltipLink: k,
   desktop: r,
-  mobile: m
-}, c = n.forwardRef(
+  mobile: c
+}, m = n.forwardRef(
   ({ children: i, className: e, ...p }, s) => /* @__PURE__ */ t(a, { fallback: /* @__PURE__ */ t(
     "a",
     {
       className: l(o.tooltipLink, o.desktop, e),
       ...p,
-      "data-tx": "0.17.0",
+      "data-tx": "0.19.0",
       ref: s,
       children: i
     }
@@ -21,14 +21,14 @@ const k = "tooltipLink__84b2f16d", r = "desktop__d7a3c87b", m = "mobile__aee1386
     {
       className: l(o.tooltipLink, o.mobile, e),
       ...p,
-      "data-tx": "0.17.0",
+      "data-tx": "0.19.0",
       ref: s,
       children: i
     }
   ) })
 );
-c.displayName = "TooltipLink";
+m.displayName = "TooltipLink";
 export {
-  c as TooltipLink
+  m as TooltipLink
 };
 //# sourceMappingURL=TooltipLink.js.map

package/components/Tooltip/components/common/TooltipXButton.js

@@ -3,7 +3,7 @@ import { useContext as m } from "react";
 import { CrossStrokeSrvIcon16 as n } from "@sberbusiness/icons-next";
 import { TooltipContext as i } from "../../TootlipContext.js";
 import { ButtonIcon as a } from "../../../Button/ButtonIcon.js";
-import { s as l } from "../../../../chunks/TooltipDesktop.module-CyeERXWq.js";
+import { s as l } from "../../../../chunks/TooltipDesktop.module-DB_qJpGS.js";
 const I = ({ onClick: o, ...s }) => {
   const { setTooltipOpen: p } = m(i), e = (t) => {
     t.stopPropagation(), p(!1), o == null || o(t);

package/components/Tooltip/components/desktop/components/TooltipDesktopBase.js

@@ -9,7 +9,7 @@ import { Portal as Y } from "../../../../Portal/Portal.js";
 import { ETooltipPreferPlace as u, ETooltipDirection as B, ETooltipAlign as z, ETooltipFlowTypes as I, ETooltipSizeParameter as r, ETooltipTypeName as C, ETooltipEndCoordinates as N, ETooltipStartCoordinates as R, ETooltipAxesType as G, ETooltipSize as U } from "../../../enums.js";
 import { TooltipDesktopTip as V } from "./TooltipDesktopTip.js";
 import { pickZone as j, axes as q, calcRelPos as K, centerOfBoundsFromBounds as Z, calcBounds as L, equalCoords as J } from "../../../utils/Positioning.js";
-import { s as f } from "../../../../../chunks/TooltipDesktop.module-CyeERXWq.js";
+import { s as f } from "../../../../../chunks/TooltipDesktop.module-DB_qJpGS.js";
 const Q = {
   column: "translateX",
   row: "translateY"

package/components/Tooltip/components/desktop/components/TooltipDesktopTip.js

@@ -2,7 +2,7 @@ import { jsx as p } from "react/jsx-runtime";
 import a from "react";
 import { ETooltipDirection as e } from "../../../enums.js";
 import { c } from "../../../../../chunks/vendor-DE8Zvm0w.js";
-import { s as t } from "../../../../../chunks/TooltipDesktop.module-CyeERXWq.js";
+import { s as t } from "../../../../../chunks/TooltipDesktop.module-DB_qJpGS.js";
 const m = a.forwardRef((r, i) => {
   const { direction: s } = r;
   let o;

package/components/Tooltip/components/mobile/TooltipMobile.js

@@ -1,12 +1,12 @@
 import { jsxs as r, Fragment as b, jsx as n } from "react/jsx-runtime";
-import { useContext as f, useRef as u, useEffect as M } from "react";
+import { useContext as u, useRef as f, useEffect as M } from "react";
 import { TooltipContext as C } from "../../TootlipContext.js";
 import { Portal as B } from "../../../Portal/Portal.js";
 import { DropdownMobile as _ } from "../../../Dropdown/mobile/DropdownMobile.js";
 import { DropdownMobileBody as x } from "../../../Dropdown/mobile/DropdownMobileBody.js";
 import { TooltipMobileCloseButton as h } from "./components/TooltipMobileCloseButton.js";
 import { c as y } from "../../../../chunks/vendor-DE8Zvm0w.js";
-const N = "tooltipMobile__e6b1d2fe", T = "tooltipMobileContent__3a1a75ee", g = "headerless__28f51f20", H = "closeButton__3bee3070", o = {
+const N = "tooltipMobile__088b36d1", T = "tooltipMobileContent__3e69b047", g = "headerless__3456ecec", H = "closeButton__373c1877", o = {
   tooltipMobile: N,
   tooltipMobileContent: T,
   headerless: g,
@@ -21,11 +21,11 @@ const N = "tooltipMobile__e6b1d2fe", T = "tooltipMobileContent__3a1a75ee", g = "
   onShow: l,
   ...d
 }) => {
-  const { elements: e, setTooltipOpen: p } = f(C), i = u(null), a = y(o.tooltipMobile, { [o.headerless]: e.mobileHeader === null }, c);
+  const { elements: e, setTooltipOpen: p } = u(C), i = f(null), m = y(o.tooltipMobile, { [o.headerless]: e.mobileHeader === null }, c);
   M(() => {
     t && (l == null || l(i.current));
   }, [t]);
-  const m = () => {
+  const a = () => {
     var s;
     return /* @__PURE__ */ n("div", { className: o.closeButton, children: /* @__PURE__ */ n(h, { ...(s = e.closeButton) == null ? void 0 : s.props }) });
   };
@@ -34,7 +34,7 @@ const N = "tooltipMobile__e6b1d2fe", T = "tooltipMobileContent__3a1a75ee", g = "
     /* @__PURE__ */ n(B, { container: document.body, children: /* @__PURE__ */ r(
       _,
       {
-        className: a,
+        className: m,
         tabIndex: -1,
         opened: t,
         setOpened: p,
@@ -45,7 +45,7 @@ const N = "tooltipMobile__e6b1d2fe", T = "tooltipMobileContent__3a1a75ee", g = "
           /* @__PURE__ */ r(x, { className: o.tooltipMobileContent, children: [
             e.body,
             e.link,
-            e.mobileHeader === null && m()
+            e.mobileHeader === null && a()
           ] })
         ]
       }

package/components/TopOverlay/TopOverlay.js

@@ -3,7 +3,7 @@ import { useState as y, useRef as g, useEffect as C } from "react";
 import { EOverlayDirection as R } from "../Overlay/OverlayBase.js";
 import { Overlay as O } from "../Overlay/Overlay.js";
 import { c as S, F as j } from "../../chunks/vendor-DE8Zvm0w.js";
-const D = "topOverlayMask__fd3d8049", E = "topOverlayWrapper__f31280a3", A = "closing__5ba2b83f", V = "opened__02382b8a", $ = "topOverlayPanel__99ff6373", q = "topOverlay__5c2cf34b", t = {
+const D = "topOverlayMask__14bbbf76", E = "topOverlayWrapper__4dd56f4e", A = "closing__fecc79ca", V = "opened__d698dea2", $ = "topOverlayPanel__87b92139", q = "topOverlay__a821b85d", t = {
   topOverlayMask: D,
   topOverlayWrapper: E,
   closing: A,
@@ -18,7 +18,7 @@ const D = "topOverlayMask__fd3d8049", E = "topOverlayWrapper__f31280a3", A = "cl
   onOpen: n,
   ...h
 }) => {
-  const [W, f] = y(!1), [x, u] = y(!1), [d, c] = y(0), p = g(e), s = g(null), m = () => {
+  const [W, d] = y(!1), [x, u] = y(!1), [f, c] = y(0), p = g(e), s = g(null), m = () => {
     if (s.current) {
       const r = getComputedStyle(s.current).getPropertyValue("--lightBox-screen-top") || "0", i = s.current.getBoundingClientRect();
       i.top < 0 ? c(
@@ -28,15 +28,15 @@ const D = "topOverlayMask__fd3d8049", E = "topOverlayWrapper__f31280a3", A = "cl
         (v) => parseInt(v, 10) - i.top + parseInt(r, 10)
       );
     }
-  }, k = () => {
+  }, b = () => {
     m(), u(!0), n == null || n();
   };
   C(() => {
-    p.current && !e ? f(!0) : !p.current && e && m(), p.current = e;
+    p.current && !e ? d(!0) : !p.current && e && m(), p.current = e;
   }, [e]);
-  const M = () => {
-    f(!1), c(0), l == null || l();
-  }, T = () => u(!1), b = (r) => /* @__PURE__ */ I(B, { children: [
+  const k = () => {
+    d(!1), c(0), l == null || l();
+  }, M = () => u(!1), T = (r) => /* @__PURE__ */ I(B, { children: [
     /* @__PURE__ */ a(O.Mask, { opened: r.opened, className: t.topOverlayMask }),
     /* @__PURE__ */ a(O.Panel, { className: t.topOverlayPanel, ...r, children: _ })
   ] }), F = () => {
@@ -46,15 +46,15 @@ const D = "topOverlayMask__fd3d8049", E = "topOverlayWrapper__f31280a3", A = "cl
   }), P = /* @__PURE__ */ a(
     O,
     {
-      onClose: M,
-      onClosing: T,
-      onOpen: k,
+      onClose: k,
+      onClosing: M,
+      onOpen: b,
       opened: e,
       setOpened: F,
       ...h,
       className: t.topOverlay,
       direction: R.TOP,
-      children: b
+      children: T
     }
   );
   return /* @__PURE__ */ a(
@@ -72,7 +72,7 @@ const D = "topOverlayMask__fd3d8049", E = "topOverlayWrapper__f31280a3", A = "cl
         {
           className: N,
           ref: s,
-          style: d ? { top: `${d}px` } : void 0,
+          style: f ? { top: `${f}px` } : void 0,
           children: P
         }
       )

package/components/TreeView/TreeView.js

@@ -10,7 +10,7 @@ import { TreeViewAbstractNode as C } from "./TreeViewAbstractNode.js";
 import { TreeViewNode as f } from "./components/TreeViewNode.js";
 import { TreeViewGroup as b } from "./components/TreeViewGroup.js";
 import { c as v } from "../../chunks/vendor-DE8Zvm0w.js";
-import { s as w } from "../../chunks/TreeView.module-DV2mpAEi.js";
+import { s as w } from "../../chunks/TreeView.module-DToAhAOL.js";
 const R = "rootNode";
 class n extends m.Component {
   constructor(e) {

package/components/TreeView/components/TreeViewGroup.js

@@ -1,5 +1,5 @@
 import { jsx as o } from "react/jsx-runtime";
-import { s } from "../../../chunks/TreeView.module-DV2mpAEi.js";
+import { s } from "../../../chunks/TreeView.module-DToAhAOL.js";
 const m = ({ children: r, ...e }) => /* @__PURE__ */ o("ul", { role: "group", className: s.treeViewGroup, ...e, children: r });
 export {
   m as TreeViewGroup

package/components/TreeView/components/TreeViewNode.js

@@ -7,7 +7,7 @@ import { TreeViewContext as m, withTreeViewContext as x } from "../TreeViewConte
 import { TreeViewAbstractNode as b } from "../TreeViewAbstractNode.js";
 import { TreeViewAbstractNodeUtils as n } from "../TreeViewAbstractNodeUtils.js";
 import { c as w } from "../../../chunks/vendor-DE8Zvm0w.js";
-import { s as C } from "../../../chunks/TreeView.module-DV2mpAEi.js";
+import { s as C } from "../../../chunks/TreeView.module-DToAhAOL.js";
 class V extends l.Component {
   constructor(e) {
     super(e);

package/components/Typography/Caption.js

@@ -1,48 +1,48 @@
 import { jsx as E } from "react/jsx-runtime";
 import S from "react";
-import { c as T } from "../../chunks/vendor-DE8Zvm0w.js";
-import { ECaptionSize as a, EFontWeightCaption as _, EFontType as g } from "./enums.js";
-import { t, F as C } from "../../chunks/constants-BG01GOrx.js";
-const f = "caption__46d8474c", y = "regular__f68b10bc", M = "semibold__915dee74", R = "c1__8772c24e", b = "c2__04439dda", N = "d1__b02e5677", o = {
-  caption: f,
+import { c as f } from "../../chunks/vendor-DE8Zvm0w.js";
+import { ECaptionSize as s, EFontWeightCaption as _, EFontType as T } from "./enums.js";
+import { t, F as g } from "../../chunks/constants-BJYXBm7r.js";
+const C = "caption__68d4a435", y = "regular__f79a82f3", M = "semibold__26cd13ca", R = "c1__8043bf06", N = "c2__9240308a", L = "d1__937ada93", o = {
+  caption: C,
   regular: y,
   semibold: M,
   c1: R,
-  c2: b,
-  d1: N
-}, L = {
-  [a.C1]: o.c1,
-  [a.C2]: o.c2,
-  [a.D1]: o.d1
+  c2: N,
+  d1: L
 }, O = {
+  [s.C1]: o.c1,
+  [s.C2]: o.c2,
+  [s.D1]: o.d1
+}, b = {
   [_.REGULAR]: o.regular,
   [_.SEMIBOLD]: o.semibold
 }, u = S.forwardRef(
   ({
     children: r,
-    className: e,
-    size: n,
-    tag: p,
+    className: n,
+    size: p,
+    tag: e,
     weight: i = _.REGULAR,
-    type: m = g.PRIMARY,
-    underline: c,
-    strikethrough: s,
-    ...d
-  }, l) => {
-    const A = T(
+    type: m = T.PRIMARY,
+    underline: a,
+    strikethrough: c,
+    ...l
+  }, d) => {
+    const A = f(
       t.typography,
       o.caption,
-      L[n],
-      O[i],
-      C[m],
+      O[p],
+      b[i],
+      g[m],
       {
-        [t.strikethrough]: !!s && !c,
-        [t.underline]: !!c && !s,
-        [t.underlineStrikethrough]: !!s && !!c
+        [t.strikethrough]: !!c && !a,
+        [t.underline]: !!a && !c,
+        [t.underlineStrikethrough]: !!c && !!a
       },
-      e
+      n
     );
-    return /* @__PURE__ */ E(p || "span", { ref: l, className: A, ...d, children: r });
+    return /* @__PURE__ */ E(e || "span", { ref: d, className: A, ...l, children: r });
   }
 );
 u.displayName = "Caption";

package/components/Typography/Text.js

@@ -1,11 +1,11 @@
-import { jsx as M } from "react/jsx-runtime";
-import S from "react";
-import { c as d } from "../../chunks/vendor-DE8Zvm0w.js";
-import { ETextSize as o, EFontWeightText as s, ELineType as r, EFontType as x } from "./enums.js";
-import { t as e, F as L } from "../../chunks/constants-BG01GOrx.js";
-const N = "text__85ad0c54", f = "regular__f68b10bc", O = "semibold__915dee74", R = "b1__8777ecdd", g = "b2__2e60e992", y = "b3__81927431", P = "compact__3fddb8c4", C = "b4__c189685f", t = {
+import { jsx as i } from "react/jsx-runtime";
+import M from "react";
+import { c as S } from "../../chunks/vendor-DE8Zvm0w.js";
+import { ETextSize as o, EFontWeightText as c, ELineType as a, EFontType as x } from "./enums.js";
+import { t as e, F as L } from "../../chunks/constants-BJYXBm7r.js";
+const N = "text__5ff40ebd", d = "regular__f79a82f3", O = "semibold__26cd13ca", R = "b1__3e82d4fb", g = "b2__acec07ea", y = "b3__ef5a5006", P = "compact__769851b1", C = "b4__80f9df33", t = {
   text: N,
-  regular: f,
+  regular: d,
   semibold: O,
   b1: R,
   b2: g,
@@ -18,25 +18,25 @@ const N = "text__85ad0c54", f = "regular__f68b10bc", O = "semibold__915dee74", R
   [o.B3]: t.b3,
   [o.B4]: t.b4
 }, B = {
-  [s.REGULAR]: t.regular,
-  [s.SEMIBOLD]: t.semibold
+  [c.REGULAR]: t.regular,
+  [c.SEMIBOLD]: t.semibold
 }, F = {
-  [r.NORMAL]: "",
-  [r.COMPACT]: t.compact
-}, I = S.forwardRef(
+  [a.NORMAL]: "",
+  [a.COMPACT]: t.compact
+}, I = M.forwardRef(
   ({
-    children: a,
+    children: r,
     className: b,
     size: m,
     tag: n,
     type: p = x.PRIMARY,
-    weight: A = s.REGULAR,
-    line: T = r.NORMAL,
+    weight: A = c.REGULAR,
+    line: T = a.NORMAL,
     underline: _,
-    strikethrough: c,
+    strikethrough: s,
     ...E
-  }, l) => {
-    const i = d(
+  }, f) => {
+    const l = S(
       e.typography,
       t.text,
       u[m],
@@ -44,13 +44,13 @@ const N = "text__85ad0c54", f = "regular__f68b10bc", O = "semibold__915dee74", R
       F[T],
       L[p],
       {
-        [e.strikethrough]: !!c && !_,
-        [e.underline]: !!_ && !c,
-        [e.underlineStrikethrough]: !!c && !!_
+        [e.strikethrough]: !!s && !_,
+        [e.underline]: !!_ && !s,
+        [e.underlineStrikethrough]: !!s && !!_
       },
       b
     );
-    return /* @__PURE__ */ M(n || "span", { ref: l, className: i, ...E, children: a });
+    return /* @__PURE__ */ i(n || "span", { ref: f, className: l, ...E, children: r });
   }
 );
 I.displayName = "Text";

package/components/Typography/Title.js

@@ -1,11 +1,11 @@
-import { jsx as T } from "react/jsx-runtime";
-import E from "react";
+import { jsx as E } from "react/jsx-runtime";
+import f from "react";
 import { c as p } from "../../chunks/vendor-DE8Zvm0w.js";
 import { ETitleSize as l, EFontWeightTitle as o, EFontType as S } from "./enums.js";
-import { t as e, F as A } from "../../chunks/constants-BG01GOrx.js";
-const M = "title__3881b527", f = "regular__f68b10bc", g = "semibold__915dee74", u = "medium__c2d9ed6b", y = "bold__3ad1c8f0", O = "h1__7cc8d95a", L = "h2__f6535090", N = "h3__7721bdbc", t = {
+import { t as e, F as A } from "../../chunks/constants-BJYXBm7r.js";
+const M = "title__16695ad9", b = "regular__f79a82f3", g = "semibold__26cd13ca", u = "medium__d5922dcb", y = "bold__f765ae6d", O = "h1__b3ea3522", L = "h2__3e38d7ef", N = "h3__6f805903", t = {
   title: M,
-  regular: f,
+  regular: b,
   semibold: g,
   medium: u,
   bold: y,
@@ -21,32 +21,32 @@ const M = "title__3881b527", f = "regular__f68b10bc", g = "semibold__915dee74",
   [o.REGULAR]: t.regular,
   [o.SEMIBOLD]: t.semibold,
   [o.BOLD]: t.bold
-}, F = E.forwardRef(
+}, F = f.forwardRef(
   ({
-    children: c,
-    className: r,
-    size: i,
-    tag: m,
-    weight: a = o.SEMIBOLD,
+    children: r,
+    className: i,
+    size: m,
+    tag: a,
+    weight: c = o.SEMIBOLD,
     type: d = S.PRIMARY,
     underline: s,
     strikethrough: _,
     ...n
   }, h) => {
-    const b = p(
+    const T = p(
       e.typography,
       t.title,
-      I[i],
-      R[a],
+      I[m],
+      R[c],
       A[d],
       {
         [e.strikethrough]: !!_ && !s,
         [e.underline]: !!s && !_,
         [e.underlineStrikethrough]: !!_ && !!s
       },
-      r
+      i
     );
-    return /* @__PURE__ */ T(m || "h1", { ref: h, className: b, ...n, children: c });
+    return /* @__PURE__ */ E(a || "h1", { ref: h, className: T, ...n, children: r });
   }
 );
 F.displayName = "Title";

package/components/Typography/constants.js

@@ -1,5 +1,5 @@
 import "./enums.js";
-import { F as A } from "../../chunks/constants-BG01GOrx.js";
+import { F as A } from "../../chunks/constants-BJYXBm7r.js";
 export {
   A as FONT_TYPE_TO_CLASS_NAME_MAP
 };

package/components/UnorderedList/UnorderedList.js

@@ -2,7 +2,7 @@ import { jsx as o } from "react/jsx-runtime";
 import s from "react";
 import { c as d } from "../../chunks/vendor-DE8Zvm0w.js";
 import { UnorderedListItem as i } from "./UnorderedListItem.js";
-const m = "unorderedList__7e5bc420", n = {
+const m = "unorderedList__1f40910d", n = {
   unorderedList: m
 }, a = Object.assign(
   s.forwardRef(({ className: r, ...e }, t) => /* @__PURE__ */ o(
@@ -10,7 +10,7 @@ const m = "unorderedList__7e5bc420", n = {
     {
       className: d(n.unorderedList, r),
       ...e,
-      "data-tx": "0.17.0",
+      "data-tx": "0.19.0",
       ref: t
     }
   )),

package/components/UnorderedList/UnorderedListItem.js

@@ -5,17 +5,17 @@ import { ETextSize as i } from "../Typography/enums.js";
 import "../Typography/Caption.js";
 import { Text as d } from "../Typography/Text.js";
 import "../Typography/Title.js";
-const a = "unorderedListItem__139fc54c", c = {
+const a = "unorderedListItem__e80ff3f8", f = {
   unorderedListItem: a
 }, n = m.forwardRef(
   ({ className: t, ...e }, r) => /* @__PURE__ */ o(
     d,
     {
-      className: s(c.unorderedListItem, t),
+      className: s(f.unorderedListItem, t),
       size: i.B3,
       tag: "li",
       ...e,
-      "data-tx": "0.17.0",
+      "data-tx": "0.19.0",
       ref: r
     }
   )

package/components/UploadZone/UploadZone.js

@@ -1,99 +1,107 @@
-import { jsx as I, jsxs as P } from "react/jsx-runtime";
-import { forwardRef as w, useState as x, useRef as A, useCallback as t, createElement as U, useEffect as N } from "react";
-import H from "react-dom";
-import { c as R } from "../../chunks/vendor-DE8Zvm0w.js";
-import { s as D, U as M } from "../../chunks/UploadZoneInput-BuIUwilQ.js";
+import { jsx as P, jsxs as w } from "react/jsx-runtime";
+import { forwardRef as H, useState as x, useRef as U, useCallback as r, createElement as R, useEffect as g } from "react";
+import y from "react-dom";
+import { c as C } from "../../chunks/vendor-DE8Zvm0w.js";
+import { s as Z, U as W } from "../../chunks/UploadZoneInput-CPReFDxM.js";
 import { UploadZoneContext as S } from "./UploadZoneContext.js";
 const T = Object.assign(
-  w((y, O) => {
+  H((O, b) => {
     const {
-      dropZoneContainer: r,
-      children: b,
-      className: u,
-      onChange: p,
-      renderContainerContent: a,
-      onDrop: o,
-      onDragOver: s,
-      ...f
-    } = y, [g, v] = x(!1), [l, j] = x(void 0), n = A(0), c = A(null), d = t(() => {
-      n.current += 1, n.current === 1 && v(!0);
-    }, []), i = t(() => {
-      n.current -= 1, n.current === 0 && v(!1);
-    }, []), h = t(
+      dropZoneContainer: n,
+      children: j,
+      className: p,
+      onChange: f,
+      renderContainerContent: s,
+      onDrop: c,
+      onDragOver: l,
+      ...m
+    } = O, [h, v] = x(!1), [d, I] = x(void 0), t = U(0), o = U(null), i = r(() => {
+      t.current += 1, t.current === 1 && v(!0);
+    }, []), u = r(() => {
+      t.current -= 1, t.current === 0 && v(!1);
+    }, []), E = r(
       (e) => {
-        e && (e.addEventListener("dragenter", d), e.addEventListener("dragleave", i));
+        e && (e.addEventListener("dragenter", i), e.addEventListener("dragleave", u));
       },
-      [d, i]
-    ), E = t(
+      [i, u]
+    ), N = r(
       (e) => {
-        e && (e.removeEventListener("dragenter", d), e.removeEventListener("dragleave", i));
+        e && (e.removeEventListener("dragenter", i), e.removeEventListener("dragleave", u));
       },
-      [d, i]
-    ), Z = t(
+      [i, u]
+    ), A = r(
       (e) => {
-        e.preventDefault(), s == null || s(e);
+        e.preventDefault(), l == null || l(e);
       },
-      [s]
-    ), L = t(
+      [l]
+    ), L = r(
       (e) => {
-        e.preventDefault(), o == null || o(e), p(e.dataTransfer.files, e), v(!1), n.current = 0;
+        e.preventDefault(), c == null || c(e), f(e.dataTransfer.files, e), v(!1), t.current = 0;
       },
-      [p, o]
-    ), k = t(() => {
+      [f, c]
+    ), k = r(() => {
       const e = document.createElement("div");
-      return H.render(
-        /* @__PURE__ */ U(
+      return y.render(
+        /* @__PURE__ */ R(
           "div",
           {
-            className: R(D.uploadZoneContainerDragArea, u),
-            onDragOver: Z,
+            className: C(Z.uploadZoneContainerDragArea, p),
+            onDragOver: A,
             onDrop: L,
-            ...f,
+            ...m,
             key: "uploadZoneDragArea",
             role: "none"
           },
-          a == null ? void 0 : a()
+          s == null ? void 0 : s()
         ),
         e
       ), e;
-    }, [u, Z, L, a, f]);
-    N(() => (h(r), () => {
-      E(r);
-    }), [r, h, E]), N(() => {
-      r && (g ? (c.current = k(), r.appendChild(c.current)) : c.current && r.removeChild(c.current));
-    }, [g, r, k]);
-    const m = () => {
-      l == null || l.click();
-    }, C = (e) => {
-      e.stopPropagation(), m();
+    }, [p, A, L, s, m]), a = r(() => {
+      const e = o.current;
+      e && (y.unmountComponentAtNode(e), e.parentNode && e.parentNode.removeChild(e), o.current = null);
+    }, []);
+    g(() => (E(n), () => {
+      N(n);
+    }), [n, E, N]), g(() => {
+      n && (h ? o.current && n.contains(o.current) || (a(), o.current = k(), n.appendChild(o.current)) : a());
+    }, [h, n, k, a]), g(
+      () => () => {
+        a(), t.current = 0;
+      },
+      [a]
+    );
+    const D = () => {
+      d == null || d.click();
+    }, M = (e) => {
+      e.stopPropagation(), D();
     };
-    return /* @__PURE__ */ I(
+    return /* @__PURE__ */ P(
       S.Provider,
       {
         value: {
-          inputNode: l,
-          onChange: p,
-          openUploadDialog: m,
-          setInputNode: j
+          inputNode: d,
+          onChange: f,
+          openUploadDialog: D,
+          setInputNode: I
         },
-        children: /* @__PURE__ */ P("div", { className: D.uploadZone, "data-tx": "0.17.0", ref: O, children: [
-          /* @__PURE__ */ U(
+        children: /* @__PURE__ */ w("div", { className: Z.uploadZone, "data-tx": "0.19.0", ref: b, children: [
+          /* @__PURE__ */ R(
             "div",
             {
-              className: R(D.uploadZoneDragArea, u),
-              onClick: C,
-              ...f,
+              className: C(Z.uploadZoneDragArea, p),
+              onClick: M,
+              ...m,
               key: "uploadZoneDragArea",
               role: "none"
             }
           ),
-          b({ openUploadDialog: m })
+          j({ openUploadDialog: D })
         ] })
       }
     );
   }),
   {
-    Input: M
+    Input: W
   }
 );
 T.displayName = "UploadZone";