@payfit/unity-components 1.1.0 → 1.2.0

package/dist/esm/components/task-menu/parts/SubTask.js

@@ -1,16 +1,16 @@
-import { jsxs as s, jsx as t, Fragment as f } from "react/jsx-runtime";
-import { forwardRef as O, useEffect as z } from "react";
-import { uyTv as E } from "@payfit/unity-themes";
-import { Link as F, Button as R } from "react-aria-components";
-import { useIntl as A, FormattedMessage as g } from "react-intl";
-import { useRouter as D } from "../../../providers/router/RouterProvider.js";
-import { Icon as y } from "../../icon/Icon.js";
-import { Text as I } from "../../text/Text.js";
-import { useTaskMenuContext as V } from "../TaskMenu.context.js";
-import G from "./dot.svg.js";
-import { commonTask as H } from "./task.variants.js";
-const J = E({
-  extend: H,
+import { jsxs as a, jsx as e, Fragment as d } from "react/jsx-runtime";
+import { forwardRef as L, useEffect as j } from "react";
+import { uyTv as O } from "@payfit/unity-themes";
+import { Link as z, Button as E } from "react-aria-components";
+import { useIntl as F, FormattedMessage as i } from "react-intl";
+import { useRouter as P } from "../../../providers/router/RouterProvider.js";
+import { Icon as p } from "../../icon/Icon.js";
+import { Text as R } from "../../text/Text.js";
+import { useTaskMenuContext as A } from "../TaskMenu.context.js";
+import D from "./dot.svg.js";
+import { commonTask as I } from "./task.variants.js";
+const V = O({
+  extend: I,
   slots: {
     base: ["uy:gap-300 uy:py-100", "uy:md:py-50"],
     dot: ["uy:self-center"],
@@ -71,25 +71,25 @@ const J = E({
       }
     }
   ]
-}), K = (o, n, e) => {
-  switch (o) {
+}), B = (t, o, n) => {
+  switch (t) {
     case "completed":
-      return /* @__PURE__ */ s(f, { children: [
-        /* @__PURE__ */ t(
-          y,
+      return /* @__PURE__ */ a(d, { children: [
+        /* @__PURE__ */ e(
+          p,
           {
-            className: e == null ? void 0 : e.completed,
+            className: n?.completed,
             src: "CheckCircleOutlined",
             size: 20,
             color: "content.success",
-            alt: n.formatMessage({
+            alt: o.formatMessage({
               id: "unity:component:task-menu:task:completed:label",
               defaultMessage: "Completed"
             })
           }
         ),
-        /* @__PURE__ */ t("span", { className: "uy:sr-only", children: /* @__PURE__ */ t(
-          g,
+        /* @__PURE__ */ e("span", { className: "uy:sr-only", children: /* @__PURE__ */ e(
+          i,
           {
             id: "unity:component:task-menu:task:completed:label",
             defaultMessage: "Completed"
@@ -97,23 +97,23 @@ const J = E({
         ) })
       ] });
     case "locked":
-      return /* @__PURE__ */ s(f, { children: [
-        /* @__PURE__ */ t(
-          y,
+      return /* @__PURE__ */ a(d, { children: [
+        /* @__PURE__ */ e(
+          p,
           {
             "aria-hidden": "true",
-            className: e == null ? void 0 : e.locked,
+            className: n?.locked,
             src: "LockOutlined",
             size: 20,
             color: "content.neutral.lowest",
-            alt: n.formatMessage({
+            alt: o.formatMessage({
               id: "unity:component:task-menu:task:lock:label",
               defaultMessage: "Locked"
             })
           }
         ),
-        /* @__PURE__ */ t("span", { className: "uy:sr-only", children: /* @__PURE__ */ t(
-          g,
+        /* @__PURE__ */ e("span", { className: "uy:sr-only", children: /* @__PURE__ */ e(
+          i,
           {
             id: "unity:component:task-menu:task:lock:label",
             defaultMessage: "Locked"
@@ -123,63 +123,63 @@ const J = E({
     default:
       return null;
   }
-}, Q = O(
+}, G = L(
   ({
-    href: o,
-    label: n,
-    taskStatus: e = "uncompleted",
-    isExact: i,
-    isDisabled: b,
-    onPress: d,
+    href: t,
+    label: o,
+    taskStatus: n = "uncompleted",
+    isExact: l,
+    isDisabled: y,
+    onPress: f,
     uniqueId: r,
-    ...p
-  }, h) => {
-    const k = A(), u = D(), { currentTask: a, setCurrentTask: l, state: m } = V();
-    z(() => {
-      o && (u != null && u.isActive(o.toString(), i)) && (l == null || l({ uniqueId: r, label: n }));
-    }, [o, i, u, r, n]);
-    const c = (a == null ? void 0 : a.uniqueId) === r, { base: v, element: M, text: w, dot: L, lock: S } = J({
-      isSelected: c,
-      taskStatus: e
-    }), j = Object.assign(
+    ...c
+  }, g) => {
+    const k = F(), u = P(), { currentTask: b, setCurrentTask: m, state: h } = A();
+    j(() => {
+      t && u?.isActive(t.toString(), l) && m?.({ uniqueId: r, label: o });
+    }, [t, l, u, r, o]);
+    const s = b?.uniqueId === r, { base: v, element: S, text: x, dot: N, lock: M } = V({
+      isSelected: s,
+      taskStatus: n
+    }), T = Object.assign(
       {},
-      c !== void 0 && {
-        "data-current": c,
-        "aria-current": c ? "page" : void 0
+      s !== void 0 && {
+        "data-current": s,
+        "aria-current": s ? "page" : void 0
       }
-    ), x = o ? F : R;
-    return /* @__PURE__ */ s(
+    ), w = t ? z : E;
+    return /* @__PURE__ */ a(
       "li",
       {
-        ref: h,
+        ref: g,
         className: v(),
-        ...c ? { "data-current": !0 } : {},
-        ...p,
+        ...s ? { "data-current": !0 } : {},
+        ...c,
         children: [
-          /* @__PURE__ */ t(G, { width: 8, height: 8, className: L(), role: "presentation" }),
-          /* @__PURE__ */ s(
-            x,
+          /* @__PURE__ */ e(D, { width: 8, height: 8, className: N(), role: "presentation" }),
+          /* @__PURE__ */ a(
+            w,
             {
-              className: M(),
-              href: o,
-              onPress: (N) => {
-                l == null || l({ uniqueId: r, label: n }), m == null || m.toggle(), d == null || d(N);
+              className: S(),
+              href: t,
+              onPress: (C) => {
+                m?.({ uniqueId: r, label: o }), h?.toggle(), f?.(C);
               },
-              isDisabled: b,
-              ...j,
-              ...p,
+              isDisabled: y,
+              ...T,
+              ...c,
               children: [
-                /* @__PURE__ */ t(
-                  I,
+                /* @__PURE__ */ e(
+                  R,
                   {
                     asElement: "span",
-                    className: w(),
-                    variant: c ? "bodyStrong" : "body",
-                    children: n
+                    className: x(),
+                    variant: s ? "bodyStrong" : "body",
+                    children: o
                   }
                 ),
-                K(e, k, {
-                  locked: S(),
+                B(n, k, {
+                  locked: M(),
                   completed: "uy:self-center"
                 })
               ]
@@ -190,8 +190,8 @@ const J = E({
     );
   }
 );
-Q.displayName = "SubTask";
+G.displayName = "SubTask";
 export {
-  Q as SubTask,
-  J as subTask
+  G as SubTask,
+  V as subTask
 };

package/dist/esm/components/task-menu/parts/Task.js

@@ -1,15 +1,15 @@
-import { jsxs as l, jsx as e, Fragment as k } from "react/jsx-runtime";
-import { forwardRef as w, useEffect as z } from "react";
-import { uyTv as A } from "@payfit/unity-themes";
-import { Link as B, Button as C } from "react-aria-components";
-import { useIntl as V, FormattedMessage as b } from "react-intl";
-import { useRouter as D } from "../../../providers/router/RouterProvider.js";
-import { Icon as h } from "../../icon/Icon.js";
-import { Text as v } from "../../text/Text.js";
-import { useTaskMenuContext as G } from "../TaskMenu.context.js";
-import { commonTask as H } from "./task.variants.js";
-const I = A({
-  extend: H,
+import { jsxs as r, jsx as e, Fragment as p } from "react/jsx-runtime";
+import { forwardRef as G, useEffect as P } from "react";
+import { uyTv as R } from "@payfit/unity-themes";
+import { Link as w, Button as z } from "react-aria-components";
+import { useIntl as A, FormattedMessage as g } from "react-intl";
+import { useRouter as B } from "../../../providers/router/RouterProvider.js";
+import { Icon as y } from "../../icon/Icon.js";
+import { Text as k } from "../../text/Text.js";
+import { useTaskMenuContext as V } from "../TaskMenu.context.js";
+import { commonTask as D } from "./task.variants.js";
+const H = R({
+  extend: D,
   slots: {
     base: [],
     element: ["uy:p-200", "uy:md:p-0"],
@@ -55,103 +55,103 @@ const I = A({
       }
     }
   ]
-}), J = w(
+}), I = G(
   ({
-    href: n,
-    isExact: p = !1,
-    label: s,
-    onPress: m,
-    taskNumber: x,
-    taskStatus: c = "uncompleted",
-    children: N,
-    uniqueId: o,
-    ...y
-  }, S) => {
-    const r = D(), g = V(), {
-      currentTask: u,
-      setCurrentTask: t,
-      state: d,
-      expandedTaskGroup: f,
-      toggleTaskGroup: i
-    } = G(), M = n ? B : C;
-    z(() => {
-      n && (r != null && r.isActive(n.toString(), p)) && (t == null || t({ uniqueId: o, label: s }));
-    }, [n, p, r, s, o]);
-    const a = (u == null ? void 0 : u.uniqueId) === o, L = Object.assign(
+    href: s,
+    isExact: l = !1,
+    label: a,
+    onPress: f,
+    taskNumber: b,
+    taskStatus: o = "uncompleted",
+    children: h,
+    uniqueId: n,
+    ...u
+  }, v) => {
+    const c = B(), m = A(), {
+      currentTask: x,
+      setCurrentTask: d,
+      state: N,
+      expandedTaskGroup: i,
+      toggleTaskGroup: T
+    } = V(), S = s ? w : z;
+    P(() => {
+      s && c?.isActive(s.toString(), l) && d?.({ uniqueId: n, label: a });
+    }, [s, l, c, a, n]);
+    const t = x?.uniqueId === n, M = Object.assign(
       {},
-      a !== void 0 && {
-        "data-current": a,
-        "aria-current": a ? "page" : void 0
+      t !== void 0 && {
+        "data-current": t,
+        "aria-current": t ? "page" : void 0
       }
-    ), { base: j, number: E, element: O, text: F, lock: R } = I({
-      isSelected: a,
-      taskStatus: c
+    ), { base: C, number: L, element: j, text: E, lock: O } = H({
+      isSelected: t,
+      taskStatus: o
     });
-    return /* @__PURE__ */ l("li", { ref: S, className: j(), ...y, children: [
-      /* @__PURE__ */ l(
-        M,
+    return /* @__PURE__ */ r("li", { ref: v, className: C(), ...u, children: [
+      /* @__PURE__ */ r(
+        S,
         {
-          className: O(),
-          href: n,
-          onPress: (T) => {
-            t == null || t({ uniqueId: o, label: s }), d == null || d.toggle(), f && (i == null || i(f)), m == null || m(T);
+          className: j(),
+          href: s,
+          onPress: (F) => {
+            d?.({ uniqueId: n, label: a }), N?.toggle(), i && T?.(i), f?.(F);
           },
-          ...L,
-          ...y,
+          ...M,
+          ...u,
           children: [
-            /* @__PURE__ */ e("div", { className: E(), children: c === "completed" ? /* @__PURE__ */ l(k, { children: [
+            /* @__PURE__ */ e("div", { className: L(), children: o === "completed" ? /* @__PURE__ */ r(p, { children: [
               /* @__PURE__ */ e(
-                h,
+                y,
                 {
                   size: 24,
                   "aria-hidden": "true",
                   src: "CheckOutlined",
-                  alt: g.formatMessage({
+                  alt: m.formatMessage({
                     id: "unity:component:task-menu:task:completed:label",
                     defaultMessage: "Completed"
                   })
                 }
               ),
               /* @__PURE__ */ e("span", { className: "uy:sr-only", children: /* @__PURE__ */ e(
-                b,
+                g,
                 {
                   id: "unity:component:task-menu:task:completed:label",
                   defaultMessage: "Completed"
                 }
               ) })
             ] }) : /* @__PURE__ */ e(
-              v,
+              k,
               {
                 asElement: "span",
-                variant: a ? "bodyStrong" : "body",
+                variant: t ? "bodyStrong" : "body",
                 className: "uy:leading-[1]",
-                children: x
+                children: b
               }
             ) }),
             /* @__PURE__ */ e(
-              v,
+              k,
               {
                 asElement: "span",
-                className: F(),
-                variant: a ? "bodyStrong" : "body",
-                children: s
+                className: E(),
+                variant: t ? "bodyStrong" : "body",
+                children: a
               }
             ),
-            c === "locked" && /* @__PURE__ */ l(k, { children: [
+            o === "locked" && /* @__PURE__ */ r(p, { children: [
               /* @__PURE__ */ e(
-                h,
+                y,
                 {
                   "aria-hidden": "true",
-                  className: R(),
+                  className: O(),
                   src: "LockOutlined",
-                  alt: g.formatMessage({
+                  alt: m.formatMessage({
                     id: "unity:component:task-menu:task:lock:label",
                     defaultMessage: "Locked"
                   })
                 }
               ),
               /* @__PURE__ */ e("span", { className: "uy:sr-only", children: /* @__PURE__ */ e(
-                b,
+                g,
                 {
                   id: "unity:component:task-menu:task:lock:label",
                   defaultMessage: "Locked"
@@ -161,12 +161,12 @@ const I = A({
           ]
         }
       ),
-      N
+      h
     ] });
   }
 );
-J.displayName = "Task";
+I.displayName = "Task";
 export {
-  J as Task,
-  I as task
+  I as Task,
+  H as task
 };

package/dist/esm/components/task-menu/parts/TaskGroup.js

@@ -1,11 +1,11 @@
-import { jsxs as c, jsx as n } from "react/jsx-runtime";
-import { forwardRef as j, Children as d, isValidElement as u, cloneElement as A } from "react";
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { forwardRef as j, Children as i, isValidElement as u, cloneElement as A } from "react";
 import { uyTv as V } from "@payfit/unity-themes";
 import { useId as $ } from "react-aria";
 import { Button as B } from "react-aria-components";
 import { useIntl as D } from "react-intl";
 import { Icon as F } from "../../icon/Icon.js";
-import { Text as g } from "../../text/Text.js";
+import { Text as f } from "../../text/Text.js";
 import { useTaskMenuContext as H } from "../TaskMenu.context.js";
 import { commonTask as O } from "./task.variants.js";
 const P = V({
@@ -71,56 +71,56 @@ const P = V({
       }
     }
   ]
-}), R = (e, t) => e ? d.toArray(t).some(
-  (r) => u(r) && r.props.uniqueId === e
-) : !1, U = (e) => e ? d.toArray(e).find(
+}), R = (e, t) => e ? i.toArray(t).some(
+  (s) => u(s) && s.props.uniqueId === e
+) : !1, U = (e) => e ? i.toArray(e).find(
   (t) => u(t) && t.props.taskStatus !== "completed" && t.props.taskStatus !== "locked"
 ) : null, J = j(
   ({
     children: e,
     label: t,
-    taskNumber: r,
-    taskStatus: p = "uncompleted",
-    uniqueId: y,
-    ...S
-  }, h) => {
-    const { currentTask: l, setCurrentTask: i, toggleTaskGroup: m, expandedTaskGroup: k } = H(), b = $(), T = D(), a = k === y, N = (o) => {
-      if (m == null || m(y), !o) {
-        const x = U(e);
-        if (u(x)) {
-          const { uniqueId: M, label: W } = x.props;
-          i == null || i({ uniqueId: M, label: W });
+    taskNumber: s,
+    taskStatus: m = "uncompleted",
+    uniqueId: c,
+    ...g
+  }, k) => {
+    const { currentTask: v, setCurrentTask: x, toggleTaskGroup: S, expandedTaskGroup: h } = H(), d = $(), T = D(), a = h === c, N = (n) => {
+      if (S?.(c), !n) {
+        const b = U(e);
+        if (u(b)) {
+          const { uniqueId: M, label: W } = b.props;
+          x?.({ uniqueId: M, label: W });
         }
       }
-    }, I = d.map(e, (o) => u(o) ? A(o, { isDisabled: !a }) : o), f = `${b}-toggle`, v = `${b}-content`, s = R(
-      l == null ? void 0 : l.uniqueId,
+    }, I = i.map(e, (n) => u(n) ? A(n, { isDisabled: !a }) : n), p = `${d}-toggle`, y = `${d}-content`, o = R(
+      v?.uniqueId,
       e
-    ), { base: w, number: E, text: z, bar: q, element: C, containerSubTasks: G } = P({
-      taskStatus: p,
-      hasSelectedSubTask: s,
+    ), { base: w, number: C, text: E, bar: G, element: z, containerSubTasks: q } = P({
+      taskStatus: m,
+      hasSelectedSubTask: o,
       expanded: a
     });
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ l(
       "li",
       {
-        ref: h,
+        ref: k,
         "data-group": "true",
-        "data-active-group": s,
+        "data-active-group": o,
         className: w(),
         children: [
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ l(
             B,
             {
-              id: f,
-              className: C(),
+              id: p,
+              className: z(),
               onPress: () => {
                 N(a);
               },
               "aria-expanded": a,
-              "aria-controls": v,
-              ...S,
+              "aria-controls": y,
+              ...g,
               children: [
-                /* @__PURE__ */ n("div", { className: E(), children: p === "completed" ? /* @__PURE__ */ n(
+                /* @__PURE__ */ r("div", { className: C(), children: m === "completed" ? /* @__PURE__ */ r(
                   F,
                   {
                     size: 24,
@@ -130,39 +130,39 @@ const P = V({
                       defaultMessage: "Completed"
                     })
                   }
-                ) : /* @__PURE__ */ n(
-                  g,
+                ) : /* @__PURE__ */ r(
+                  f,
                   {
                     asElement: "span",
-                    variant: s ? "bodyStrong" : "body",
+                    variant: o ? "bodyStrong" : "body",
                     className: "uy:leading-[1]",
-                    children: r
+                    children: s
                   }
                 ) }),
-                /* @__PURE__ */ n(
-                  g,
+                /* @__PURE__ */ r(
+                  f,
                   {
                     asElement: "span",
-                    className: z(),
-                    variant: s ? "bodyStrong" : "body",
+                    className: E(),
+                    variant: o ? "bodyStrong" : "body",
                     children: t
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ c("div", { style: { maxHeight: a ? 1e3 : 0 }, children: [
-            /* @__PURE__ */ n(
+          /* @__PURE__ */ l("div", { style: { maxHeight: a ? 1e3 : 0 }, children: [
+            /* @__PURE__ */ r(
               "ol",
               {
-                id: v,
-                "aria-labelledby": f,
+                id: y,
+                "aria-labelledby": p,
                 "aria-hidden": !a,
-                className: G(),
+                className: q(),
                 children: I
               }
             ),
-            /* @__PURE__ */ n("div", { role: "presentation", className: q() })
+            /* @__PURE__ */ r("div", { role: "presentation", className: G() })
           ] })
         ]
       }