@payfit/unity-components 2.47.5 → 2.47.6

package/dist/esm/components/grid/GridItem.js

@@ -1,43 +1,24 @@
-import { jsx as y } from "react/jsx-runtime";
-import { forwardRef as I } from "react";
-import { gridItem as g } from "./Grid.variants.js";
-const j = I(
-  ({
-    asElement: r = "div",
-    area: e,
-    children: t,
-    className: o,
-    colSpan: s,
-    colStart: m,
-    colEnd: i,
-    justify: a,
-    align: l,
-    ...c
-  }, d) => {
-    const f = Object.fromEntries(
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
-      [["gridArea", e]].filter(([u, p]) => !!p)
-    ), n = g({
-      colSpan: s,
-      colStart: m,
-      colEnd: i,
-      justify: a,
-      align: l,
-      className: o
-    });
-    return /* @__PURE__ */ y(
-      r,
-      {
-        ref: d,
-        className: n,
-        style: f,
-        ...c,
-        children: t
-      }
-    );
-  }
-);
-j.displayName = "GridItem";
-export {
-  j as GridItem
-};
+import { gridItem as e } from "./Grid.variants.js";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/grid/GridItem.tsx
+var r = t(({ asElement: t = "div", area: r, children: i, className: a, colSpan: o, colStart: s, colEnd: c, justify: l, align: u, ...d }, f) => {
+	let p = Object.fromEntries([["gridArea", r]].filter(([e, t]) => !!t));
+	return /* @__PURE__ */ n(t, {
+		ref: f,
+		className: e({
+			colSpan: o,
+			colStart: s,
+			colEnd: c,
+			justify: l,
+			align: u,
+			className: a
+		}),
+		style: p,
+		...d,
+		children: i
+	});
+});
+r.displayName = "GridItem";
+//#endregion
+export { r as GridItem };

package/dist/esm/components/icon/Icon.js

@@ -1,117 +1,114 @@
-import { jsx as c } from "react/jsx-runtime";
-import { useMemo as i } from "react";
-import { IconSprite as d } from "@payfit/unity-icons";
-import { uyTv as l } from "@payfit/unity-themes";
-const y = l({
-  variants: {
-    size: {
-      20: "uy:w-250 uy:h-250",
-      24: "uy:w-300 uy:h-300"
-    },
-    color: {
-      "content.primary": "uy:text-content-primary",
-      "content.primary.enabled": "uy:text-content-primary-enabled",
-      "content.primary.hover": "uy:text-content-primary-hover",
-      "content.primary.pressed": "uy:text-content-primary-pressed",
-      "content.primary.focus": "uy:text-content-primary-focus",
-      "content.primary.active": "uy:text-content-primary-active",
-      "content.primary.disabled": "uy:text-content-primary-disabled",
-      "content.neutral": "uy:text-content-neutral",
-      "content.neutral.enabled": "uy:text-content-neutral-enabled",
-      "content.neutral.hover": "uy:text-content-neutral-hover",
-      "content.neutral.pressed": "uy:text-content-neutral-pressed",
-      "content.neutral.focus": "uy:text-content-neutral-focus",
-      "content.neutral.active": "uy:text-content-neutral-active",
-      "content.neutral.disabled": "uy:text-content-neutral-disabled",
-      "content.neutral.low": "uy:text-content-neutral-low",
-      "content.neutral.lowest": "uy:text-content-neutral-lowest",
-      "content.neutral.lowest.enabled": "uy:text-content-neutral-lowest-enabled",
-      "content.neutral.lowest.hover": "uy:text-content-neutral-lowest-hover",
-      "content.neutral.lowest.pressed": "uy:text-content-neutral-lowest-pressed",
-      "content.neutral.lowest.focus": "uy:text-content-neutral-lowest-focus",
-      "content.neutral.lowest.active": "uy:text-content-neutral-lowest-active",
-      "content.neutral.lowest.disabled": "uy:text-content-neutral-lowest-disabled",
-      "content.danger": "uy:text-content-danger",
-      "content.danger.enabled": "uy:text-content-danger-enabled",
-      "content.danger.hover": "uy:text-content-danger-hover",
-      "content.danger.pressed": "uy:text-content-danger-pressed",
-      "content.danger.focus": "uy:text-content-danger-focus",
-      "content.danger.active": "uy:text-content-danger-active",
-      "content.danger.disabled": "uy:text-content-danger-disabled",
-      "content.warning": "uy:text-content-warning",
-      "content.warning.enabled": "uy:text-content-warning-enabled",
-      "content.warning.hover": "uy:text-content-warning-hover",
-      "content.warning.pressed": "uy:text-content-warning-pressed",
-      "content.warning.focus": "uy:text-content-warning-focus",
-      "content.warning.active": "uy:text-content-warning-active",
-      "content.warning.disabled": "uy:text-content-warning-disabled",
-      "content.success": "uy:text-content-success",
-      "content.success.enabled": "uy:text-content-success-enabled",
-      "content.success.hover": "uy:text-content-success-hover",
-      "content.success.pressed": "uy:text-content-success-pressed",
-      "content.success.focus": "uy:text-content-success-focus",
-      "content.success.active": "uy:text-content-success-active",
-      "content.success.disabled": "uy:text-content-success-disabled",
-      "content.info": "uy:text-content-info",
-      "content.info.enabled": "uy:text-content-info-enabled",
-      "content.info.hover": "uy:text-content-info-hover",
-      "content.info.pressed": "uy:text-content-info-pressed",
-      "content.info.focus": "uy:text-content-info-focus",
-      "content.info.active": "uy:text-content-info-active",
-      "content.info.disabled": "uy:text-content-info-disabled",
-      "content.promo": "uy:text-content-promo",
-      "content.form.enabled": "uy:text-content-form",
-      "content.form.hover": "uy:text-content-form-hover",
-      "content.form.pressed": "uy:text-content-form-pressed",
-      "content.form.focus": "uy:text-content-form-focus",
-      "content.form.active": "uy:text-content-form-active",
-      "content.form.disabled": "uy:text-content-form-disabled",
-      "content.form.read-only": "uy:text-content-form-read-only",
-      "content.form.invalid": "uy:text-content-form-invalid",
-      "content.inverted": "uy:text-content-inverted",
-      "content.inverted.enabled": "uy:text-content-inverted-enabled",
-      "content.inverted.hover": "uy:text-content-inverted-hover",
-      "content.inverted.pressed": "uy:text-content-inverted-pressed",
-      "content.inverted.focus": "uy:text-content-inverted-focus",
-      "content.inverted.active": "uy:text-content-inverted-active",
-      "content.inverted.disabled": "uy:text-content-inverted-disabled",
-      inherit: "uy:text-inherit"
-    },
-    display: {
-      block: "uy:block",
-      inline: "uy:inline-block"
-    }
-  },
-  defaultVariants: {
-    size: 20,
-    color: "inherit",
-    display: "block"
-  }
+import { useMemo as e } from "react";
+import { uyTv as t } from "@payfit/unity-themes";
+import { jsx as n } from "react/jsx-runtime";
+import { IconSprite as r } from "@payfit/unity-icons";
+//#region src/components/icon/Icon.tsx
+var i = t({
+	variants: {
+		size: {
+			20: "uy:w-250 uy:h-250",
+			24: "uy:w-300 uy:h-300"
+		},
+		color: {
+			"content.primary": "uy:text-content-primary",
+			"content.primary.enabled": "uy:text-content-primary-enabled",
+			"content.primary.hover": "uy:text-content-primary-hover",
+			"content.primary.pressed": "uy:text-content-primary-pressed",
+			"content.primary.focus": "uy:text-content-primary-focus",
+			"content.primary.active": "uy:text-content-primary-active",
+			"content.primary.disabled": "uy:text-content-primary-disabled",
+			"content.neutral": "uy:text-content-neutral",
+			"content.neutral.enabled": "uy:text-content-neutral-enabled",
+			"content.neutral.hover": "uy:text-content-neutral-hover",
+			"content.neutral.pressed": "uy:text-content-neutral-pressed",
+			"content.neutral.focus": "uy:text-content-neutral-focus",
+			"content.neutral.active": "uy:text-content-neutral-active",
+			"content.neutral.disabled": "uy:text-content-neutral-disabled",
+			"content.neutral.low": "uy:text-content-neutral-low",
+			"content.neutral.lowest": "uy:text-content-neutral-lowest",
+			"content.neutral.lowest.enabled": "uy:text-content-neutral-lowest-enabled",
+			"content.neutral.lowest.hover": "uy:text-content-neutral-lowest-hover",
+			"content.neutral.lowest.pressed": "uy:text-content-neutral-lowest-pressed",
+			"content.neutral.lowest.focus": "uy:text-content-neutral-lowest-focus",
+			"content.neutral.lowest.active": "uy:text-content-neutral-lowest-active",
+			"content.neutral.lowest.disabled": "uy:text-content-neutral-lowest-disabled",
+			"content.danger": "uy:text-content-danger",
+			"content.danger.enabled": "uy:text-content-danger-enabled",
+			"content.danger.hover": "uy:text-content-danger-hover",
+			"content.danger.pressed": "uy:text-content-danger-pressed",
+			"content.danger.focus": "uy:text-content-danger-focus",
+			"content.danger.active": "uy:text-content-danger-active",
+			"content.danger.disabled": "uy:text-content-danger-disabled",
+			"content.warning": "uy:text-content-warning",
+			"content.warning.enabled": "uy:text-content-warning-enabled",
+			"content.warning.hover": "uy:text-content-warning-hover",
+			"content.warning.pressed": "uy:text-content-warning-pressed",
+			"content.warning.focus": "uy:text-content-warning-focus",
+			"content.warning.active": "uy:text-content-warning-active",
+			"content.warning.disabled": "uy:text-content-warning-disabled",
+			"content.success": "uy:text-content-success",
+			"content.success.enabled": "uy:text-content-success-enabled",
+			"content.success.hover": "uy:text-content-success-hover",
+			"content.success.pressed": "uy:text-content-success-pressed",
+			"content.success.focus": "uy:text-content-success-focus",
+			"content.success.active": "uy:text-content-success-active",
+			"content.success.disabled": "uy:text-content-success-disabled",
+			"content.info": "uy:text-content-info",
+			"content.info.enabled": "uy:text-content-info-enabled",
+			"content.info.hover": "uy:text-content-info-hover",
+			"content.info.pressed": "uy:text-content-info-pressed",
+			"content.info.focus": "uy:text-content-info-focus",
+			"content.info.active": "uy:text-content-info-active",
+			"content.info.disabled": "uy:text-content-info-disabled",
+			"content.promo": "uy:text-content-promo",
+			"content.form.enabled": "uy:text-content-form",
+			"content.form.hover": "uy:text-content-form-hover",
+			"content.form.pressed": "uy:text-content-form-pressed",
+			"content.form.focus": "uy:text-content-form-focus",
+			"content.form.active": "uy:text-content-form-active",
+			"content.form.disabled": "uy:text-content-form-disabled",
+			"content.form.read-only": "uy:text-content-form-read-only",
+			"content.form.invalid": "uy:text-content-form-invalid",
+			"content.inverted": "uy:text-content-inverted",
+			"content.inverted.enabled": "uy:text-content-inverted-enabled",
+			"content.inverted.hover": "uy:text-content-inverted-hover",
+			"content.inverted.pressed": "uy:text-content-inverted-pressed",
+			"content.inverted.focus": "uy:text-content-inverted-focus",
+			"content.inverted.active": "uy:text-content-inverted-active",
+			"content.inverted.disabled": "uy:text-content-inverted-disabled",
+			inherit: "uy:text-inherit"
+		},
+		display: {
+			block: "uy:block",
+			inline: "uy:inline-block"
+		}
+	},
+	defaultVariants: {
+		size: 20,
+		color: "inherit",
+		display: "block"
+	}
 });
-function b({
-  alt: r,
-  color: t,
-  size: e,
-  src: a,
-  role: s = "img",
-  display: n = "block",
-  ...o
-}) {
-  const u = i(
-    () => y({ size: e, color: t, display: n }),
-    [e, t, n]
-  );
-  return /* @__PURE__ */ c(
-    "span",
-    {
-      "data-dd-privacy": "allow",
-      ...o,
-      role: s,
-      "aria-label": o["aria-labelledby"] ? void 0 : r,
-      children: /* @__PURE__ */ c(d, { className: u, src: a })
-    }
-  );
+function a({ alt: t, color: a, size: o, src: s, role: c = "img", display: l = "block", ...u }) {
+	let d = e(() => i({
+		size: o,
+		color: a,
+		display: l
+	}), [
+		o,
+		a,
+		l
+	]);
+	return /* @__PURE__ */ n("span", {
+		"data-dd-privacy": "allow",
+		...u,
+		role: c,
+		"aria-label": u["aria-labelledby"] ? void 0 : t,
+		children: /* @__PURE__ */ n(r, {
+			className: d,
+			src: s
+		})
+	});
 }
-export {
-  b as Icon
-};
+//#endregion
+export { a as Icon };

package/dist/esm/components/icon-button/CircularIconButton.js

@@ -1,120 +1,118 @@
-import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import { forwardRef as z } from "react";
-import { uyTv as I } from "@payfit/unity-themes";
-import { Button as N } from "react-aria-components/Button";
-import { Pressable as B } from "react-aria-components/Pressable";
-import L from "../../hooks/use-id.js";
-import { Icon as y } from "../icon/Icon.js";
-import { Spinner as b } from "../spinner/Spinner.js";
-import { Tooltip as f } from "../tooltip/Tooltip.js";
-const j = I({
-  base: [
-    "uy:rounded-circle uy:cursor-pointer uy:flex uy:items-center uy:justify-center uy:transition-colors",
-    'uy:disabled:cursor-not-allowed uy:disabled:text-content-neutral-disabled uy:disabled:data-[hovered="true"]:bg-transparent',
-    "uy:focus-visible:outline-2 uy:focus-visible:outline-offset-2 uy:focus-visible:outline-utility-focus-ring",
-    "uy:aria-busy:text-content-neutral-disabled uy:aria-busy:cursor-progress"
-  ],
-  variants: {
-    size: {
-      default: "uy:w-300 uy:h-300",
-      large: "uy:w-400 uy:h-400"
-    },
-    color: {
-      "content.neutral": [
-        "uy:text-content-neutral-low",
-        'uy:data-[hovered="true"]:bg-surface-neutral-hover',
-        "uy:active:bg-surface-neutral-active",
-        "uy:data-[pressed=true]:bg-surface-neutral-active"
-      ],
-      "content.neutral.low": [
-        "uy:text-content-neutral-low",
-        'uy:data-[hovered="true"]:bg-surface-neutral-low-hover',
-        "uy:active:bg-surface-neutral-low-active",
-        "uy:data-[pressed=true]:bg-surface-neutral-low-active",
-        "uy:focus-visible:bg-surface-neutral-low-focus",
-        "uy:disabled:bg-surface-neutral-low-disabled"
-      ],
-      "content.neutral.lowest": [
-        "uy:text-content-neutral-low",
-        'uy:data-[hovered="true"]:bg-surface-neutral-lowest-hover',
-        "uy:active:bg-surface-neutral-lowest-active",
-        "uy:data-[pressed=true]:bg-surface-neutral-lowest-active",
-        "uy:focus-visible:bg-surface-neutral-lowest-focus",
-        "uy:disabled:bg-surface-neutral-lowest-disabled"
-      ]
-    }
-  },
-  defaultVariants: {
-    size: "default",
-    color: "content.neutral.low"
-  }
-}), D = z((m, o) => {
-  const p = L(), {
-    type: v,
-    onPress: s,
-    icon: u,
-    color: g,
-    size: l,
-    isLoading: t,
-    title: a,
-    isDisabled: i,
-    asElement: w = "default",
-    className: h,
-    "aria-labelledby": x,
-    ...n
-  } = m, r = `icon-button-label-${p}`, c = j({ class: h, color: g, size: l });
-  return w === "button" ? /* @__PURE__ */ e(f, { title: a, children: /* @__PURE__ */ d(
-    N,
-    {
-      ref: o,
-      "data-dd-privacy": "allow",
-      ...n,
-      type: v,
-      onPress: s,
-      isDisabled: i || t,
-      "aria-labelledby": x ?? r,
-      "aria-busy": t,
-      className: c,
-      children: [
-        t ? /* @__PURE__ */ e(b, { size: "small", label: "Loading", color: "inherit" }) : /* @__PURE__ */ e(
-          y,
-          {
-            src: u,
-            size: l === "large" ? 24 : 20,
-            color: "inherit",
-            role: "presentation"
-          }
-        ),
-        /* @__PURE__ */ e("span", { id: r, className: "uy:sr-only", children: a })
-      ]
-    }
-  ) }) : /* @__PURE__ */ e(f, { title: a, children: /* @__PURE__ */ e(
-    B,
-    {
-      ref: o,
-      "data-dd-privacy": "allow",
-      ...n,
-      onPress: s,
-      isDisabled: i || t,
-      "aria-labelledby": r,
-      "aria-busy": t,
-      children: /* @__PURE__ */ d("div", { role: "button", className: c, children: [
-        t ? /* @__PURE__ */ e(b, { size: "small", label: "Loading", color: "inherit" }) : /* @__PURE__ */ e(
-          y,
-          {
-            src: u,
-            size: l === "large" ? 24 : 20,
-            color: "inherit",
-            role: "presentation"
-          }
-        ),
-        /* @__PURE__ */ e("span", { id: r, className: "uy:sr-only", children: a })
-      ] })
-    }
-  ) });
+import { Icon as e } from "../icon/Icon.js";
+import t from "../../hooks/use-id.js";
+import { Spinner as n } from "../spinner/Spinner.js";
+import { Tooltip as r } from "../tooltip/Tooltip.js";
+import { forwardRef as i } from "react";
+import { uyTv as a } from "@payfit/unity-themes";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Button as c } from "react-aria-components/Button";
+import { Pressable as l } from "react-aria-components/Pressable";
+//#region src/components/icon-button/CircularIconButton.tsx
+var u = a({
+	base: [
+		"uy:rounded-circle uy:cursor-pointer uy:flex uy:items-center uy:justify-center uy:transition-colors",
+		"uy:disabled:cursor-not-allowed uy:disabled:text-content-neutral-disabled uy:disabled:data-[hovered=\"true\"]:bg-transparent",
+		"uy:focus-visible:outline-2 uy:focus-visible:outline-offset-2 uy:focus-visible:outline-utility-focus-ring",
+		"uy:aria-busy:text-content-neutral-disabled uy:aria-busy:cursor-progress"
+	],
+	variants: {
+		size: {
+			default: "uy:w-300 uy:h-300",
+			large: "uy:w-400 uy:h-400"
+		},
+		color: {
+			"content.neutral": [
+				"uy:text-content-neutral-low",
+				"uy:data-[hovered=\"true\"]:bg-surface-neutral-hover",
+				"uy:active:bg-surface-neutral-active",
+				"uy:data-[pressed=true]:bg-surface-neutral-active"
+			],
+			"content.neutral.low": [
+				"uy:text-content-neutral-low",
+				"uy:data-[hovered=\"true\"]:bg-surface-neutral-low-hover",
+				"uy:active:bg-surface-neutral-low-active",
+				"uy:data-[pressed=true]:bg-surface-neutral-low-active",
+				"uy:focus-visible:bg-surface-neutral-low-focus",
+				"uy:disabled:bg-surface-neutral-low-disabled"
+			],
+			"content.neutral.lowest": [
+				"uy:text-content-neutral-low",
+				"uy:data-[hovered=\"true\"]:bg-surface-neutral-lowest-hover",
+				"uy:active:bg-surface-neutral-lowest-active",
+				"uy:data-[pressed=true]:bg-surface-neutral-lowest-active",
+				"uy:focus-visible:bg-surface-neutral-lowest-focus",
+				"uy:disabled:bg-surface-neutral-lowest-disabled"
+			]
+		}
+	},
+	defaultVariants: {
+		size: "default",
+		color: "content.neutral.low"
+	}
+}), d = i((i, a) => {
+	let d = t(), { type: f, onPress: p, icon: m, color: h, size: g, isLoading: _, title: v, isDisabled: y, asElement: b = "default", className: x, "aria-labelledby": S, ...C } = i, w = `icon-button-label-${d}`, T = u({
+		class: x,
+		color: h,
+		size: g
+	});
+	return b === "button" ? /* @__PURE__ */ o(r, {
+		title: v,
+		children: /* @__PURE__ */ s(c, {
+			ref: a,
+			"data-dd-privacy": "allow",
+			...C,
+			type: f,
+			onPress: p,
+			isDisabled: y || _,
+			"aria-labelledby": S ?? w,
+			"aria-busy": _,
+			className: T,
+			children: [_ ? /* @__PURE__ */ o(n, {
+				size: "small",
+				label: "Loading",
+				color: "inherit"
+			}) : /* @__PURE__ */ o(e, {
+				src: m,
+				size: g === "large" ? 24 : 20,
+				color: "inherit",
+				role: "presentation"
+			}), /* @__PURE__ */ o("span", {
+				id: w,
+				className: "uy:sr-only",
+				children: v
+			})]
+		})
+	}) : /* @__PURE__ */ o(r, {
+		title: v,
+		children: /* @__PURE__ */ o(l, {
+			ref: a,
+			"data-dd-privacy": "allow",
+			...C,
+			onPress: p,
+			isDisabled: y || _,
+			"aria-labelledby": w,
+			"aria-busy": _,
+			children: /* @__PURE__ */ s("div", {
+				role: "button",
+				className: T,
+				children: [_ ? /* @__PURE__ */ o(n, {
+					size: "small",
+					label: "Loading",
+					color: "inherit"
+				}) : /* @__PURE__ */ o(e, {
+					src: m,
+					size: g === "large" ? 24 : 20,
+					color: "inherit",
+					role: "presentation"
+				}), /* @__PURE__ */ o("span", {
+					id: w,
+					className: "uy:sr-only",
+					children: v
+				})]
+			})
+		})
+	});
 });
-D.displayName = "CircularIconButton";
-export {
-  D as CircularIconButton,
-  j as circularIconButton
-};
+d.displayName = "CircularIconButton";
+//#endregion
+export { d as CircularIconButton, u as circularIconButton };