@payfit/unity-components 2.47.5 → 2.47.6

package/dist/esm/components/filter/parts/FilterPopover.js

@@ -1,81 +1,69 @@
-import { jsx as t, jsxs as a } from "react/jsx-runtime";
-import { uyTv as c, useUnityTheme as g } from "@payfit/unity-themes";
-import { Dialog as f } from "react-aria-components/Dialog";
-import { Popover as x } from "react-aria-components/Popover";
-import { Separator as h } from "react-aria-components/Separator";
-import { FormattedMessage as e } from "react-intl";
-import { Button as r } from "../../button/Button.js";
-const b = c({
-  slots: {
-    popover: [
-      "uy:border uy:border-solid uy:border-border-neutral uy:bg-surface-neutral uy:rounded-sm uy:shadow-300 uy:min-w-[320px] uy:max-w-[800px] uy:relative uy:isolate uy:overflow-hidden",
-      "uy:transition-all uy:duration-200 uy:linear uy:data-[entering]:opacity-100 uy:data-[exiting]:opacity-0",
-      'uy:data-[entering]:data-[placement="bottom"]:-translate-y-100 uy:data-[entering]:data-[placement="bottom"]:translate-x-0 uy:data-[exiting]:data-[placement="bottom"]:translate-y-0',
-      'uy:data-[entering]:data-[placement="top"]:translate-y-100 uy:data-[entering]:data-[placement="top"]:translate-x-0 uy:data-[exiting]:data-[placement="top"]:translate-y-0',
-      'uy:data-[entering]:data-[placement="left"]:translate-x-100 uy:data-[entering]:data-[placement="left"]:translate-y-0 uy:data-[exiting]:data-[placement="left"]:translate-x-0',
-      'uy:data-[entering]:data-[placement="right"]:-translate-x-100 uy:data-[entering]:data-[placement="right"]:translate-y-0 uy:data-[exiting]:data-[placement="right"]:translate-y-0'
-    ],
-    dialog: ["uy:flex uy:flex-col uy:gap-0"],
-    content: ["uy:flex-1 uy:max-h-[500px]"],
-    footer: [
-      "uy:mx-100 uy:mb-100",
-      "uy:sticky uy:bottom-0 uy:z-2",
-      "uy:flex-0",
-      "uy:bg-surface-neutral"
-    ],
-    separator: ["uy:mb-100 uy:bg-border-neutral uy:h-px"],
-    actions: ["uy:flex uy:justify-between uy:gap-100"]
-  }
-});
-function T({
-  children: n,
-  onConfirm: o,
-  onClear: l
-}) {
-  const { popover: i, dialog: u, content: y, footer: s, separator: d, actions: m } = b(), p = g();
-  return /* @__PURE__ */ t(x, { className: i(), placement: "bottom left", children: /* @__PURE__ */ a(f, { className: u(), children: [
-    /* @__PURE__ */ t("div", { className: y(), children: n }),
-    /* @__PURE__ */ a("footer", { className: s(), children: [
-      /* @__PURE__ */ t(h, { className: d() }),
-      /* @__PURE__ */ a("div", { className: m(), children: [
-        /* @__PURE__ */ t(
-          r,
-          {
-            variant: "ghost",
-            color: "danger",
-            size: "full",
-            prefixIcon: "TrashOutlined",
-            onPress: l,
-            children: /* @__PURE__ */ t(
-              e,
-              {
-                id: "unity:component:common:clear:title",
-                defaultMessage: "Clear"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ t(
-          r,
-          {
-            variant: p.theme === "legacy" ? "ghost" : "primary",
-            color: "primary",
-            size: "full",
-            onPress: o,
-            children: /* @__PURE__ */ t(
-              e,
-              {
-                id: "unity:component:filter:action:apply",
-                defaultMessage: "Apply"
-              }
-            )
-          }
-        )
-      ] })
-    ] })
-  ] }) });
+import { Button as e } from "../../button/Button.js";
+import { useUnityTheme as t, uyTv as n } from "@payfit/unity-themes";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { FormattedMessage as a } from "react-intl";
+import { Separator as o } from "react-aria-components/Separator";
+import { Popover as s } from "react-aria-components/Popover";
+import { Dialog as c } from "react-aria-components/Dialog";
+//#region src/components/filter/parts/FilterPopover.tsx
+var l = n({ slots: {
+	popover: [
+		"uy:border uy:border-solid uy:border-border-neutral uy:bg-surface-neutral uy:rounded-sm uy:shadow-300 uy:min-w-[320px] uy:max-w-[800px] uy:relative uy:isolate uy:overflow-hidden",
+		"uy:transition-all uy:duration-200 uy:linear uy:data-[entering]:opacity-100 uy:data-[exiting]:opacity-0",
+		"uy:data-[entering]:data-[placement=\"bottom\"]:-translate-y-100 uy:data-[entering]:data-[placement=\"bottom\"]:translate-x-0 uy:data-[exiting]:data-[placement=\"bottom\"]:translate-y-0",
+		"uy:data-[entering]:data-[placement=\"top\"]:translate-y-100 uy:data-[entering]:data-[placement=\"top\"]:translate-x-0 uy:data-[exiting]:data-[placement=\"top\"]:translate-y-0",
+		"uy:data-[entering]:data-[placement=\"left\"]:translate-x-100 uy:data-[entering]:data-[placement=\"left\"]:translate-y-0 uy:data-[exiting]:data-[placement=\"left\"]:translate-x-0",
+		"uy:data-[entering]:data-[placement=\"right\"]:-translate-x-100 uy:data-[entering]:data-[placement=\"right\"]:translate-y-0 uy:data-[exiting]:data-[placement=\"right\"]:translate-y-0"
+	],
+	dialog: ["uy:flex uy:flex-col uy:gap-0"],
+	content: ["uy:flex-1 uy:max-h-[500px]"],
+	footer: [
+		"uy:mx-100 uy:mb-100",
+		"uy:sticky uy:bottom-0 uy:z-2",
+		"uy:flex-0",
+		"uy:bg-surface-neutral"
+	],
+	separator: ["uy:mb-100 uy:bg-border-neutral uy:h-px"],
+	actions: ["uy:flex uy:justify-between uy:gap-100"]
+} });
+function u({ children: n, onConfirm: u, onClear: d }) {
+	let { popover: f, dialog: p, content: m, footer: h, separator: g, actions: _ } = l(), v = t();
+	return /* @__PURE__ */ r(s, {
+		className: f(),
+		placement: "bottom left",
+		children: /* @__PURE__ */ i(c, {
+			className: p(),
+			children: [/* @__PURE__ */ r("div", {
+				className: m(),
+				children: n
+			}), /* @__PURE__ */ i("footer", {
+				className: h(),
+				children: [/* @__PURE__ */ r(o, { className: g() }), /* @__PURE__ */ i("div", {
+					className: _(),
+					children: [/* @__PURE__ */ r(e, {
+						variant: "ghost",
+						color: "danger",
+						size: "full",
+						prefixIcon: "TrashOutlined",
+						onPress: d,
+						children: /* @__PURE__ */ r(a, {
+							id: "unity:component:common:clear:title",
+							defaultMessage: "Clear"
+						})
+					}), /* @__PURE__ */ r(e, {
+						variant: v.theme === "legacy" ? "ghost" : "primary",
+						color: "primary",
+						size: "full",
+						onPress: u,
+						children: /* @__PURE__ */ r(a, {
+							id: "unity:component:filter:action:apply",
+							defaultMessage: "Apply"
+						})
+					})]
+				})]
+			})]
+		})
+	});
 }
-export {
-  T as FilterPopover,
-  b as filterPopover
-};
+//#endregion
+export { u as FilterPopover, l as filterPopover };

package/dist/esm/components/filter/utils/value-formatters.js

@@ -1,14 +1,12 @@
-function t(r) {
-  return r !== null && typeof r == "object";
+//#region src/components/filter/utils/value-formatters.ts
+function e(e) {
+	return typeof e == "object" && !!e;
 }
-function n(r) {
-  return t(r) && Symbol.iterator in r;
+function t(t) {
+	return e(t) && Symbol.iterator in t;
 }
-function i(r) {
-  return !t(r) || !n(r) ? String(r) : Array.from(r).join(", ");
+function n(n) {
+	return !e(n) || !t(n) ? String(n) : Array.from(n).join(", ");
 }
-export {
-  i as defaultRenderLabel,
-  t as isCompositeValue,
-  n as isIterable
-};
+//#endregion
+export { n as defaultRenderLabel, t as isIterable };

package/dist/esm/components/filter-toolbar/FilterToolbar.js

@@ -1,173 +1,124 @@
-import { jsxs as b, jsx as r } from "react/jsx-runtime";
-import { forwardRef as B, useState as G, useMemo as f } from "react";
-import { uyTv as H } from "@payfit/unity-themes";
-import { Group as W } from "react-aria-components/Group";
-import { Toolbar as Y } from "react-aria-components/Toolbar";
-import { useId as k } from "react-aria/useId";
-import { useIntl as q, FormattedMessage as z } from "react-intl";
-import { Button as J } from "../button/Button.js";
-import { Filter as K } from "../filter/Filter.js";
-import { useFilterToolbarState as Q } from "./hooks/use-filter-toolbar-state.js";
-import { AddFilter as U } from "./parts/AddFilter.js";
-const X = H({
-  slots: {
-    base: ["uy:flex uy:gap-100 uy:flex-wrap uy:items-center"],
-    filters: ["uy:list-none uy:contents"],
-    actions: ["uy:contents"]
-  }
-}), Z = B(
-  ({
-    filterDefs: a,
-    initialValue: F,
-    onChange: y,
-    onClearFiltersPress: g,
-    onAddFilterPress: h,
-    ...C
-  }, L) => {
-    const i = q(), s = k(), [M, c] = G(
-      /* @__PURE__ */ new Set()
-    ), {
-      appliedFilters: m,
-      availableFilterDefs: v,
-      filterValues: A,
-      status: u,
-      addFilter: S,
-      clearFilters: T,
-      removeFilter: w,
-      setFilterValue: n
-    } = Q({
-      filterDefs: a,
-      initialValue: F,
-      onChange: y
-    }), x = f(
-      () => new Map(a.map((t) => [t.id, t])),
-      [a]
-    ), D = (t) => {
-      if (t === "all") return;
-      const l = Array.from(t).map(String);
-      S(l), c((e) => /* @__PURE__ */ new Set([...e, ...l])), h?.(l);
-    }, I = () => {
-      T(), g?.();
-    }, _ = (t, l) => {
-      n(t, l);
-    }, N = (t) => {
-      w(t);
-    }, P = (t) => {
-      c((l) => {
-        const e = new Set(l);
-        return e.delete(t), e;
-      });
-    }, E = u === "WITH_ALL_FILTERS_APPLIED", O = u !== "EMPTY", { base: V, filters: $, actions: j } = X(), d = f(() => ({
-      toolbar: i.formatMessage({
-        id: "unity:component:filter-toolbar:label",
-        defaultMessage: "Filter toolbar"
-      }),
-      filterList: i.formatMessage({
-        id: "unity:component:filter-toolbar:filter-list:label",
-        defaultMessage: "Applied filters"
-      }),
-      filterControls: i.formatMessage({
-        id: "unity:component:filter-toolbar:filter-controls:label",
-        defaultMessage: "Filter control"
-      })
-    }), [i]), o = f(() => ({
-      filterList: `filter-toolbar-${s}__filter-list`,
-      filterControls: `filter-toolbar-${s}__filter-controls`
-    }), [s]);
-    return /* @__PURE__ */ b(
-      Y,
-      {
-        ref: L,
-        className: V(),
-        "aria-label": d.toolbar,
-        ...C,
-        children: [
-          m.length > 0 && /* @__PURE__ */ r(
-            "ul",
-            {
-              className: $(),
-              "aria-live": "polite",
-              "aria-atomic": "true",
-              "aria-relevant": "additions removals",
-              "aria-label": d.filterList,
-              id: o.filterList,
-              children: m.map((t, l) => {
-                const e = x.get(t);
-                if (!e) return null;
-                const p = A.get(t);
-                return /* @__PURE__ */ r("li", { role: "presentation", children: /* @__PURE__ */ r(
-                  K,
-                  {
-                    id: e.id,
-                    label: e.label,
-                    value: p,
-                    onChange: (R) => {
-                      _(e.id, R);
-                    },
-                    renderControl: e.renderControl,
-                    renderLabel: e.renderLabel,
-                    isDismissable: !0,
-                    isDefaultOpen: M.has(t),
-                    onFilterOpen: () => {
-                      P(e.id);
-                    },
-                    onDismiss: () => {
-                      N(e.id);
-                    },
-                    onClearSelection: () => {
-                      n(e.id, void 0);
-                    },
-                    onConfirmSelection: () => {
-                      n(e.id, p);
-                    },
-                    ...e.filterProps
-                  }
-                ) }, `filter-item-${l}`);
-              })
-            }
-          ),
-          /* @__PURE__ */ b(
-            W,
-            {
-              className: j(),
-              "aria-label": d.filterControls,
-              id: o.filterControls,
-              children: [
-                /* @__PURE__ */ r(
-                  U,
-                  {
-                    availableFilterDefs: [...v],
-                    isDisabled: E,
-                    onSelectionChange: D,
-                    "aria-controls": o.filterControls
-                  }
-                ),
-                O && /* @__PURE__ */ r(
-                  J,
-                  {
-                    variant: "ghost",
-                    color: "neutral",
-                    onPress: I,
-                    "aria-controls": o.filterList,
-                    children: /* @__PURE__ */ r(
-                      z,
-                      {
-                        id: "unity:component:filter-toolbar:clear-filters:label",
-                        defaultMessage: "Clear filters"
-                      }
-                    )
-                  }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Z.displayName = "FilterToolbar";
-export {
-  Z as FilterToolbar,
-  X as filterToolbar
-};
+import { Button as e } from "../button/Button.js";
+import { Filter as t } from "../filter/Filter.js";
+import { useFilterToolbarState as n } from "./hooks/use-filter-toolbar-state.js";
+import { AddFilter as r } from "./parts/AddFilter.js";
+import "./utils/filter-adapters.js";
+import { forwardRef 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 { Group as u } from "react-aria-components/Group";
+import { Toolbar as d } from "react-aria-components/Toolbar";
+import { FormattedMessage as f, useIntl as p } from "react-intl";
+import { useId as m } from "react-aria/useId";
+//#region src/components/filter-toolbar/FilterToolbar.tsx
+var h = s({ slots: {
+	base: ["uy:flex uy:gap-100 uy:flex-wrap uy:items-center"],
+	filters: ["uy:list-none uy:contents"],
+	actions: ["uy:contents"]
+} }), g = i(({ filterDefs: i, initialValue: s, onChange: g, onClearFiltersPress: _, onAddFilterPress: v, ...y }, b) => {
+	let x = p(), S = m(), [C, w] = o(/* @__PURE__ */ new Set()), { appliedFilters: T, availableFilterDefs: E, filterValues: D, status: O, addFilter: k, clearFilters: A, removeFilter: j, setFilterValue: M } = n({
+		filterDefs: i,
+		initialValue: s,
+		onChange: g
+	}), N = a(() => new Map(i.map((e) => [e.id, e])), [i]), P = (e) => {
+		if (e === "all") return;
+		let t = Array.from(e).map(String);
+		k(t), w((e) => new Set([...e, ...t])), v?.(t);
+	}, F = () => {
+		A(), _?.();
+	}, I = (e, t) => {
+		M(e, t);
+	}, L = (e) => {
+		j(e);
+	}, R = (e) => {
+		w((t) => {
+			let n = new Set(t);
+			return n.delete(e), n;
+		});
+	}, z = O === "WITH_ALL_FILTERS_APPLIED", B = O !== "EMPTY", { base: V, filters: H, actions: U } = h(), W = a(() => ({
+		toolbar: x.formatMessage({
+			id: "unity:component:filter-toolbar:label",
+			defaultMessage: "Filter toolbar"
+		}),
+		filterList: x.formatMessage({
+			id: "unity:component:filter-toolbar:filter-list:label",
+			defaultMessage: "Applied filters"
+		}),
+		filterControls: x.formatMessage({
+			id: "unity:component:filter-toolbar:filter-controls:label",
+			defaultMessage: "Filter control"
+		})
+	}), [x]), G = a(() => ({
+		filterList: `filter-toolbar-${S}__filter-list`,
+		filterControls: `filter-toolbar-${S}__filter-controls`
+	}), [S]);
+	return /* @__PURE__ */ l(d, {
+		ref: b,
+		className: V(),
+		"aria-label": W.toolbar,
+		...y,
+		children: [T.length > 0 && /* @__PURE__ */ c("ul", {
+			className: H(),
+			"aria-live": "polite",
+			"aria-atomic": "true",
+			"aria-relevant": "additions removals",
+			"aria-label": W.filterList,
+			id: G.filterList,
+			children: T.map((e, n) => {
+				let r = N.get(e);
+				if (!r) return null;
+				let i = D.get(e);
+				return /* @__PURE__ */ c("li", {
+					role: "presentation",
+					children: /* @__PURE__ */ c(t, {
+						id: r.id,
+						label: r.label,
+						value: i,
+						onChange: (e) => {
+							I(r.id, e);
+						},
+						renderControl: r.renderControl,
+						renderLabel: r.renderLabel,
+						isDismissable: !0,
+						isDefaultOpen: C.has(e),
+						onFilterOpen: () => {
+							R(r.id);
+						},
+						onDismiss: () => {
+							L(r.id);
+						},
+						onClearSelection: () => {
+							M(r.id, void 0);
+						},
+						onConfirmSelection: () => {
+							M(r.id, i);
+						},
+						...r.filterProps
+					})
+				}, `filter-item-${n}`);
+			})
+		}), /* @__PURE__ */ l(u, {
+			className: U(),
+			"aria-label": W.filterControls,
+			id: G.filterControls,
+			children: [/* @__PURE__ */ c(r, {
+				availableFilterDefs: [...E],
+				isDisabled: z,
+				onSelectionChange: P,
+				"aria-controls": G.filterControls
+			}), B && /* @__PURE__ */ c(e, {
+				variant: "ghost",
+				color: "neutral",
+				onPress: F,
+				"aria-controls": G.filterList,
+				children: /* @__PURE__ */ c(f, {
+					id: "unity:component:filter-toolbar:clear-filters:label",
+					defaultMessage: "Clear filters"
+				})
+			})]
+		})]
+	});
+});
+g.displayName = "FilterToolbar";
+//#endregion
+export { g as FilterToolbar, h as filterToolbar };