@alxgrn/telefrag-ui 0.0.30 → 0.0.31

package/dist/components/form/date/Date.js

@@ -10,12 +10,12 @@ const z = ({
   label: n,
   placeholder: e,
   top: s,
-  bottom: u,
-  required: i = !1,
+  bottom: m,
+  required: c = !1,
   disabled: p = !1
 }) => {
-  const c = C(null), [d, f] = k(!1), m = () => !!(i && !P(r)), g = () => {
-    if (m()) return {
+  const i = C(null), [d, f] = k(!1), u = () => !!(c && !P(r)), g = () => {
+    if (u()) return {
       caretColor: "var(--alxgrn-input-border-error)",
       borderColor: "var(--alxgrn-input-border-error)",
       backgroundColor: "var(--alxgrn-input-bg-error)"
@@ -29,16 +29,16 @@ const z = ({
       $,
       {
         top: s,
-        bottom: u,
+        bottom: m,
         label: n,
-        required: i,
+        required: c,
         disabled: p,
-        error: m(),
+        error: u(),
         children: /* @__PURE__ */ l(
           "input",
           {
             id: o,
-            ref: c,
+            ref: i,
             type: "text",
             value: r,
             onChange: (a) => t(a.target.value),
@@ -50,10 +50,10 @@ const z = ({
         )
       }
     ),
-    /* @__PURE__ */ l(
+    i.current && /* @__PURE__ */ l(
       I,
       {
-        parent: c,
+        parent: i.current,
         isOpen: d,
         onClose: () => f(!1),
         horizontal: "inner-left",

package/dist/components/form/time/Time.js

@@ -4,38 +4,38 @@ import L from "../label/Label.js";
 import { Menu as y } from "../../ui/menu/Menu.js";
 import '../../../assets/Time.css';/* empty css                     */
 const J = ({
-  id: m,
-  value: u,
-  step: p = 1,
+  id: p,
+  value: d,
+  step: x = 1,
   onChange: t,
   label: M,
   top: b,
   bottom: g,
-  required: d = !1,
+  required: $ = !1,
   disabled: o = !1
 }) => {
-  const x = O(null), $ = O(null), [l, N] = n(""), [a, C] = n(""), [I, j] = n([]), [w, z] = n([]), [E, c] = n(!1), [S, f] = n(!1);
+  const l = O(null), a = O(null), [c, N] = n(""), [f, C] = n(""), [I, j] = n([]), [w, z] = n([]), [E, u] = n(!1), [S, m] = n(!1);
   k(() => {
-    let [e, r] = u.split(":");
-    e = parseInt(e), r = parseInt(r), (isNaN(e) || e < 0 || e > 23) && (e = 0), (isNaN(r) || r < 0 || r > 59) && (r = 0), e = `0${e}`.slice(-2), r = `0${r}`.slice(-2), N(e), C(r), t && t(`${e}:${r}`);
-  }, [u, t]), k(() => {
-    const e = [], r = [];
+    let [r, e] = d.split(":");
+    r = parseInt(r), e = parseInt(e), (isNaN(r) || r < 0 || r > 23) && (r = 0), (isNaN(e) || e < 0 || e > 59) && (e = 0), r = `0${r}`.slice(-2), e = `0${e}`.slice(-2), N(r), C(e), t && t(`${r}:${e}`);
+  }, [d, t]), k(() => {
+    const r = [], e = [];
     for (let s = 0; s < 24; s++)
-      e.push(`0${s}`.slice(-2));
-    for (let s = 0; s < 60; s += p)
       r.push(`0${s}`.slice(-2));
-    j(e), z(r);
-  }, [p]);
-  const h = () => !!(d && (!l || !a)), v = () => {
+    for (let s = 0; s < 60; s += x)
+      e.push(`0${s}`.slice(-2));
+    j(r), z(e);
+  }, [x]);
+  const h = () => !!($ && (!c || !f)), v = () => {
     if (h()) return {
       caretColor: "var(--alxgrn-input-border-error)",
       borderColor: "var(--alxgrn-input-border-error)",
       backgroundColor: "var(--alxgrn-input-bg-error)"
     };
-  }, T = (e) => {
-    c(!1), t && t(`${e.text ?? ""}:${a}`);
-  }, F = (e) => {
-    f(!1), t && t(`${l}:${e.text ?? ""}`);
+  }, T = (r) => {
+    u(!1), t && t(`${r.text ?? ""}:${f}`);
+  }, F = (r) => {
+    m(!1), t && t(`${c}:${r.text ?? ""}`);
   };
   return /* @__PURE__ */ H("div", { className: "FormItem", children: [
     /* @__PURE__ */ i(
@@ -44,20 +44,20 @@ const J = ({
         top: b,
         bottom: g,
         label: M,
-        required: d,
+        required: $,
         disabled: o,
         error: h(),
         children: /* @__PURE__ */ H("div", { className: "Time", children: [
           /* @__PURE__ */ i(
             "input",
             {
-              id: `${m}-hor`,
-              ref: x,
+              id: `${p}-hor`,
+              ref: l,
               type: "text",
-              value: l,
+              value: c,
               style: v(),
               disabled: !!o,
-              onClick: () => c(!0),
+              onClick: () => u(!0),
               readOnly: !0
             }
           ),
@@ -65,42 +65,42 @@ const J = ({
           /* @__PURE__ */ i(
             "input",
             {
-              id: `${m}-min`,
-              ref: $,
+              id: `${p}-min`,
+              ref: a,
               type: "text",
-              value: a,
+              value: f,
               style: v(),
               disabled: !!o,
-              onClick: () => f(!0),
+              onClick: () => m(!0),
               readOnly: !0
             }
           )
         ] })
       }
     ),
-    /* @__PURE__ */ i(
+    l.current && /* @__PURE__ */ i(
       y,
       {
-        parent: x,
+        parent: l.current,
         isOpen: E,
-        onClose: () => c(!1),
+        onClose: () => u(!1),
         horizontal: "inner-left",
         margin: "var(--alxgrn-unit-small)",
-        items: I.map((e) => ({ id: e, text: e })),
+        items: I.map((r) => ({ id: r, text: r })),
         onClick: T,
         maxHeight: "auto",
         width: "parent"
       }
     ),
-    /* @__PURE__ */ i(
+    a.current && /* @__PURE__ */ i(
       y,
       {
-        parent: $,
+        parent: a.current,
         isOpen: S,
-        onClose: () => f(!1),
+        onClose: () => m(!1),
         horizontal: "inner-left",
         margin: "var(--alxgrn-unit-small)",
-        items: w.map((e) => ({ id: e, text: e })),
+        items: w.map((r) => ({ id: r, text: r })),
         onClick: F,
         maxHeight: "auto",
         width: "parent"

package/dist/components/ui/popup/Popup.d.ts

@@ -1,6 +1,6 @@
-import { default as React, FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 export interface PopupProps {
-    parent: React.RefObject<HTMLElement>;
+    parent: HTMLElement;
     isOpen: boolean;
     onClose: () => void;
     margin?: string;

package/dist/components/ui/popup/Popup.js

@@ -1,11 +1,11 @@
-import { jsx as a } from "react/jsx-runtime";
+import { jsx as s } from "react/jsx-runtime";
 import { useRef as v, useState as y, useEffect as m } from "react";
 import { CSSTransition as L } from "react-transition-group";
 import S from "../portal/Portal.js";
 import { ANIMATION_LENGTH as T } from "../../../config.js";
 import '../../../assets/Popup.css';/* empty css                      */
 const N = T, M = ({
-  parent: s,
+  parent: u,
   isOpen: d,
   onClose: c,
   vertical: p = "auto",
@@ -16,14 +16,14 @@ const N = T, M = ({
   position: l = "absolute",
   children: E
 }) => {
-  const u = v(null), [w, g] = y({}), [x, k] = y({});
+  const a = v(null), [w, g] = y({}), [x, k] = y({});
   return m(() => {
     if (!d) return;
-    if (!s.current) {
+    if (!u) {
       g({}), k({});
       return;
     }
-    const r = document.documentElement.clientWidth, n = document.documentElement.clientHeight, e = s.current.getBoundingClientRect();
+    const r = document.documentElement.clientWidth, n = document.documentElement.clientHeight, e = u.getBoundingClientRect();
     k({
       position: l,
       top: l === "fixed" ? e.top : e.top + window.scrollY,
@@ -70,9 +70,9 @@ const N = T, M = ({
         break;
     }
     g(t);
-  }, [s, d, o, p, f, h, b, l]), m(() => {
+  }, [u, d, o, p, f, h, b, l]), m(() => {
     const r = (n) => {
-      u.current && !u.current.contains(n.target) && c();
+      a.current && !a.current.contains(n.target) && c();
     };
     return document.addEventListener("click", r, !0), () => {
       document.removeEventListener("click", r, !0);
@@ -84,15 +84,15 @@ const N = T, M = ({
     return document.body.addEventListener("keydown", r), () => {
       document.body.removeEventListener("keydown", r);
     };
-  }, [c]), /* @__PURE__ */ a(S, { id: "alxgrn-popup", children: /* @__PURE__ */ a(
+  }, [c]), /* @__PURE__ */ s(S, { id: "alxgrn-popup", children: /* @__PURE__ */ s(
     L,
     {
       in: d,
       timeout: N,
       unmountOnExit: !0,
       classNames: "Popup",
-      nodeRef: u,
-      children: /* @__PURE__ */ a("div", { className: "Popup", style: x, children: /* @__PURE__ */ a("div", { className: "PopupInner", ref: u, style: w, children: E }) })
+      nodeRef: a,
+      children: /* @__PURE__ */ s("div", { className: "Popup", style: x, children: /* @__PURE__ */ s("div", { className: "PopupInner", ref: a, style: w, children: E }) })
     }
   ) });
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@alxgrn/telefrag-ui",
   "description": "UI library for The Daily Telefrag project",
-  "version": "0.0.30",
+  "version": "0.0.31",
   "private": false,
   "author": "Alexander Fedorov <alex@molner.ru>",
   "license": "Apache-2.0",
@@ -28,15 +28,15 @@
     "prepublishOnly": "npm run build"
   },
   "peerDependencies": {
-    "react": "^18.2.0",
+    "react": "^19.1.0",
     "react-children-utilities": "^2.10.0",
-    "react-dom": "^18.2.0",
+    "react-dom": "^19.1.0",
     "react-transition-group": "^4.4.5"
   },
   "devDependencies": {
     "@types/node": "^22.7.5",
-    "@types/react": "^18.2.37",
-    "@types/react-dom": "^18.2.15",
+    "@types/react": "^19.0.12",
+    "@types/react-dom": "^19.0.4",
     "@types/react-transition-group": "^4.4.11",
     "@typescript-eslint/eslint-plugin": "^6.10.0",
     "@typescript-eslint/parser": "^6.10.0",