@payfit/unity-components 2.47.4 → 2.47.6

package/dist/esm/components/select-list/parts/SelectListOption.js

@@ -1,72 +1,56 @@
-import { jsx as t, jsxs as s } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { uyTv as b } from "@payfit/unity-themes";
-import { ListBoxItem as m } from "react-aria-components/ListBox";
-import x from "../../../hooks/use-id.js";
-import { CheckboxIndicator as v } from "../../checkbox/parts/CheckboxIndicator.js";
-const h = b({
-  slots: {
-    base: [
-      "uy:flex uy:flex-col uy:transition",
-      "uy:w-full uy:px-150 uy:py-100",
-      "uy:rounded-50 uy:cursor-pointer",
-      "uy:hover:bg-surface-neutral-hover",
-      "uy:active:bg-surface-neutral-pressed",
-      "uy:data-[focus-visible]:outline uy:data-[focus-visible]:outline-2 uy:data-[focus-visible]:outline-utility-focus-ring uy:data-[focus-visible]:-outline-offset-2"
-    ],
-    label: "uy:inline-flex uy:items-center uy:gap-100 uy:text-content-neutral uy:typography-body",
-    helperText: "uy:inline-block uy:typography-body uy:text-content-neutral-low uy:pl-300"
-  },
-  variants: {
-    isDisabled: {
-      true: {
-        base: "uy:cursor-not-allowed!",
-        label: "uy:text-content-neutral-disabled"
-      },
-      false: {
-        base: ""
-      }
-    }
-  }
+import e from "../../../hooks/use-id.js";
+import { CheckboxIndicator as t } from "../../checkbox/parts/CheckboxIndicator.js";
+import { forwardRef as n } from "react";
+import { uyTv as r } from "@payfit/unity-themes";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { ListBoxItem as o } from "react-aria-components/ListBox";
+//#region src/components/select-list/parts/SelectListOption.tsx
+var s = r({
+	slots: {
+		base: [
+			"uy:flex uy:flex-col uy:transition",
+			"uy:w-full uy:px-150 uy:py-100",
+			"uy:rounded-50 uy:cursor-pointer",
+			"uy:hover:bg-surface-neutral-hover",
+			"uy:active:bg-surface-neutral-pressed",
+			"uy:data-[focus-visible]:outline uy:data-[focus-visible]:outline-2 uy:data-[focus-visible]:outline-utility-focus-ring uy:data-[focus-visible]:-outline-offset-2"
+		],
+		label: "uy:inline-flex uy:items-center uy:gap-100 uy:text-content-neutral uy:typography-body",
+		helperText: "uy:inline-block uy:typography-body uy:text-content-neutral-low uy:pl-300"
+	},
+	variants: { isDisabled: {
+		true: {
+			base: "uy:cursor-not-allowed!",
+			label: "uy:text-content-neutral-disabled"
+		},
+		false: { base: "" }
+	} }
 });
-function a({
-  children: o,
-  isDisabled: i = !1,
-  textValue: u,
-  helperText: e,
-  ...r
-}, n) {
-  const l = x(), {
-    base: y,
-    label: c,
-    helperText: d
-  } = h({ isDisabled: i });
-  return /* @__PURE__ */ t(
-    m,
-    {
-      "data-dd-privacy": "mask",
-      ...r,
-      className: y(),
-      textValue: u ?? o,
-      "aria-describedby": e ? `${l}-helper-text` : void 0,
-      children: ({ isSelected: p }) => /* @__PURE__ */ s("div", { ref: n, children: [
-        /* @__PURE__ */ s("div", { className: c(), children: [
-          /* @__PURE__ */ t(
-            v,
-            {
-              isSelected: p,
-              isDisabled: i
-            }
-          ),
-          o
-        ] }),
-        e && /* @__PURE__ */ t("span", { id: `${l}-helper-text`, className: d(), children: e })
-      ] })
-    }
-  );
+function c({ children: n, isDisabled: r = !1, textValue: c, helperText: l, ...u }, d) {
+	let f = e(), { base: p, label: m, helperText: h } = s({ isDisabled: r });
+	return /* @__PURE__ */ i(o, {
+		"data-dd-privacy": "mask",
+		...u,
+		className: p(),
+		textValue: c ?? n,
+		"aria-describedby": l ? `${f}-helper-text` : void 0,
+		children: ({ isSelected: e }) => /* @__PURE__ */ a("div", {
+			ref: d,
+			children: [/* @__PURE__ */ a("div", {
+				className: m(),
+				children: [/* @__PURE__ */ i(t, {
+					isSelected: e,
+					isDisabled: r
+				}), n]
+			}), l && /* @__PURE__ */ i("span", {
+				id: `${f}-helper-text`,
+				className: h(),
+				children: l
+			})]
+		})
+	});
 }
-a.displayName = "SelectListOption";
-const C = f(a);
-export {
-  C as SelectListOption
-};
+c.displayName = "SelectListOption";
+var l = n(c);
+//#endregion
+export { l as SelectListOption };

package/dist/esm/components/select-list/parts/SelectListSearchInput.js

@@ -1,51 +1,45 @@
-import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import { forwardRef as u } from "react";
-import { uyTv as s } from "@payfit/unity-themes";
-import { Input as a } from "react-aria-components/Input";
+import { Icon as e } from "../../icon/Icon.js";
+import { CircularIconButton as t } from "../../icon-button/CircularIconButton.js";
+import { forwardRef as n } from "react";
+import { uyTv as r } from "@payfit/unity-themes";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { useIntl as o } from "react-intl";
+import { Input as s } from "react-aria-components/Input";
 import { SearchField as c } from "react-aria-components/SearchField";
-import { useIntl as l } from "react-intl";
-import { CircularIconButton as m } from "../../icon-button/CircularIconButton.js";
-import { Icon as y } from "../../icon/Icon.js";
-const f = s({
-  slots: {
-    base: "uy:flex uy:gap-100 uy:items-center 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:focus-within:outline-utility-focus-ring uy:focus-within:outline-2 uy:focus-within:outline-offset-2 uy:text-content-form-active uy:typography-body",
-    input: "uy:flex-grow uy:outline-none uy:[&::-webkit-search-cancel-button]:hidden"
-  }
-}), p = u((d, o) => {
-  const e = l(), { base: n, input: r } = f();
-  return /* @__PURE__ */ i(c, { className: n(), ref: o, "data-dd-privacy": "mask", children: [
-    /* @__PURE__ */ t(
-      y,
-      {
-        src: "MagnifyingGlassOutlined",
-        role: "presentation",
-        color: "content.neutral.lowest"
-      }
-    ),
-    /* @__PURE__ */ t(
-      a,
-      {
-        "aria-label": e.formatMessage({
-          id: "unity:component:common:search:label",
-          defaultMessage: "Search"
-        }),
-        className: r()
-      }
-    ),
-    /* @__PURE__ */ t(
-      m,
-      {
-        title: e.formatMessage({
-          id: "unity:component:common:clear:title",
-          defaultMessage: "Clear"
-        }),
-        icon: "CloseOutlined",
-        asElement: "button"
-      }
-    )
-  ] });
+//#region src/components/select-list/parts/SelectListSearchInput.tsx
+var l = r({ slots: {
+	base: "uy:flex uy:gap-100 uy:items-center 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:focus-within:outline-utility-focus-ring uy:focus-within:outline-2 uy:focus-within:outline-offset-2 uy:text-content-form-active uy:typography-body",
+	input: "uy:flex-grow uy:outline-none uy:[&::-webkit-search-cancel-button]:hidden"
+} }), u = n((n, r) => {
+	let u = o(), { base: d, input: f } = l();
+	return /* @__PURE__ */ a(c, {
+		className: d(),
+		ref: r,
+		"data-dd-privacy": "mask",
+		children: [
+			/* @__PURE__ */ i(e, {
+				src: "MagnifyingGlassOutlined",
+				role: "presentation",
+				color: "content.neutral.lowest"
+			}),
+			/* @__PURE__ */ i(s, {
+				"aria-label": u.formatMessage({
+					id: "unity:component:common:search:label",
+					defaultMessage: "Search"
+				}),
+				className: f()
+			}),
+			/* @__PURE__ */ i(t, {
+				title: u.formatMessage({
+					id: "unity:component:common:clear:title",
+					defaultMessage: "Clear"
+				}),
+				icon: "CloseOutlined",
+				asElement: "button"
+			})
+		]
+	});
 });
-p.displayName = "SelectListSearchInput";
-export {
-  p as SelectListSearchInput
-};
+u.displayName = "SelectListSearchInput";
+//#endregion
+export { u as SelectListSearchInput };

package/dist/esm/components/select-list/parts/SelectedItemsSection.js

@@ -1,36 +1,30 @@
-import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import { Header as h, ListBox as p, Collection as u } from "react-aria-components/ListBox";
-import { SelectListOption as f } from "./SelectListOption.js";
-function S({
-  items: r,
-  selectedKeys: i,
-  onSelectionChange: n,
-  selectionMode: c,
-  selectionBehavior: t,
-  label: l,
-  className: d,
-  ...s
-}) {
-  return r.length === 0 ? null : /* @__PURE__ */ a("div", { children: [
-    /* @__PURE__ */ e(h, { className: "uy:sr-only", children: l }),
-    /* @__PURE__ */ e(
-      p,
-      {
-        "aria-label": l,
-        className: d,
-        items: r,
-        selectedKeys: i,
-        onSelectionChange: n,
-        selectionMode: c,
-        selectionBehavior: t,
-        escapeKeyBehavior: "none",
-        shouldFocusWrap: !1,
-        ...s,
-        children: /* @__PURE__ */ e(u, { items: r, children: (o) => /* @__PURE__ */ e(f, { id: o.id, children: o.label }) })
-      }
-    )
-  ] });
+import { SelectListOption as e } from "./SelectListOption.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { Collection as r, Header as i, ListBox as a } from "react-aria-components/ListBox";
+//#region src/components/select-list/parts/SelectedItemsSection.tsx
+function o({ items: o, selectedKeys: s, onSelectionChange: c, selectionMode: l, selectionBehavior: u, label: d, className: f, ...p }) {
+	return o.length === 0 ? null : /* @__PURE__ */ n("div", { children: [/* @__PURE__ */ t(i, {
+		className: "uy:sr-only",
+		children: d
+	}), /* @__PURE__ */ t(a, {
+		"aria-label": d,
+		className: f,
+		items: o,
+		selectedKeys: s,
+		onSelectionChange: c,
+		selectionMode: l,
+		selectionBehavior: u,
+		escapeKeyBehavior: "none",
+		shouldFocusWrap: !1,
+		...p,
+		children: /* @__PURE__ */ t(r, {
+			items: o,
+			children: (n) => /* @__PURE__ */ t(e, {
+				id: n.id,
+				children: n.label
+			})
+		})
+	})] });
 }
-export {
-  S as SelectedItemsSection
-};
+//#endregion
+export { o as SelectedItemsSection };

package/dist/esm/components/select-list/utils/partition.js

@@ -1,9 +1,8 @@
-function e(n, i) {
-  const o = [], s = [];
-  for (const t of n)
-    i(t) ? o.push(t) : s.push(t);
-  return [o, s];
+//#region src/components/select-list/utils/partition.ts
+function e(e, t) {
+	let n = [], r = [];
+	for (let i of e) t(i) ? n.push(i) : r.push(i);
+	return [n, r];
 }
-export {
-  e as partition
-};
+//#endregion
+export { e as partition };

package/dist/esm/components/selectable-button-group/SelectableButtonGroup.context.js

@@ -1,5 +1,5 @@
-import { createContext as t } from "react";
-const o = t(null);
-export {
-  o as SelectableButtonGroupContext
-};
+import { createContext as e } from "react";
+//#region src/components/selectable-button-group/SelectableButtonGroup.context.tsx
+var t = e(null);
+//#endregion
+export { t as SelectableButtonGroupContext };

package/dist/esm/components/selectable-button-group/SelectableButtonGroup.js

@@ -1,40 +1,34 @@
+import { SelectableButtonGroupContext as e } from "./SelectableButtonGroup.context.js";
+import { forwardRef as t, useCallback as n, useRef as r } from "react";
+import { uyTv as i } from "@payfit/unity-themes";
 import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as i, useRef as s, useCallback as m } from "react";
-import { uyTv as f } from "@payfit/unity-themes";
-import { useToggleButtonGroup as y } from "react-aria/useToggleButtonGroup";
-import { useToggleGroupState as g } from "react-stately/useToggleGroupState";
-import { SelectableButtonGroupContext as v } from "./SelectableButtonGroup.context.js";
-const B = f({
-  base: "uy:group uy:flex uy:gap-100 uy:flex-wrap"
-}), b = i((e, t) => {
-  const o = s(null), u = g({
-    ...e,
-    selectedKeys: e.value,
-    defaultSelectedKeys: e.defaultValue,
-    onSelectionChange: (l) => {
-      e.onChange?.(Array.from(l));
-    }
-  }), { groupProps: n } = y(e, u, o), r = B({ className: e.className }), c = m(
-    (l) => {
-      o.current = l, typeof t == "function" ? t(l) : t && (t.current = l);
-    },
-    [t]
-  );
-  return /* @__PURE__ */ a(
-    "div",
-    {
-      ...n,
-      className: r,
-      ref: c,
-      "data-dd-privacy": "allow",
-      "aria-invalid": e.isInvalid,
-      onBlur: e.onBlur,
-      children: /* @__PURE__ */ a(v.Provider, { value: u, children: e.children })
-    }
-  );
+import { useToggleButtonGroup as o } from "react-aria/useToggleButtonGroup";
+import { useToggleGroupState as s } from "react-stately/useToggleGroupState";
+//#region src/components/selectable-button-group/SelectableButtonGroup.tsx
+var c = i({ base: "uy:group uy:flex uy:gap-100 uy:flex-wrap" }), l = t((t, i) => {
+	let l = r(null), u = s({
+		...t,
+		selectedKeys: t.value,
+		defaultSelectedKeys: t.defaultValue,
+		onSelectionChange: (e) => {
+			t.onChange?.(Array.from(e));
+		}
+	}), { groupProps: d } = o(t, u, l), f = c({ className: t.className }), p = n((e) => {
+		l.current = e, typeof i == "function" ? i(e) : i && (i.current = e);
+	}, [i]);
+	return /* @__PURE__ */ a("div", {
+		...d,
+		className: f,
+		ref: p,
+		"data-dd-privacy": "allow",
+		"aria-invalid": t.isInvalid,
+		onBlur: t.onBlur,
+		children: /* @__PURE__ */ a(e.Provider, {
+			value: u,
+			children: t.children
+		})
+	});
 });
-b.displayName = "SelectableButtonGroup";
-export {
-  b as SelectableButtonGroup,
-  B as selectableButtonGroup
-};
+l.displayName = "SelectableButtonGroup";
+//#endregion
+export { l as SelectableButtonGroup, c as selectableButtonGroup };

package/dist/esm/components/selectable-button-group/TanstackSelectableButtonGroup.js

@@ -1,34 +1,28 @@
-import { jsx as c } from "react/jsx-runtime";
-import { forwardRef as u, useCallback as m } from "react";
-import { useFieldContext as f } from "../../hooks/tanstack-form-context.js";
-import { useFieldA11yContext as p } from "../form-field/TanstackFormField.context.js";
-import { SelectableButtonGroup as b } from "./SelectableButtonGroup.js";
-const T = u(({ onChange: o, ...l }, n) => {
-  const e = f(), a = p(), i = e.state.meta.isTouched && !e.state.meta.isValid, d = m(
-    (t) => {
-      const r = t.relatedTarget, s = t.currentTarget;
-      (!r || !s.contains(r)) && e.handleBlur();
-    },
-    [e]
-  );
-  return /* @__PURE__ */ c(
-    b,
-    {
-      ...l,
-      ref: n,
-      value: e.state.value,
-      onChange: (t) => {
-        e.handleChange(t), o?.(t);
-      },
-      onBlur: d,
-      isInvalid: i,
-      "aria-labelledby": a.labelId,
-      "aria-describedby": [a.helperTextId, a.feedbackTextId].filter(Boolean).join(" ") || void 0,
-      "aria-details": a.contextualLinkId
-    }
-  );
+import { SelectableButtonGroup as e } from "./SelectableButtonGroup.js";
+import { useFieldContext as t } from "../../hooks/tanstack-form-context.js";
+import { useFieldA11yContext as n } from "../form-field/TanstackFormField.context.js";
+import { forwardRef as r, useCallback as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/components/selectable-button-group/TanstackSelectableButtonGroup.tsx
+var o = r(({ onChange: r, ...o }, s) => {
+	let c = t(), l = n(), u = c.state.meta.isTouched && !c.state.meta.isValid, d = i((e) => {
+		let t = e.relatedTarget, n = e.currentTarget;
+		(!t || !n.contains(t)) && c.handleBlur();
+	}, [c]);
+	return /* @__PURE__ */ a(e, {
+		...o,
+		ref: s,
+		value: c.state.value,
+		onChange: (e) => {
+			c.handleChange(e), r?.(e);
+		},
+		onBlur: d,
+		isInvalid: u,
+		"aria-labelledby": l.labelId,
+		"aria-describedby": [l.helperTextId, l.feedbackTextId].filter(Boolean).join(" ") || void 0,
+		"aria-details": l.contextualLinkId
+	});
 });
-T.displayName = "TanstackSelectableButtonGroup";
-export {
-  T as TanstackSelectableButtonGroup
-};
+o.displayName = "TanstackSelectableButtonGroup";
+//#endregion
+export { o as TanstackSelectableButtonGroup };