@payfit/unity-components 2.47.5 → 2.47.6

package/dist/esm/components/nav/Nav.js

@@ -1,28 +1,22 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import u from "../../hooks/use-id.js";
-function o({ children: a, title: t, ...y }) {
-  const l = `nav-title-${u()}`;
-  return /* @__PURE__ */ n(
-    "nav",
-    {
-      ...y,
-      className: "uy:flex uy:flex-col uy:gap-50 uy:min-w-[264px]",
-      "aria-labelledby": l,
-      children: [
-        /* @__PURE__ */ e(
-          "h3",
-          {
-            id: l,
-            className: "uy:typography-body-strong uy:text-content-neutral uy:py-100 uy:px-150",
-            children: t
-          }
-        ),
-        /* @__PURE__ */ e("ul", { className: "uy:flex uy:flex-col uy:gap-50 uy:list-none", children: a })
-      ]
-    }
-  );
+import e from "../../hooks/use-id.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/nav/Nav.tsx
+function r({ children: r, title: i, ...a }) {
+	let o = `nav-title-${e()}`;
+	return /* @__PURE__ */ n("nav", {
+		...a,
+		className: "uy:flex uy:flex-col uy:gap-50 uy:min-w-[264px]",
+		"aria-labelledby": o,
+		children: [/* @__PURE__ */ t("h3", {
+			id: o,
+			className: "uy:typography-body-strong uy:text-content-neutral uy:py-100 uy:px-150",
+			children: i
+		}), /* @__PURE__ */ t("ul", {
+			className: "uy:flex uy:flex-col uy:gap-50 uy:list-none",
+			children: r
+		})]
+	});
 }
-o.displayName = "Nav";
-export {
-  o as Nav
-};
+r.displayName = "Nav";
+//#endregion
+export { r as Nav };

package/dist/esm/components/nav/parts/NavGroup.js

@@ -1,125 +1,105 @@
-import { jsxs as r, jsx as t } from "react/jsx-runtime";
-import s, { useState as j, useCallback as B, useMemo as D } from "react";
-import { uyTv as S } from "@payfit/unity-themes";
-import { Button as _ } from "react-aria-components/Button";
-import $ from "../../../hooks/use-id.js";
-import { Icon as k } from "../../icon/Icon.js";
-import { navItemBase as z } from "./RawNavItem.js";
-const H = S({
-  extend: z,
-  slots: {
-    base: "uy:theme-rebrand:border-1 uy:theme-rebrand:border-solid",
-    caret: "uy:transition-transform uy:duration-150 uy:delay-25 uy:ease-linear motion-reduce:transition-none",
-    contentWrapper: "uy:transition-[max-height] uy:duration-200 uy:ease-linear motion-reduce:transition-none",
-    content: "uy:list-none uy:flex uy:flex-col uy:gap-50 uy:transition-opacity uy:duration-150 uy:delay-25 uy:ease-linear"
-  },
-  variants: {
-    expanded: {
-      true: {
-        base: [
-          "uy:theme-legacy:bg-surface-neutral-low-active",
-          "uy:theme-rebrand:bg-surface-neutral uy:theme-rebrand:border-border-neutral uy:theme-rebrand:shadow-100"
-        ],
-        prefix: [
-          "uy:theme-legacy:text-content-neutral",
-          "uy:theme-rebrand:text-content-primary"
-        ],
-        caret: "uy:rotate-180",
-        contentWrapper: "uy:max-h-[1000px] uy:overflow-visible",
-        label: "uy:typography-body-strong",
-        content: "uy:opacity-100 uy:visible"
-      },
-      false: {
-        caret: "uy:rotate-0",
-        contentWrapper: "uy:max-h-0 uy:overflow-hidden",
-        content: "uy:opacity-0 uy:invisible uy:pointer-events-none",
-        label: "uy:typography-body",
-        base: "uy:theme-rebrand:border-transparent"
-      }
-    }
-  }
+import { Icon as e } from "../../icon/Icon.js";
+import t from "../../../hooks/use-id.js";
+import { navItemBase as n } from "./RawNavItem.js";
+import r, { useCallback as i, useMemo as a, useState as o } from "react";
+import { uyTv as s } from "@payfit/unity-themes";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Button as u } from "react-aria-components/Button";
+//#region src/components/nav/parts/NavGroup.tsx
+var d = s({
+	extend: n,
+	slots: {
+		base: "uy:theme-rebrand:border-1 uy:theme-rebrand:border-solid",
+		caret: "uy:transition-transform uy:duration-150 uy:delay-25 uy:ease-linear motion-reduce:transition-none",
+		contentWrapper: "uy:transition-[max-height] uy:duration-200 uy:ease-linear motion-reduce:transition-none",
+		content: "uy:list-none uy:flex uy:flex-col uy:gap-50 uy:transition-opacity uy:duration-150 uy:delay-25 uy:ease-linear"
+	},
+	variants: { expanded: {
+		true: {
+			base: ["uy:theme-legacy:bg-surface-neutral-low-active", "uy:theme-rebrand:bg-surface-neutral uy:theme-rebrand:border-border-neutral uy:theme-rebrand:shadow-100"],
+			prefix: ["uy:theme-legacy:text-content-neutral", "uy:theme-rebrand:text-content-primary"],
+			caret: "uy:rotate-180",
+			contentWrapper: "uy:max-h-[1000px] uy:overflow-visible",
+			label: "uy:typography-body-strong",
+			content: "uy:opacity-100 uy:visible"
+		},
+		false: {
+			caret: "uy:rotate-0",
+			contentWrapper: "uy:max-h-0 uy:overflow-hidden",
+			content: "uy:opacity-0 uy:invisible uy:pointer-events-none",
+			label: "uy:typography-body",
+			base: "uy:theme-rebrand:border-transparent"
+		}
+	} }
 });
-function M({
-  children: m,
-  label: y,
-  prefix: o,
-  suffix: p,
-  defaultExpanded: b = !1,
-  isExpanded: l,
-  onToggle: i,
-  ...f
-}) {
-  const u = $(), [x, h] = j(b), n = l !== void 0, a = n ? l : x, N = B(() => {
-    n || h((e) => !e), i?.(!a);
-  }, [n, a, i]), C = s.Children.map(m, (e) => s.isValidElement(e) ? s.cloneElement(e, { isDisabled: !a, level: 1 }) : e), c = `${u}-toggle`, d = `${u}-content`, {
-    baseClassName: v,
-    prefixClassName: g,
-    labelClassName: w,
-    suffixClassName: I,
-    contentClassName: W,
-    contentWrapperClassName: E,
-    caretClassName: G
-  } = D(() => {
-    const e = H({ level: 0, expanded: a });
-    return {
-      baseClassName: e.base({ className: "uy:w-full" }),
-      prefixClassName: e.prefix(),
-      suffixClassName: e.suffix(),
-      labelClassName: e.label(),
-      contentWrapperClassName: e.contentWrapper(),
-      contentClassName: e.content(),
-      caretClassName: e.caret()
-    };
-  }, [a]);
-  return /* @__PURE__ */ r("li", { className: "uy:flex uy:flex-col uy:gap-50", children: [
-    /* @__PURE__ */ r(
-      _,
-      {
-        id: c,
-        className: v,
-        onPress: N,
-        "aria-expanded": a,
-        "aria-controls": d,
-        ...f,
-        children: [
-          o && /* @__PURE__ */ t("span", { className: g, children: o({ isExpanded: a }) }),
-          /* @__PURE__ */ t("span", { className: w, children: y }),
-          /* @__PURE__ */ r("span", { className: I, role: "presentation", children: [
-            p,
-            /* @__PURE__ */ t(
-              k,
-              {
-                src: "CaretDownOutlined",
-                alt: "expand group",
-                size: 20,
-                className: G,
-                color: "inherit"
-              }
-            )
-          ] })
-        ]
-      }
-    ),
-    /* @__PURE__ */ t(
-      "div",
-      {
-        className: E,
-        style: { maxHeight: a ? 1e3 : 0 },
-        children: /* @__PURE__ */ t(
-          "ul",
-          {
-            id: d,
-            className: W,
-            "aria-labelledby": c,
-            "aria-hidden": !a,
-            children: C
-          }
-        )
-      }
-    )
-  ] });
+function f({ children: n, label: s, prefix: f, suffix: p, defaultExpanded: m = !1, isExpanded: h, onToggle: g, ..._ }) {
+	let v = t(), [y, b] = o(m), x = h !== void 0, S = x ? h : y, C = i(() => {
+		x || b((e) => !e), g?.(!S);
+	}, [
+		x,
+		S,
+		g
+	]), w = r.Children.map(n, (e) => r.isValidElement(e) ? r.cloneElement(e, {
+		isDisabled: !S,
+		level: 1
+	}) : e), T = `${v}-toggle`, E = `${v}-content`, { baseClassName: D, prefixClassName: O, labelClassName: k, suffixClassName: A, contentClassName: j, contentWrapperClassName: M, caretClassName: N } = a(() => {
+		let e = d({
+			level: 0,
+			expanded: S
+		});
+		return {
+			baseClassName: e.base({ className: "uy:w-full" }),
+			prefixClassName: e.prefix(),
+			suffixClassName: e.suffix(),
+			labelClassName: e.label(),
+			contentWrapperClassName: e.contentWrapper(),
+			contentClassName: e.content(),
+			caretClassName: e.caret()
+		};
+	}, [S]);
+	return /* @__PURE__ */ l("li", {
+		className: "uy:flex uy:flex-col uy:gap-50",
+		children: [/* @__PURE__ */ l(u, {
+			id: T,
+			className: D,
+			onPress: C,
+			"aria-expanded": S,
+			"aria-controls": E,
+			..._,
+			children: [
+				f && /* @__PURE__ */ c("span", {
+					className: O,
+					children: f({ isExpanded: S })
+				}),
+				/* @__PURE__ */ c("span", {
+					className: k,
+					children: s
+				}),
+				/* @__PURE__ */ l("span", {
+					className: A,
+					role: "presentation",
+					children: [p, /* @__PURE__ */ c(e, {
+						src: "CaretDownOutlined",
+						alt: "expand group",
+						size: 20,
+						className: N,
+						color: "inherit"
+					})]
+				})
+			]
+		}), /* @__PURE__ */ c("div", {
+			className: M,
+			style: { maxHeight: S ? 1e3 : 0 },
+			children: /* @__PURE__ */ c("ul", {
+				id: E,
+				className: j,
+				"aria-labelledby": T,
+				"aria-hidden": !S,
+				children: w
+			})
+		})]
+	});
 }
-M.displayName = "NavGroup";
-export {
-  M as NavGroup
-};
+f.displayName = "NavGroup";
+//#endregion
+export { f as NavGroup };

package/dist/esm/components/nav/parts/RawNavItem.js

@@ -1,118 +1,99 @@
-import { jsx as u, jsxs as N } from "react/jsx-runtime";
-import { forwardRef as C, useMemo as I } from "react";
-import { uyTv as y, uyMerge as j } from "@payfit/unity-themes";
-import { Button as R } from "react-aria-components/Button";
-import { Link as A } from "react-aria-components/Link";
-import { useRouter as k } from "../../../providers/router/RouterProvider.js";
-const B = y({
-  slots: {
-    base: [
-      "uy:group uy:cursor-pointer uy:grid uy:w-full uy:grid-cols-[auto_1fr_auto] uy:items-center uy:py-100 uy:px-150 uy:gap-100 uy:theme-legacy:rounded-75 uy:theme-rebrand:rounded-100 uy:outline-0 uy:transition-all uy:min-h-5.5 uy:md:min-h-auto",
-      "uy:bg-transparent uy:theme-rebrand:border-1 uy:theme-rebrand:border-solid uy:theme-rebrand:border-transparent",
-      "uy:theme-legacy:data-[hovered]:bg-surface-neutral-low-hover",
-      "uy:theme-rebrand:data-[hovered]:bg-surface-neutral-lowest-hover uy:theme-rebrand:data-[hovered]:border-border-neutral-lowest-hover",
-      "uy:theme-legacy:active:bg-surface-neutral-low-active uy:theme-legacy:data-[pressed]:bg-surface-neutral-low-pressed",
-      "uy:theme-rebrand:active:bg-surface-neutral-lowest-active uy:theme-rebrand:active:border-border-neutral-lowest-pressed uy:theme-rebrand:data-[pressed]:bg-surface-neutral-lowest-pressed uy:theme-rebrand:data-[pressed]:border-border-neutral-lowest-pressed",
-      "uy:focus:outline-0 uy:data-[focus-visible]:outline-none uy:data-[focus-visible]:ring-2 uy:data-[focus-visible]:ring-utility-focus-ring uy:data-[focus-visible]:ring-offset-2"
-    ],
-    prefix: "uy:theme-legacy:p-25 uy:theme-rebrand:px-25 uy:empty:hidden uy:text-content-neutral-low",
-    suffix: "uy:flex uy:gap-100 uy:items-center uy:text-content-neutral-low uy:justify-self-end uy:text-right uy:empty:hidden",
-    label: [
-      "uy:flex-1 uy:basis-full uy:text-left uy:truncate uy:overflow-hidden uy:whitespace-break-spaces uy:typography-body uy:text-content-neutral"
-    ]
-  },
-  variants: {
-    level: {
-      0: "uy:pl-150",
-      1: "uy:pl-600"
-    },
-    isDisabled: {
-      true: {
-        base: "uy:pointer-events-none",
-        label: "uy:text-content-neutral-disabled"
-      },
-      false: ""
-    }
-  }
-}), M = y({
-  extend: B,
-  variants: {
-    isActive: {
-      true: {
-        base: [
-          "uy:theme-legacy:bg-surface-neutral-low-active uy:theme-rebrand:data-[level=1]:bg-surface-neutral-lowest-active",
-          "uy:theme-rebrand:data-[level=0]:bg-surface-neutral uy:theme-rebrand:data-[level=0]:border-1 uy:theme-rebrand:data-[level=0]:border-solid uy:theme-rebrand:data-[level=0]:border-border-neutral uy:theme-rebrand:data-[level=0]:shadow-100"
-        ],
-        prefix: [
-          "uy:theme-legacy:text-content-neutral",
-          "uy:theme-rebrand:text-content-primary"
-        ],
-        label: "uy:typography-body-strong"
-      },
-      false: {
-        base: "",
-        prefix: "uy:text-content-neutral-low",
-        label: "uy:typography-body"
-      }
-    }
-  }
-}), _ = C(
-  ({
-    children: d,
-    level: s = 0,
-    prefix: l,
-    suffix: n,
-    onPress: i,
-    href: t,
-    isCurrent: c,
-    isDisabled: r = !1,
-    isExact: m = !1,
-    ...b
-  }, p) => {
-    const o = k(), f = t ? A : R, e = o && t ? o.isActive(t, m) : c, {
-      rawNavItemClassName: h,
-      labelClassName: v,
-      prefixClassName: g,
-      suffixClassName: x
-    } = I(() => {
-      const a = M({ level: s, isActive: e, isDisabled: r });
-      return {
-        rawNavItemClassName: j(a.base(), a.label()),
-        prefixClassName: a.prefix(),
-        suffixClassName: a.suffix(),
-        labelClassName: a.label()
-      };
-    }, [e, r, s]), w = Object.assign(
-      {},
-      e !== void 0 && {
-        "data-current": e,
-        "aria-current": e ? "page" : void 0
-      },
-      !t && { tabIndex: r ? -1 : void 0 }
-    );
-    return /* @__PURE__ */ u("li", { children: /* @__PURE__ */ N(
-      f,
-      {
-        ...w,
-        ...b,
-        ref: p,
-        className: h,
-        href: t,
-        onPress: i,
-        isDisabled: r,
-        "data-level": s,
-        "data-selected": e,
-        children: [
-          l && /* @__PURE__ */ u("span", { className: g, children: l({ isCurrent: e ?? !1 }) }),
-          /* @__PURE__ */ u("span", { className: v, children: d }),
-          n && /* @__PURE__ */ u("span", { className: x, children: n })
-        ]
-      }
-    ) });
-  }
-);
-_.displayName = "RawNavItem";
-export {
-  _ as RawNavItem,
-  B as navItemBase
-};
+import { useRouter as e } from "../../../providers/router/RouterProvider.js";
+import { forwardRef as t, useMemo as n } from "react";
+import { uyMerge as r, uyTv as i } from "@payfit/unity-themes";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Button as s } from "react-aria-components/Button";
+import { Link as c } from "react-aria-components/Link";
+//#region src/components/nav/parts/RawNavItem.tsx
+var l = i({
+	slots: {
+		base: [
+			"uy:group uy:cursor-pointer uy:grid uy:w-full uy:grid-cols-[auto_1fr_auto] uy:items-center uy:py-100 uy:px-150 uy:gap-100 uy:theme-legacy:rounded-75 uy:theme-rebrand:rounded-100 uy:outline-0 uy:transition-all uy:min-h-5.5 uy:md:min-h-auto",
+			"uy:bg-transparent uy:theme-rebrand:border-1 uy:theme-rebrand:border-solid uy:theme-rebrand:border-transparent",
+			"uy:theme-legacy:data-[hovered]:bg-surface-neutral-low-hover",
+			"uy:theme-rebrand:data-[hovered]:bg-surface-neutral-lowest-hover uy:theme-rebrand:data-[hovered]:border-border-neutral-lowest-hover",
+			"uy:theme-legacy:active:bg-surface-neutral-low-active uy:theme-legacy:data-[pressed]:bg-surface-neutral-low-pressed",
+			"uy:theme-rebrand:active:bg-surface-neutral-lowest-active uy:theme-rebrand:active:border-border-neutral-lowest-pressed uy:theme-rebrand:data-[pressed]:bg-surface-neutral-lowest-pressed uy:theme-rebrand:data-[pressed]:border-border-neutral-lowest-pressed",
+			"uy:focus:outline-0 uy:data-[focus-visible]:outline-none uy:data-[focus-visible]:ring-2 uy:data-[focus-visible]:ring-utility-focus-ring uy:data-[focus-visible]:ring-offset-2"
+		],
+		prefix: "uy:theme-legacy:p-25 uy:theme-rebrand:px-25 uy:empty:hidden uy:text-content-neutral-low",
+		suffix: "uy:flex uy:gap-100 uy:items-center uy:text-content-neutral-low uy:justify-self-end uy:text-right uy:empty:hidden",
+		label: ["uy:flex-1 uy:basis-full uy:text-left uy:truncate uy:overflow-hidden uy:whitespace-break-spaces uy:typography-body uy:text-content-neutral"]
+	},
+	variants: {
+		level: {
+			0: "uy:pl-150",
+			1: "uy:pl-600"
+		},
+		isDisabled: {
+			true: {
+				base: "uy:pointer-events-none",
+				label: "uy:text-content-neutral-disabled"
+			},
+			false: ""
+		}
+	}
+}), u = i({
+	extend: l,
+	variants: { isActive: {
+		true: {
+			base: ["uy:theme-legacy:bg-surface-neutral-low-active uy:theme-rebrand:data-[level=1]:bg-surface-neutral-lowest-active", "uy:theme-rebrand:data-[level=0]:bg-surface-neutral uy:theme-rebrand:data-[level=0]:border-1 uy:theme-rebrand:data-[level=0]:border-solid uy:theme-rebrand:data-[level=0]:border-border-neutral uy:theme-rebrand:data-[level=0]:shadow-100"],
+			prefix: ["uy:theme-legacy:text-content-neutral", "uy:theme-rebrand:text-content-primary"],
+			label: "uy:typography-body-strong"
+		},
+		false: {
+			base: "",
+			prefix: "uy:text-content-neutral-low",
+			label: "uy:typography-body"
+		}
+	} }
+}), d = t(({ children: t, level: i = 0, prefix: l, suffix: d, onPress: f, href: p, isCurrent: m, isDisabled: h = !1, isExact: g = !1, ..._ }, v) => {
+	let y = e(), b = p ? c : s, x = y && p ? y.isActive(p, g) : m, { rawNavItemClassName: S, labelClassName: C, prefixClassName: w, suffixClassName: T } = n(() => {
+		let e = u({
+			level: i,
+			isActive: x,
+			isDisabled: h
+		});
+		return {
+			rawNavItemClassName: r(e.base(), e.label()),
+			prefixClassName: e.prefix(),
+			suffixClassName: e.suffix(),
+			labelClassName: e.label()
+		};
+	}, [
+		x,
+		h,
+		i
+	]);
+	return /* @__PURE__ */ a("li", { children: /* @__PURE__ */ o(b, {
+		...Object.assign({}, x !== void 0 && {
+			"data-current": x,
+			"aria-current": x ? "page" : void 0
+		}, !p && { tabIndex: h ? -1 : void 0 }),
+		..._,
+		ref: v,
+		className: S,
+		href: p,
+		onPress: f,
+		isDisabled: h,
+		"data-level": i,
+		"data-selected": x,
+		children: [
+			l && /* @__PURE__ */ a("span", {
+				className: w,
+				children: l({ isCurrent: x ?? !1 })
+			}),
+			/* @__PURE__ */ a("span", {
+				className: C,
+				children: t
+			}),
+			d && /* @__PURE__ */ a("span", {
+				className: T,
+				children: d
+			})
+		]
+	}) });
+});
+d.displayName = "RawNavItem";
+//#endregion
+export { d as RawNavItem, l as navItemBase };

package/dist/esm/components/navigation-card/NavigationCard.context.js

@@ -1,13 +1,12 @@
-import { createContext as t, useContext as e } from "react";
-const o = t({
-  id: "",
-  labelId: "",
-  descriptionId: ""
+import { createContext as e, useContext as t } from "react";
+//#region src/components/navigation-card/NavigationCard.context.tsx
+var n = e({
+	id: "",
+	labelId: "",
+	descriptionId: ""
 });
-function i() {
-  return e(o);
+function r() {
+	return t(n);
 }
-export {
-  o as NavigationCardContext,
-  i as useNavigationCardContext
-};
+//#endregion
+export { n as NavigationCardContext, r as useNavigationCardContext };