synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
194 lines (193 loc) • 6.43 kB
JavaScript
import { jsxs as n, jsx as e, Fragment as T } from "react/jsx-runtime";
import { TextField as q, Tooltip as w, IconButton as _, FormControlLabel as J, Checkbox as K, Collapse as Q } from "@mui/material";
import { useState as u, useMemo as k, useRef as Y } from "react";
import x from "../../../IconSvg/IconSvg.js";
import { FacetFilterHeader as Z } from "../FacetFilterHeader.js";
import { EnumFacetFilterOption as $ } from "./EnumFacetFilterOption.js";
import ee from "./EnumFacetFilterDropdown.js";
const a = 5;
function N(m) {
return m.replace(/\s/g, "").toLowerCase();
}
function ie(m) {
const {
filterIsActive: o,
containerAs: C = "Collapsible",
dropdownType: I = "Icon",
hideCollapsible: M = !1,
facetValues: t,
onAddValueToSelection: V,
onRemoveValueFromSelection: L,
facetTitle: f,
onRemoveAllFacetSelections: z,
onHoverOverValue: y,
canMultiSelect: B = !0,
defaultShowAllValues: v = !1
} = m, [O, F] = u(v), [g, R] = u(!1), [c, b] = u(!1), [r, p] = u(""), E = t.length > a && t.slice(a).some(({ isSelected: l }) => l), h = C === "Dropdown" || O || c || E, s = k(() => c && r.length > 0 ? t.filter(({ displayText: l }) => l.toLowerCase().indexOf(r.trim().toLowerCase()) > -1) : h ? t : t.slice(0, a), [t, r, c, h]), S = Y(null), d = C === "Dropdown", D = !h && t.length > a, H = h && !r && !E && t.length > a, A = /* @__PURE__ */ n("div", { className: d ? "EnumFacetFilter__dropdown_menu" : "", children: [
/* @__PURE__ */ n("div", { className: "EnumFacetFilter__checkboxContainer--forAll", children: [
/* @__PURE__ */ e(
q,
{
sx: {
display: c ? void 0 : "none"
},
size: "small",
fullWidth: !0,
slotProps: {
input: {
startAdornment: /* @__PURE__ */ e(w, { title: "Close search", children: /* @__PURE__ */ e(
_,
{
size: "small",
onClick: () => {
b(!1), F(v);
},
children: /* @__PURE__ */ e(
x,
{
sx: { fontSize: "inherit" },
wrap: !1,
icon: "arrowBack"
}
)
}
) }),
endAdornment: r.length > 0 && /* @__PURE__ */ e(w, { title: "Clear", children: /* @__PURE__ */ e(
_,
{
size: "small",
onClick: () => {
p(""), S.current?.focus();
},
children: /* @__PURE__ */ e(
x,
{
sx: { fontSize: "inherit" },
wrap: !1,
icon: "close"
}
)
}
) })
}
},
type: "text",
placeholder: "Find values",
value: r,
ref: S,
onChange: (l) => {
p(l.target.value);
}
}
),
!c && /* @__PURE__ */ n("div", { className: "EnumFacetFilter__checkAll", children: [
/* @__PURE__ */ e(
J,
{
control: /* @__PURE__ */ e(K, {}),
className: "EnumFacetFilter__checkbox",
onChange: () => {
o && z();
},
checked: !o,
label: "All"
},
"select_all"
),
/* @__PURE__ */ e(w, { title: "Search", children: /* @__PURE__ */ e(
_,
{
size: "small",
sx: { aspectRatio: "1 / 1" },
onClick: () => {
p(""), b(!0), S.current?.focus();
},
children: /* @__PURE__ */ e(
x,
{
sx: { fontSize: "inherit" },
wrap: !1,
icon: "search"
}
)
}
) })
] })
] }),
/* @__PURE__ */ n("div", { children: [
s.map((l, U) => {
const { isSelected: W, displayText: G, value: i, count: P } = l;
return /* @__PURE__ */ e(
$,
{
id: [
N(f),
N(String(i)),
U
].join("-"),
label: G,
count: P,
isDropdown: d,
checked: W,
onHover: () => {
y(i);
},
onChange: (X) => {
X ? V(i) : L(i);
},
inputType: B ? "checkbox" : "radio"
},
String(i)
);
}),
!d && /* @__PURE__ */ n(T, { children: [
D && /* @__PURE__ */ e(
"button",
{
className: "EnumFacetFilter__showMoreFacetsBtn",
onClick: () => F(!0),
children: /* @__PURE__ */ e("div", { className: "EnumFacetFilter__checkboxContainer", children: /* @__PURE__ */ n("div", { className: "EnumFacetFilter__showMoreFacetsLabel", children: [
"Show all (",
t.length,
")"
] }) })
}
),
H && /* @__PURE__ */ e(
"button",
{
className: "EnumFacetFilter__showMoreFacetsBtn",
onClick: () => F(!1),
children: /* @__PURE__ */ e("div", { className: "EnumFacetFilter__checkboxContainer", children: /* @__PURE__ */ e("div", { className: "EnumFacetFilter__showMoreFacetsLabel", children: "Show less" }) })
}
)
] }),
s.length <= 0 && /* @__PURE__ */ e("div", { className: "EnumFacetFilter__noMatch", children: "No match found" })
] })
] }), j = k(() => o ? o && s.filter((l) => l.isSelected).length === 1 ? s.filter((l) => l.isSelected)[0].displayText : "Multiple Values Selected" : "All", [o, s]);
return d ? /* @__PURE__ */ e(
ee,
{
facetTitle: f,
dropdownType: I,
menuText: j,
filterIsActive: o,
children: A
}
) : /* @__PURE__ */ n(T, { children: [
/* @__PURE__ */ e(
Z,
{
hideCollapsible: M,
isCollapsed: g,
label: f,
onClick: (l) => R(l)
}
),
/* @__PURE__ */ e(Q, { className: "EnumFacetFilter", in: !g, children: A })
] });
}
export {
ie as default
};
//# sourceMappingURL=EnumFacetFilterUI.js.map