@payfit/unity-components 2.47.4 → 2.47.6

package/dist/esm/components/radio-button-group-field/TanstackRadioButtonGroupField.js

@@ -1,38 +1,32 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { TanstackFormFeedbackText as p } from "../form-field/parts/TanstackFormFeedbackText.js";
-import { TanstackFormHelperText as l } from "../form-field/parts/TanstackFormHelperText.js";
-import { TanstackFormLabel as u } from "../form-field/parts/TanstackFormLabel.js";
-import { TanstackFormField as f } from "../form-field/TanstackFormField.js";
-import { TanstackRadioButtonGroup as k } from "../radio-button-group/TanstackRadioButtonGroup.js";
-function F({
-  label: t,
-  helperText: r,
-  contextualLink: a,
-  isRequired: i,
-  requiredVariant: m,
-  children: n,
-  ...e
-}, c) {
-  return /* @__PURE__ */ d(f, { children: [
-    /* @__PURE__ */ o(
-      u,
-      {
-        isRequired: i,
-        requiredVariant: m,
-        children: t
-      }
-    ),
-    r && /* @__PURE__ */ o(l, { children: r }),
-    /* @__PURE__ */ o("div", { className: "uy:mt-25", children: /* @__PURE__ */ o(k, { ref: c, ...e, children: n }) }),
-    /* @__PURE__ */ o(p, {}),
-    a
-  ] });
+import { TanstackFormFeedbackText as e } from "../form-field/parts/TanstackFormFeedbackText.js";
+import { TanstackFormField as t } from "../form-field/TanstackFormField.js";
+import { TanstackFormHelperText as n } from "../form-field/parts/TanstackFormHelperText.js";
+import { TanstackFormLabel as r } from "../form-field/parts/TanstackFormLabel.js";
+import { TanstackRadioButtonGroup as i } from "../radio-button-group/TanstackRadioButtonGroup.js";
+import { forwardRef as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/radio-button-group-field/TanstackRadioButtonGroupField.tsx
+function c({ label: a, helperText: c, contextualLink: l, isRequired: u, requiredVariant: d, children: f, ...p }, m) {
+	return /* @__PURE__ */ s(t, { children: [
+		/* @__PURE__ */ o(r, {
+			isRequired: u,
+			requiredVariant: d,
+			children: a
+		}),
+		c && /* @__PURE__ */ o(n, { children: c }),
+		/* @__PURE__ */ o("div", {
+			className: "uy:mt-25",
+			children: /* @__PURE__ */ o(i, {
+				ref: m,
+				...p,
+				children: f
+			})
+		}),
+		/* @__PURE__ */ o(e, {}),
+		l
+	] });
 }
-const T = s(
-  F
-);
-T.displayName = "TanstackRadioButtonGroupField";
-export {
-  T as TanstackRadioButtonGroupField
-};
+var l = a(c);
+l.displayName = "TanstackRadioButtonGroupField";
+//#endregion
+export { l as TanstackRadioButtonGroupField };

package/dist/esm/components/search/Search.js

@@ -1,166 +1,120 @@
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { forwardRef as w } from "react";
-import { uyTv as M } from "@payfit/unity-themes";
-import { FieldError as N } from "react-aria-components/FieldError";
-import { Input as S } from "react-aria-components/Input";
-import { SearchField as I } from "react-aria-components/SearchField";
-import { useIntl as k } from "react-intl";
-import { CircularIconButton as C } from "../icon-button/CircularIconButton.js";
-import { Icon as n } from "../icon/Icon.js";
-import { Spinner as T } from "../spinner/Spinner.js";
-const B = M({
-  slots: {
-    base: [
-      "uy:w-full uy:flex uy:h-5.5 uy:sm:h-500 uy:gap-100 uy:transition-colors uy:py-125 uy:sm:py-100 uy:px-150 uy:rounded-100 uy:sm:rounded-75 uy:bg-surface-form-high-enabled uy:items-center",
-      "uy:focus-within:outline-none uy:focus-within:ring-2 uy:focus-within:ring-utility-focus-ring uy:focus-within:ring-offset-2 uy:focus-within:bg-surface-form-high-focus",
-      "uy:active:border uy:active:border-solid uy:active:border-border-form-active",
-      "uy:group-data-[disabled=true]:border uy:group-data-[disabled=true]:border-solid uy:group-data-[disabled=true]:border-border-form-disabled uy:group-data-[disabled=true]:bg-surface-form-high-disabled uy:hover:group-data-[disabled=true]:bg-surface-form-high-disabled uy:hover:group-data-[disabled=true]:border-border-form-disabled uy:group-data-[disabled=true]:cursor-not-allowed",
-      "uy:group-data-[invalid=true]:border uy:group-data-[invalid=true]:border-solid uy:group-data-[invalid=true]:border-border-form-error uy:group-data-[invalid=true]:bg-surface-form-high-error"
-    ],
-    input: [
-      "uy:h-300 uy:typography-body uy:flex-grow uy:outline-none uy:[&::-webkit-search-cancel-button]:hidden",
-      "uy:enabled:text-content-form-enabled",
-      "uy:hover:text-content-form-hover",
-      "uy:focus-visible:text-content-form-focus",
-      "uy:active:text-content-form-active",
-      "uy:group-data-[invalid=true]:bg-surface-form-high-error",
-      "uy:group-data-[disabled=true]:cursor-not-allowed"
-    ],
-    icon: [
-      "uy:group-data-[disabled=true]:text-content-neutral-lowest-disabled"
-    ],
-    invalidIcon: ["uy:hidden", "uy:group-data-[invalid=true]:block"],
-    wrapperState: ["uy:flex uy:items-center"],
-    feedbackText: [
-      "uy:typography-body-small-strong uy:text-content-form-invalid"
-    ],
-    closeButton: [
-      "uy:text-content-neutral-enabled uy:group-data-[empty=true]:hidden"
-    ]
-  },
-  variants: {
-    isReadOnly: {
-      true: {
-        base: "uy:bg-surface-form-high-disabled",
-        icon: "uy:text-content-neutral-lowest-disabled",
-        button: "uy:bg-surface-form-high-error uy:text-content-neutral-disabled",
-        input: "uy:bg-surface-form-high-disabled uy:text-content-form-read-only uy:placeholder-content-form-read-only"
-      },
-      false: {
-        base: [
-          "uy:bg-surface-form-high-enabled",
-          "uy:hover:border-border-form-hover uy:hover:bg-surface-form-high-hover"
-        ],
-        icon: "uy:text-content-neutral-lowest",
-        input: "uy:bg-text-content-form-active uy:placeholder-content-neutral-lowest"
-      }
-    }
-  }
-}), E = ({
-  intl: a,
-  placeholder: r,
-  isDisabled: t
-}) => t ? "" : r || a.formatMessage({
-  id: "unity:component:search:placeholder",
-  defaultMessage: "Search"
-}), j = w(
-  ({
-    isLoading: a = !1,
-    isInvalid: r,
-    isDisabled: t,
-    isReadOnly: u,
-    name: d,
-    placeholder: l,
-    feedbackText: s,
-    label: c,
-    ...y
-  }, f) => {
-    const {
-      base: m,
-      icon: b,
-      input: g,
-      invalidIcon: h,
-      wrapperState: p,
-      feedbackText: v,
-      closeButton: x
-    } = B({
-      isReadOnly: u
-    }), o = k();
-    return /* @__PURE__ */ i(
-      I,
-      {
-        "aria-label": c,
-        className: "uy:group",
-        name: d,
-        ref: f,
-        isInvalid: r,
-        isDisabled: t || u,
-        isReadOnly: u,
-        ...y,
-        children: [
-          /* @__PURE__ */ i("div", { className: m(), children: [
-            /* @__PURE__ */ e(
-              n,
-              {
-                src: "MagnifyingGlassOutlined",
-                className: b(),
-                "aria-hidden": "true"
-              }
-            ),
-            /* @__PURE__ */ e(
-              S,
-              {
-                className: g(),
-                placeholder: E({ intl: o, placeholder: l, isDisabled: t })
-              }
-            ),
-            /* @__PURE__ */ i("div", { className: p(), children: [
-              /* @__PURE__ */ e(
-                n,
-                {
-                  className: h(),
-                  src: "WarningCircleOutlined",
-                  color: "content.form.invalid",
-                  alt: o.formatMessage({
-                    id: "unity:component:form-field:form-input:error:alt",
-                    defaultMessage: "Error"
-                  })
-                }
-              ),
-              a && /* @__PURE__ */ e(
-                T,
-                {
-                  label: o.formatMessage({
-                    id: "unity:component:common:loading:label",
-                    defaultMessage: "Loading..."
-                  }),
-                  color: "primary",
-                  size: "small",
-                  "aria-hidden": "true"
-                }
-              ),
-              /* @__PURE__ */ e(
-                C,
-                {
-                  asElement: "button",
-                  title: o.formatMessage({
-                    id: "unity:component:common:clear:title",
-                    defaultMessage: "Clear"
-                  }),
-                  className: x(),
-                  icon: "CloseOutlined"
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ e(N, { className: v(), children: s })
-        ]
-      }
-    );
-  }
-);
-j.displayName = "Search";
-export {
-  j as Search,
-  B as search
-};
+import { Icon as e } from "../icon/Icon.js";
+import { Spinner as t } from "../spinner/Spinner.js";
+import { CircularIconButton as n } from "../icon-button/CircularIconButton.js";
+import { forwardRef as r } from "react";
+import { uyTv as i } from "@payfit/unity-themes";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { useIntl as s } from "react-intl";
+import { Input as c } from "react-aria-components/Input";
+import { FieldError as l } from "react-aria-components/FieldError";
+import { SearchField as u } from "react-aria-components/SearchField";
+//#region src/components/search/Search.tsx
+var d = i({
+	slots: {
+		base: [
+			"uy:w-full uy:flex uy:h-5.5 uy:sm:h-500 uy:gap-100 uy:transition-colors uy:py-125 uy:sm:py-100 uy:px-150 uy:rounded-100 uy:sm:rounded-75 uy:bg-surface-form-high-enabled uy:items-center",
+			"uy:focus-within:outline-none uy:focus-within:ring-2 uy:focus-within:ring-utility-focus-ring uy:focus-within:ring-offset-2 uy:focus-within:bg-surface-form-high-focus",
+			"uy:active:border uy:active:border-solid uy:active:border-border-form-active",
+			"uy:group-data-[disabled=true]:border uy:group-data-[disabled=true]:border-solid uy:group-data-[disabled=true]:border-border-form-disabled uy:group-data-[disabled=true]:bg-surface-form-high-disabled uy:hover:group-data-[disabled=true]:bg-surface-form-high-disabled uy:hover:group-data-[disabled=true]:border-border-form-disabled uy:group-data-[disabled=true]:cursor-not-allowed",
+			"uy:group-data-[invalid=true]:border uy:group-data-[invalid=true]:border-solid uy:group-data-[invalid=true]:border-border-form-error uy:group-data-[invalid=true]:bg-surface-form-high-error"
+		],
+		input: [
+			"uy:h-300 uy:typography-body uy:flex-grow uy:outline-none uy:[&::-webkit-search-cancel-button]:hidden",
+			"uy:enabled:text-content-form-enabled",
+			"uy:hover:text-content-form-hover",
+			"uy:focus-visible:text-content-form-focus",
+			"uy:active:text-content-form-active",
+			"uy:group-data-[invalid=true]:bg-surface-form-high-error",
+			"uy:group-data-[disabled=true]:cursor-not-allowed"
+		],
+		icon: ["uy:group-data-[disabled=true]:text-content-neutral-lowest-disabled"],
+		invalidIcon: ["uy:hidden", "uy:group-data-[invalid=true]:block"],
+		wrapperState: ["uy:flex uy:items-center"],
+		feedbackText: ["uy:typography-body-small-strong uy:text-content-form-invalid"],
+		closeButton: ["uy:text-content-neutral-enabled uy:group-data-[empty=true]:hidden"]
+	},
+	variants: { isReadOnly: {
+		true: {
+			base: "uy:bg-surface-form-high-disabled",
+			icon: "uy:text-content-neutral-lowest-disabled",
+			button: "uy:bg-surface-form-high-error uy:text-content-neutral-disabled",
+			input: "uy:bg-surface-form-high-disabled uy:text-content-form-read-only uy:placeholder-content-form-read-only"
+		},
+		false: {
+			base: ["uy:bg-surface-form-high-enabled", "uy:hover:border-border-form-hover uy:hover:bg-surface-form-high-hover"],
+			icon: "uy:text-content-neutral-lowest",
+			input: "uy:bg-text-content-form-active uy:placeholder-content-neutral-lowest"
+		}
+	} }
+}), f = ({ intl: e, placeholder: t, isDisabled: n }) => n ? "" : t || e.formatMessage({
+	id: "unity:component:search:placeholder",
+	defaultMessage: "Search"
+}), p = r(({ isLoading: r = !1, isInvalid: i, isDisabled: p, isReadOnly: m, name: h, placeholder: g, feedbackText: _, label: v, ...y }, b) => {
+	let { base: x, icon: S, input: C, invalidIcon: w, wrapperState: T, feedbackText: E, closeButton: D } = d({ isReadOnly: m }), O = s();
+	return /* @__PURE__ */ o(u, {
+		"aria-label": v,
+		className: "uy:group",
+		name: h,
+		ref: b,
+		isInvalid: i,
+		isDisabled: p || m,
+		isReadOnly: m,
+		...y,
+		children: [/* @__PURE__ */ o("div", {
+			className: x(),
+			children: [
+				/* @__PURE__ */ a(e, {
+					src: "MagnifyingGlassOutlined",
+					className: S(),
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ a(c, {
+					className: C(),
+					placeholder: f({
+						intl: O,
+						placeholder: g,
+						isDisabled: p
+					})
+				}),
+				/* @__PURE__ */ o("div", {
+					className: T(),
+					children: [
+						/* @__PURE__ */ a(e, {
+							className: w(),
+							src: "WarningCircleOutlined",
+							color: "content.form.invalid",
+							alt: O.formatMessage({
+								id: "unity:component:form-field:form-input:error:alt",
+								defaultMessage: "Error"
+							})
+						}),
+						r && /* @__PURE__ */ a(t, {
+							label: O.formatMessage({
+								id: "unity:component:common:loading:label",
+								defaultMessage: "Loading..."
+							}),
+							color: "primary",
+							size: "small",
+							"aria-hidden": "true"
+						}),
+						/* @__PURE__ */ a(n, {
+							asElement: "button",
+							title: O.formatMessage({
+								id: "unity:component:common:clear:title",
+								defaultMessage: "Clear"
+							}),
+							className: D(),
+							icon: "CloseOutlined"
+						})
+					]
+				})
+			]
+		}), /* @__PURE__ */ a(l, {
+			className: E(),
+			children: _
+		})]
+	});
+});
+p.displayName = "Search";
+//#endregion
+export { p as Search, d as search };

package/dist/esm/components/segmented-button-group/SegmentedButtonGroup.js

@@ -1,22 +1,22 @@
-import { jsx as r } from "react/jsx-runtime";
+import { SegmentedButtonGroupProvider as e } from "./SegmentedButtonGroups.context.js";
+import { jsx as t } from "react/jsx-runtime";
 import { useRadioGroup as n } from "react-aria/useRadioGroup";
-import { useRadioGroupState as i } from "react-stately/useRadioGroupState";
-import { SegmentedButtonGroupProvider as a } from "./SegmentedButtonGroups.context.js";
-const d = (o) => {
-  const { children: e } = o, t = i(o), { radioGroupProps: u } = n(
-    { ...o, orientation: "horizontal" },
-    t
-  );
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      ...u,
-      className: "uy:bg-surface-neutral-low uy:py-50 uy:px-50 uy:flex uy:gap-50 uy:rounded-75 uy:w-fit",
-      children: /* @__PURE__ */ r(a, { state: t, children: e })
-    }
-  );
-};
-d.displayName = "SegmentedButtonGroup";
-export {
-  d as SegmentedButtonGroup
+import { useRadioGroupState as r } from "react-stately/useRadioGroupState";
+//#region src/components/segmented-button-group/SegmentedButtonGroup.tsx
+var i = (i) => {
+	let { children: a } = i, o = r(i), { radioGroupProps: s } = n({
+		...i,
+		orientation: "horizontal"
+	}, o);
+	return /* @__PURE__ */ t("div", {
+		...s,
+		className: "uy:bg-surface-neutral-low uy:py-50 uy:px-50 uy:flex uy:gap-50 uy:rounded-75 uy:w-fit",
+		children: /* @__PURE__ */ t(e, {
+			state: o,
+			children: a
+		})
+	});
 };
+i.displayName = "SegmentedButtonGroup";
+//#endregion
+export { i as SegmentedButtonGroup };

package/dist/esm/components/segmented-button-group/SegmentedButtonGroups.context.js

@@ -1,15 +1,12 @@
-import { jsx as o } from "react/jsx-runtime";
-import { createContext as r } from "react";
-const n = r({
-  state: {}
-});
-function i({
-  children: t,
-  state: e
-}) {
-  return /* @__PURE__ */ o(n.Provider, { value: { state: e }, children: t });
+import { createContext as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/segmented-button-group/SegmentedButtonGroups.context.tsx
+var n = e({ state: {} });
+function r({ children: e, state: r }) {
+	return /* @__PURE__ */ t(n.Provider, {
+		value: { state: r },
+		children: e
+	});
 }
-export {
-  n as SegmentedButtonGroupContext,
-  i as SegmentedButtonGroupProvider
-};
+//#endregion
+export { n as SegmentedButtonGroupContext, r as SegmentedButtonGroupProvider };