@payfit/unity-components 2.47.4 → 2.47.6

package/dist/esm/components/toggle-switch-group-field/TanstackToggleSwitchGroupField.js

@@ -1,50 +1,31 @@
-import { jsxs as g, jsx as o } from "react/jsx-runtime";
-import { forwardRef as k } from "react";
-import { TanstackFormFeedbackText as F } from "../form-field/parts/TanstackFormFeedbackText.js";
-import { TanstackFormField as u } from "../form-field/TanstackFormField.js";
-import { TanstackToggleSwitchGroup as h } from "../toggle-switch-group/TanstackToggleSwitchGroup.js";
-function w({
-  label: r,
-  helperText: t,
-  isDisabled: m,
-  isReadOnly: c,
-  isRequired: a,
-  requiredVariant: e,
-  contextualLink: i,
-  children: n,
-  onFocus: p,
-  onBlur: s,
-  onFocusChange: l,
-  onChange: T,
-  ...d
-}, f) {
-  return /* @__PURE__ */ g(u, { children: [
-    /* @__PURE__ */ o(
-      h,
-      {
-        ref: f,
-        label: r,
-        helperText: t,
-        isRequired: a,
-        requiredVariant: e,
-        onFocus: p,
-        onBlur: s,
-        onFocusChange: l,
-        onChange: T,
-        ...{
-          isDisabled: m,
-          isReadOnly: c
-        },
-        ...d,
-        children: n
-      }
-    ),
-    /* @__PURE__ */ o(F, {}),
-    i
-  ] });
+import { TanstackFormFeedbackText as e } from "../form-field/parts/TanstackFormFeedbackText.js";
+import { TanstackFormField as t } from "../form-field/TanstackFormField.js";
+import { TanstackToggleSwitchGroup as n } from "../toggle-switch-group/TanstackToggleSwitchGroup.js";
+import { forwardRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/toggle-switch-group-field/TanstackToggleSwitchGroupField.tsx
+function o({ label: r, helperText: o, isDisabled: s, isReadOnly: c, isRequired: l, requiredVariant: u, contextualLink: d, children: f, onFocus: p, onBlur: m, onFocusChange: h, onChange: g, ..._ }, v) {
+	return /* @__PURE__ */ a(t, { children: [
+		/* @__PURE__ */ i(n, {
+			ref: v,
+			label: r,
+			helperText: o,
+			isRequired: l,
+			requiredVariant: u,
+			onFocus: p,
+			onBlur: m,
+			onFocusChange: h,
+			onChange: g,
+			isDisabled: s,
+			isReadOnly: c,
+			..._,
+			children: f
+		}),
+		/* @__PURE__ */ i(e, {}),
+		d
+	] });
 }
-const x = k(w);
-x.displayName = "TanstackToggleSwitchGroupField";
-export {
-  x as TanstackToggleSwitchGroupField
-};
+var s = r(o);
+s.displayName = "TanstackToggleSwitchGroupField";
+//#endregion
+export { s as TanstackToggleSwitchGroupField };

package/dist/esm/components/toggle-switch-group-field/ToggleSwitchGroupField.js

@@ -1,63 +1,43 @@
-import { jsxs as T, jsx as i } from "react/jsx-runtime";
-import { forwardRef as x, useMemo as G } from "react";
-import { useFormContext as R } from "react-hook-form";
-import { createSchemaAdapter as q } from "../../utils/createSchemaAdapter.js";
-import { FormField as y } from "../form-field/FormField.js";
-import { FormControl as P } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as j } from "../form-field/parts/FormFeedbackText.js";
-import { isFieldRequired as v } from "../form-field/utils/isFieldRequired.js";
-import { useUnityFormProvider as C } from "../form/Form.context.js";
-import { ToggleSwitchGroup as U } from "../toggle-switch-group/ToggleSwitchGroup.js";
-function b({
-  name: o,
-  label: r,
-  defaultValue: e,
-  helperText: m,
-  contextualLink: c,
-  isRequired: p,
-  isInvalid: s,
-  isLoading: l,
-  isDisabled: n,
-  isReadOnly: d,
-  requiredVariant: u,
-  children: f,
-  ...F
-}, h) {
-  const { control: g, watch: a } = R(), { schema: t } = C(), w = G(
-    () => v(q(t), o),
-    [t, o]
-  ), S = a(o);
-  return /* @__PURE__ */ T(y, { control: g, name: o, ...{
-    isInvalid: s,
-    isLoading: l,
-    isDisabled: n,
-    isReadOnly: d
-  }, children: [
-    /* @__PURE__ */ i(P, { children: /* @__PURE__ */ i(
-      U,
-      {
-        ref: h,
-        label: r,
-        defaultValue: e,
-        value: S,
-        helperText: m,
-        requiredVariant: u,
-        ...F,
-        isRequired: w ?? p,
-        children: f
-      }
-    ) }),
-    /* @__PURE__ */ i(j, {}),
-    c
-  ] });
+import { useUnityFormProvider as e } from "../form/Form.context.js";
+import { ToggleSwitchGroup as t } from "../toggle-switch-group/ToggleSwitchGroup.js";
+import { createSchemaAdapter as n } from "../../utils/createSchemaAdapter.js";
+import { isFieldRequired as r } from "../form-field/utils/isFieldRequired.js";
+import { FormField as i } from "../form-field/FormField.js";
+import { FormControl as a } from "../form-field/parts/FormControl.js";
+import { FormFeedbackText as o } from "../form-field/parts/FormFeedbackText.js";
+import { forwardRef as s, useMemo as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { useFormContext as d } from "react-hook-form";
+//#region src/components/toggle-switch-group-field/ToggleSwitchGroupField.tsx
+function f({ name: s, label: f, defaultValue: p, helperText: m, contextualLink: h, isRequired: g, isInvalid: _, isLoading: v, isDisabled: y, isReadOnly: b, requiredVariant: x, children: S, ...C }, w) {
+	let { control: T, watch: E } = d(), { schema: D } = e(), O = c(() => r(n(D), s), [D, s]);
+	return /* @__PURE__ */ u(i, {
+		control: T,
+		name: s,
+		isInvalid: _,
+		isLoading: v,
+		isDisabled: y,
+		isReadOnly: b,
+		children: [
+			/* @__PURE__ */ l(a, { children: /* @__PURE__ */ l(t, {
+				ref: w,
+				label: f,
+				defaultValue: p,
+				value: E(s),
+				helperText: m,
+				requiredVariant: x,
+				...C,
+				isRequired: O ?? g,
+				children: S
+			}) }),
+			/* @__PURE__ */ l(o, {}),
+			h
+		]
+	});
 }
-const k = x(function(r, e) {
-  return b(
-    r,
-    e
-  );
+var p = s(function(e, t) {
+	return f(e, t);
 });
-k.displayName = "ToggleSwitchGroupField";
-export {
-  k as ToggleSwitchGroupField
-};
+p.displayName = "ToggleSwitchGroupField";
+//#endregion
+export { p as ToggleSwitchGroupField };

package/dist/esm/components/tooltip/Tooltip.js

@@ -1,31 +1,30 @@
-import { jsxs as y, jsx as r } from "react/jsx-runtime";
-import { forwardRef as n } from "react";
-import { Button as p } from "react-aria-components/Button";
-import { TooltipTrigger as u, Tooltip as i } from "react-aria-components/Tooltip";
-import { Button as d } from "../button/Button.js";
-const m = (o) => o.type === d || o.type === p, c = {
-  short: [100, 150],
-  standard: [150, 200],
-  long: [200, 300],
-  "very-long": [300, 400]
-}, T = n(
-  ({ title: o, children: t, duration: a = "standard" }, e) => {
-    const [l, s] = c[a];
-    return /* @__PURE__ */ y(u, { delay: l, closeDelay: s, children: [
-      t,
-      /* @__PURE__ */ r(
-        i,
-        {
-          ref: e,
-          "data-dd-privacy": "allow",
-          offset: m(t) ? 6 : 8,
-          className: "uy:inline-flex uy:rounded-50 uy:pl-100 uy:pr-100 uy:pt-50 uy:pb-50 uy:bg-grayscale-l12 uy:max-w-[300px] uy:shadow-100",
-          children: /* @__PURE__ */ r("p", { className: "uy:typography-body-small uy:text-content-inverted uy:overflow-hidden uy:text-ellipsis uy:line-clamp-3", children: o })
-        }
-      )
-    ] });
-  }
-);
-export {
-  T as Tooltip
-};
+import { Button as e } from "../button/Button.js";
+import { forwardRef as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Button as i } from "react-aria-components/Button";
+import { Tooltip as a, TooltipTrigger as o } from "react-aria-components/Tooltip";
+//#region src/components/tooltip/Tooltip.tsx
+var s = (t) => t.type === e || t.type === i, c = {
+	short: [100, 150],
+	standard: [150, 200],
+	long: [200, 300],
+	"very-long": [300, 400]
+}, l = t(({ title: e, children: t, duration: i = "standard" }, l) => {
+	let [u, d] = c[i];
+	return /* @__PURE__ */ r(o, {
+		delay: u,
+		closeDelay: d,
+		children: [t, /* @__PURE__ */ n(a, {
+			ref: l,
+			"data-dd-privacy": "allow",
+			offset: s(t) ? 6 : 8,
+			className: "uy:inline-flex uy:rounded-50 uy:pl-100 uy:pr-100 uy:pt-50 uy:pb-50 uy:bg-grayscale-l12 uy:max-w-[300px] uy:shadow-100",
+			children: /* @__PURE__ */ n("p", {
+				className: "uy:typography-body-small uy:text-content-inverted uy:overflow-hidden uy:text-ellipsis uy:line-clamp-3",
+				children: e
+			})
+		})]
+	});
+});
+//#endregion
+export { l as Tooltip };

package/dist/esm/hooks/tanstack-form-context.js

@@ -1,8 +1,5 @@
-import { createFormHookContexts as o } from "@tanstack/react-form";
-const { fieldContext: e, formContext: r, useFieldContext: n, useFormContext: x } = o();
-export {
-  e as fieldContext,
-  r as formContext,
-  n as useFieldContext,
-  x as useFormContext
-};
+import { createFormHookContexts as e } from "@tanstack/react-form";
+//#region src/hooks/tanstack-form-context.tsx
+var { fieldContext: t, formContext: n, useFieldContext: r, useFormContext: i } = e();
+//#endregion
+export { t as fieldContext, n as formContext, r as useFieldContext, i as useFormContext };

package/dist/esm/hooks/tanstack-form-default-values.js

@@ -1,6 +1,6 @@
-function a(t) {
-  return t;
+//#region src/hooks/tanstack-form-default-values.ts
+function e(e) {
+	return e;
 }
-export {
-  a as tanstackFormDefaultValues
-};
+//#endregion
+export { e as tanstackFormDefaultValues };

package/dist/esm/hooks/use-async-list.js

@@ -0,0 +1,2 @@
+import { useAsyncList as e } from "react-stately/useAsyncList";
+export { e as useAsyncList };

package/dist/esm/hooks/use-breakpoint-listener.js

@@ -1,26 +1,17 @@
-import { useMediaQuery as n } from "./use-media-query.js";
-const i = (e) => {
-  const t = getComputedStyle(document.documentElement).getPropertyValue(
-    `--uy-breakpoint-${e}`
-  );
-  return parseInt(t.replace("px", ""), 10);
-}, r = (e) => `(min-width: ${i(e)}px)`;
-function a() {
-  const e = n(r("xl")), t = n(r("lg")), s = n(r("md")), o = n(r("sm"));
-  return e ? "xl" : t ? "lg" : s ? "md" : o ? "sm" : "xs";
+import { useMediaQuery as e } from "./use-media-query.js";
+//#region src/hooks/use-breakpoint-listener.ts
+var t = (e) => {
+	let t = getComputedStyle(document.documentElement).getPropertyValue(`--uy-breakpoint-${e}`);
+	return parseInt(t.replace("px", ""), 10);
+}, n = (e) => `(min-width: ${t(e)}px)`;
+function r() {
+	let t = e(n("xl")), r = e(n("lg")), i = e(n("md")), a = e(n("sm"));
+	return t ? "xl" : r ? "lg" : i ? "md" : a ? "sm" : "xs";
 }
-const u = [
-  "md",
-  "lg",
-  "xl"
-], c = [
-  "xs",
-  "sm"
-], m = (e) => u.includes(e), p = (e) => c.includes(e);
-export {
-  u as DESKTOP_BREAKPOINTS,
-  c as MOBILE_BREAKPOINTS,
-  m as isDesktopBreakpoint,
-  p as isMobileBreakpoint,
-  a as useBreakpointListener
-};
+var i = [
+	"md",
+	"lg",
+	"xl"
+], a = ["xs", "sm"], o = (e) => i.includes(e), s = (e) => a.includes(e);
+//#endregion
+export { i as DESKTOP_BREAKPOINTS, a as MOBILE_BREAKPOINTS, o as isDesktopBreakpoint, s as isMobileBreakpoint, r as useBreakpointListener };

package/dist/esm/hooks/use-container-query-level.js

@@ -1,33 +1,32 @@
-import s from "@payfit/unity-themes/tokens/common/sizes.json";
-import { useResizeObserver as c } from "usehooks-ts";
-const i = () => {
-  const n = s.container, o = {
-    section: parseInt(n.section.$value.replace("px", ""), 10),
-    page: parseInt(n.page.$value.replace("px", ""), 10),
-    app: parseInt(n.app.$value.replace("px", ""), 10)
-  };
-  if (typeof window > "u")
-    return o;
-  const r = getComputedStyle(document.documentElement), e = (t) => {
-    const p = r.getPropertyValue(`--uy-container-${t}`), a = parseInt(p.replace("px", ""), 10);
-    return isNaN(a) ? o[t] : a;
-  };
-  return {
-    section: e("section"),
-    page: e("page"),
-    app: e("app")
-  };
+import { useResizeObserver as e } from "usehooks-ts";
+import t from "@payfit/unity-themes/tokens/common/sizes.json";
+//#region src/hooks/use-container-query-level.ts
+var n = () => {
+	let e = t.container, n = {
+		section: parseInt(e.section.$value.replace("px", ""), 10),
+		page: parseInt(e.page.$value.replace("px", ""), 10),
+		app: parseInt(e.app.$value.replace("px", ""), 10)
+	};
+	if (typeof window > "u") return n;
+	let r = getComputedStyle(document.documentElement), i = (e) => {
+		let t = r.getPropertyValue(`--uy-container-${e}`), i = parseInt(t.replace("px", ""), 10);
+		return isNaN(i) ? n[e] : i;
+	};
+	return {
+		section: i("section"),
+		page: i("page"),
+		app: i("app")
+	};
 };
-function d(n) {
-  const { ref: o } = n, e = c({
-    ref: o,
-    box: "border-box"
-  }).width ?? 0, t = i();
-  return {
-    level: e >= t.app ? "app" : e >= t.page ? "page" : e >= t.section ? "section" : "component",
-    width: e
-  };
+function r(t) {
+	let { ref: r } = t, i = e({
+		ref: r,
+		box: "border-box"
+	}).width ?? 0, a = n();
+	return {
+		level: i >= a.app ? "app" : i >= a.page ? "page" : i >= a.section ? "section" : "component",
+		width: i
+	};
 }
-export {
-  d as useContainerQueryLevel
-};
+//#endregion
+export { r as useContainerQueryLevel };

package/dist/esm/hooks/use-form.js

@@ -1,32 +1,38 @@
-import { jsx as t } from "react/jsx-runtime";
+import { Form as e } from "../components/form/Form.js";
+import { FormField as t } from "../components/form-field/FormField.js";
 import { useMemo as n } from "react";
-import { standardSchemaResolver as l } from "@hookform/resolvers/standard-schema";
-import { useForm as c } from "react-hook-form";
-import { FormField as a } from "../components/form-field/FormField.js";
-import { Form as u } from "../components/form/Form.js";
-function S(m, i = {
-  mode: "onTouched",
-  reValidateMode: "onChange"
+import { jsx as r } from "react/jsx-runtime";
+import { useForm as i } from "react-hook-form";
+import { standardSchemaResolver as a } from "@hookform/resolvers/standard-schema";
+//#region src/hooks/use-form.tsx
+function o(o, s = {
+	mode: "onTouched",
+	reValidateMode: "onChange"
 }) {
-  const r = c({
-    ...i,
-    resolver: l(m)
-  }), d = n(() => {
-    const o = (e) => /* @__PURE__ */ t(u, { ...e, form: r, schema: m, children: e.children });
-    return o.displayName = "FormWithSchema", o;
-  }, [r, m]), F = n(() => {
-    const o = (e) => (
-      // @ts-expect-error: REACT-18-MIGRATION
-      /* @__PURE__ */ t(a, { ...e, control: r.control, children: e.children })
-    );
-    return o.displayName = "FormFieldWithSchema", o;
-  }, [r]);
-  return {
-    methods: r,
-    Form: d,
-    FormField: F
-  };
+	let c = i({
+		...s,
+		resolver: a(o)
+	});
+	return {
+		methods: c,
+		Form: n(() => {
+			let t = (t) => /* @__PURE__ */ r(e, {
+				...t,
+				form: c,
+				schema: o,
+				children: t.children
+			});
+			return t.displayName = "FormWithSchema", t;
+		}, [c, o]),
+		FormField: n(() => {
+			let e = (e) => /* @__PURE__ */ r(t, {
+				...e,
+				control: c.control,
+				children: e.children
+			});
+			return e.displayName = "FormFieldWithSchema", e;
+		}, [c])
+	};
 }
-export {
-  S as useUnityForm
-};
+//#endregion
+export { o as useUnityForm };

package/dist/esm/hooks/use-has-scroll.js

@@ -1,75 +1,77 @@
-import { useState as p, useCallback as z, useLayoutEffect as F, useEffect as y } from "react";
-import { detectScroll as A } from "../utils/scroll-detection.js";
-function E(r, b = {}) {
-  const {
-    strategy: a = "size",
-    debounceMs: u = 100,
-    watchMutations: i = !0,
-    watchResize: m = !0
-  } = b, [d, v] = p({
-    hasVerticalScroll: !1,
-    hasHorizontalScroll: !1,
-    hasAnyScroll: !1,
-    detectionMethod: {
-      size: { vertical: !1, horizontal: !1 },
-      style: { vertical: !1, horizontal: !1 }
-    }
-  }), e = z(() => {
-    const s = r.current;
-    if (!s)
-      return;
-    const o = A(s, a);
-    v(o);
-  }, [r, a]);
-  return F(() => {
-    if (!r.current) return;
-    e();
-    const o = requestAnimationFrame(() => {
-      e();
-    });
-    return () => {
-      cancelAnimationFrame(o);
-    };
-  }, [e]), y(() => {
-    let s = !0, o;
-    const S = () => {
-      const n = r.current;
-      if (!n) return;
-      let c;
-      const h = () => {
-        clearTimeout(c), c = setTimeout(e, u);
-      };
-      e(), requestAnimationFrame(() => {
-        e();
-      });
-      const l = [];
-      if (m) {
-        const t = new ResizeObserver(h);
-        t.observe(n), l.push(t);
-      }
-      if (i) {
-        const t = new MutationObserver(h);
-        t.observe(n, {
-          childList: !0,
-          subtree: !0,
-          characterData: !0,
-          attributes: !0,
-          attributeFilter: ["style", "class"]
-        }), l.push(t);
-      }
-      o = () => {
-        clearTimeout(c), l.forEach((t) => {
-          t.disconnect();
-        });
-      };
-    }, f = () => {
-      s && (r.current ? S() : requestAnimationFrame(f));
-    };
-    return f(), () => {
-      s = !1, o?.();
-    };
-  }, [r, e, u, m, i]), d;
+import { detectScroll as e } from "../utils/scroll-detection.js";
+import { useCallback as t, useEffect as n, useLayoutEffect as r, useState as i } from "react";
+//#region src/hooks/use-has-scroll.ts
+function a(a, o = {}) {
+	let { strategy: s = "size", debounceMs: c = 100, watchMutations: l = !0, watchResize: u = !0 } = o, [d, f] = i({
+		hasVerticalScroll: !1,
+		hasHorizontalScroll: !1,
+		hasAnyScroll: !1,
+		detectionMethod: {
+			size: {
+				vertical: !1,
+				horizontal: !1
+			},
+			style: {
+				vertical: !1,
+				horizontal: !1
+			}
+		}
+	}), p = t(() => {
+		let t = a.current;
+		t && f(e(t, s));
+	}, [a, s]);
+	return r(() => {
+		if (!a.current) return;
+		p();
+		let e = requestAnimationFrame(() => {
+			p();
+		});
+		return () => {
+			cancelAnimationFrame(e);
+		};
+	}, [p]), n(() => {
+		let e = !0, t, n = () => {
+			let e = a.current;
+			if (!e) return;
+			let n, r = () => {
+				clearTimeout(n), n = setTimeout(p, c);
+			};
+			p(), requestAnimationFrame(() => {
+				p();
+			});
+			let i = [];
+			if (u) {
+				let t = new ResizeObserver(r);
+				t.observe(e), i.push(t);
+			}
+			if (l) {
+				let t = new MutationObserver(r);
+				t.observe(e, {
+					childList: !0,
+					subtree: !0,
+					characterData: !0,
+					attributes: !0,
+					attributeFilter: ["style", "class"]
+				}), i.push(t);
+			}
+			t = () => {
+				clearTimeout(n), i.forEach((e) => {
+					e.disconnect();
+				});
+			};
+		}, r = () => {
+			e && (a.current ? n() : requestAnimationFrame(r));
+		};
+		return r(), () => {
+			e = !1, t?.();
+		};
+	}, [
+		a,
+		p,
+		c,
+		u,
+		l
+	]), d;
 }
-export {
-  E as useHasScroll
-};
+//#endregion
+export { a as useHasScroll };