@pibit.ai/cure-design-system 0.6.36 → 0.6.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +311 -288
- package/dist/patterns/condition-builder/condition-builder.d.ts.map +1 -1
- package/dist/patterns/condition-builder/condition-builder.js +47 -47
- package/dist/patterns/condition-builder/utils.d.ts.map +1 -1
- package/dist/patterns/filter-group/date-adapter.d.ts +20 -0
- package/dist/patterns/filter-group/date-adapter.d.ts.map +1 -0
- package/dist/patterns/filter-group/date-adapter.js +38 -0
- package/dist/patterns/filter-group/document-fields-to-tree.d.ts +33 -0
- package/dist/patterns/filter-group/document-fields-to-tree.d.ts.map +1 -0
- package/dist/patterns/filter-group/document-fields-to-tree.js +53 -0
- package/dist/patterns/filter-group/filter-condition-row.d.ts +47 -0
- package/dist/patterns/filter-group/filter-condition-row.d.ts.map +1 -0
- package/dist/patterns/filter-group/filter-condition-row.js +642 -0
- package/dist/patterns/filter-group/filter-group-builder.d.ts +42 -0
- package/dist/patterns/filter-group/filter-group-builder.d.ts.map +1 -0
- package/dist/patterns/filter-group/filter-group-builder.js +92 -0
- package/dist/patterns/filter-group/filter-group-card.d.ts +25 -0
- package/dist/patterns/filter-group/filter-group-card.d.ts.map +1 -0
- package/dist/patterns/filter-group/filter-group-card.js +266 -0
- package/dist/patterns/filter-group/index.d.ts +11 -0
- package/dist/patterns/filter-group/index.d.ts.map +1 -0
- package/dist/patterns/filter-group/nested-field-select.d.ts +68 -0
- package/dist/patterns/filter-group/nested-field-select.d.ts.map +1 -0
- package/dist/patterns/filter-group/nested-field-select.js +431 -0
- package/dist/patterns/filter-group/types.d.ts +105 -0
- package/dist/patterns/filter-group/types.d.ts.map +1 -0
- package/dist/patterns/filter-group/types.js +222 -0
- package/dist/patterns/filter-group/use-filter-group.d.ts +38 -0
- package/dist/patterns/filter-group/use-filter-group.d.ts.map +1 -0
- package/dist/patterns/filter-group/use-filter-group.js +81 -0
- package/dist/patterns/filter-group/validation.d.ts +13 -0
- package/dist/patterns/filter-group/validation.d.ts.map +1 -0
- package/dist/patterns/filter-group/validation.js +19 -0
- package/dist/styles/components.css +1 -1
- package/package.json +2 -1
|
@@ -0,0 +1,431 @@
|
|
|
1
|
+
import { jsxs as c, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { useState as H, useRef as st, useCallback as q, useMemo as T, useEffect as Bt } from "react";
|
|
3
|
+
import { Check as Ot, ChevronDown as ot, Calendar as mt, Dataflow02 as pt, Variable as Et, Table as jt, Hash02 as Pt, Toggle01Left as At, List as _t, TypeSquare as $t, XClose as Kt } from "@untitledui/icons";
|
|
4
|
+
import { today as Dt, getLocalTimeZone as zt, CalendarDate as Rt } from "@internationalized/date";
|
|
5
|
+
import { cx as l } from "../../utils/cn.js";
|
|
6
|
+
import { documentFieldsToTreeData as Gt, filterTreeBySearch as Ht, getExpandedIdsForTree as lt, getExpandedIdsForSelectedField as It, TREE_CONFIG as Qt } from "./document-fields-to-tree.js";
|
|
7
|
+
import { Button as J, DialogTrigger as Y, Popover as ct } from "react-aria-components";
|
|
8
|
+
import { ControlledCalendarContextProvider as Ut, Calendar as Lt } from "../../applications/date-picker/calendar.js";
|
|
9
|
+
import { createEllipsisContent as ft } from "../../primitives/tooltip/ellipsis-content.js";
|
|
10
|
+
import Wt from "../../primitives/select/SearchInput.js";
|
|
11
|
+
import { TreeView as Xt } from "../tree-view/tree-view.js";
|
|
12
|
+
import { ButtonUtility as Zt } from "../../primitives/button/button-utility.js";
|
|
13
|
+
import { Button as dt } from "../../primitives/button/button.js";
|
|
14
|
+
function Jt(o) {
|
|
15
|
+
if (!o || typeof o != "string") return null;
|
|
16
|
+
const r = o.trim().match(/^(0?[1-9]|1[0-2])\/(0?[1-9]|[12]\d|3[01])\/(\d{1,4})$/);
|
|
17
|
+
if (!r) return null;
|
|
18
|
+
const [, u, a, N] = r, h = parseInt(N, 10);
|
|
19
|
+
return new Rt(h, parseInt(u, 10), parseInt(a, 10));
|
|
20
|
+
}
|
|
21
|
+
function Yt(o) {
|
|
22
|
+
return `${o.month}/${o.day}/${o.year}`;
|
|
23
|
+
}
|
|
24
|
+
const S = {
|
|
25
|
+
sm: "text-xs",
|
|
26
|
+
md: "text-sm",
|
|
27
|
+
lg: "text-md"
|
|
28
|
+
}, j = {
|
|
29
|
+
sm: "size-4",
|
|
30
|
+
md: "size-5",
|
|
31
|
+
lg: "size-6"
|
|
32
|
+
}, ut = {
|
|
33
|
+
sm: { button: "p-2 h-8 text-xs rounded-md", item: "py-2 px-2.5 text-sm", search: "py-2 px-3 text-sm" },
|
|
34
|
+
md: { button: "py-2 px-3 h-9 text-sm rounded-md", item: "py-2.5 px-3 text-md", search: "py-2.5 px-3.5 text-md" },
|
|
35
|
+
lg: { button: "py-2.5 px-3.5 h-11 text-md rounded-lg", item: "py-3 px-4 text-lg", search: "py-3 px-4 text-lg" }
|
|
36
|
+
};
|
|
37
|
+
function ht(o, r, u = []) {
|
|
38
|
+
if (r.length === 0) return null;
|
|
39
|
+
for (let a = 1; a <= r.length; a += 1) {
|
|
40
|
+
const N = r.slice(0, a).join("."), h = o.find((f) => f.key === N);
|
|
41
|
+
if (!h) continue;
|
|
42
|
+
const d = r.slice(a);
|
|
43
|
+
if (d.length === 0) return { field: h, ancestorLabels: u };
|
|
44
|
+
if (h.children) {
|
|
45
|
+
const f = ht(h.children, d, [...u, h.label]);
|
|
46
|
+
if (f) return f;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
return null;
|
|
50
|
+
}
|
|
51
|
+
function Mt({ type: o }) {
|
|
52
|
+
const r = (o || "").toLowerCase();
|
|
53
|
+
return r === "formula" ? /* @__PURE__ */ e(Et, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : r === "document" ? /* @__PURE__ */ e(jt, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : r === "date" ? /* @__PURE__ */ e(mt, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : r === "number" || r === "integer" ? /* @__PURE__ */ e(Pt, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : r === "boolean" ? /* @__PURE__ */ e(At, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : r === "object" ? /* @__PURE__ */ e(pt, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : r === "list" ? /* @__PURE__ */ e(_t, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : /* @__PURE__ */ e($t, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 });
|
|
54
|
+
}
|
|
55
|
+
const de = ({
|
|
56
|
+
documentFields: o,
|
|
57
|
+
selectedFieldId: r,
|
|
58
|
+
onFieldSelect: u,
|
|
59
|
+
size: a = "sm",
|
|
60
|
+
placeholder: N = "Select",
|
|
61
|
+
className: h,
|
|
62
|
+
allowCustomValue: d = !1,
|
|
63
|
+
customValue: f = "",
|
|
64
|
+
onCustomValueChange: m,
|
|
65
|
+
valueMode: B = "static",
|
|
66
|
+
valueDataType: xt,
|
|
67
|
+
onValueModeChange: P,
|
|
68
|
+
canSelectNode: b,
|
|
69
|
+
resolveSelectedLabel: A,
|
|
70
|
+
isInvalid: M = !1,
|
|
71
|
+
isClearable: yt = !1,
|
|
72
|
+
expandAllByDefault: C = !1,
|
|
73
|
+
openOnClear: F = !1,
|
|
74
|
+
onClear: I,
|
|
75
|
+
isDisabled: i = !1
|
|
76
|
+
}) => {
|
|
77
|
+
const [y, v] = H(!1), [O, Q] = H(""), [U, L] = H(null), [V, tt] = H(!1), _ = st(null), et = st(null), x = d && B === "field", W = d && B === "static" && xt === "date", gt = q(() => {
|
|
78
|
+
i || (v(B === "static"), P == null || P(B === "field" ? "static" : "field"));
|
|
79
|
+
}, [i, B, P, v]), X = T(() => {
|
|
80
|
+
if (!r) return null;
|
|
81
|
+
const t = A == null ? void 0 : A(r);
|
|
82
|
+
if (t) return t;
|
|
83
|
+
const n = o[r];
|
|
84
|
+
if (n) return n.label;
|
|
85
|
+
const s = r.split(".");
|
|
86
|
+
let g = null, E = 0;
|
|
87
|
+
for (let G = 1; G <= s.length; G += 1) {
|
|
88
|
+
const it = s.slice(0, G).join(".");
|
|
89
|
+
o[it] && (g = it, E = G);
|
|
90
|
+
}
|
|
91
|
+
if (!g) return r;
|
|
92
|
+
const R = o[g];
|
|
93
|
+
if (!R) return r;
|
|
94
|
+
if (E >= s.length) return R.label;
|
|
95
|
+
const Z = ht(R.fields, s.slice(E));
|
|
96
|
+
return Z ? [R.label, ...Z.ancestorLabels, Z.field.label].join(" > ") : r;
|
|
97
|
+
}, [r, o, A]), $ = T(() => Gt(o), [o]), K = T(() => Ht($, O), [$, O]), Nt = T(() => O.trim() ? lt(K) : C ? lt($) : It(r ?? ""), [O, K, C, $, r]), bt = q(
|
|
98
|
+
(t) => {
|
|
99
|
+
if (b && !b(t)) return;
|
|
100
|
+
const n = t.id, s = n.split(".");
|
|
101
|
+
if (s.length < 1) return;
|
|
102
|
+
const g = s[0], E = s.length > 1 ? s.slice(1).join(".") : "";
|
|
103
|
+
u(n, g, E), v(!1), Q("");
|
|
104
|
+
},
|
|
105
|
+
[b, u]
|
|
106
|
+
), k = q(
|
|
107
|
+
(t) => {
|
|
108
|
+
i || (t && W && L(Jt(f) ?? Dt(zt())), v(t), t || Q(""));
|
|
109
|
+
},
|
|
110
|
+
[i, W, f]
|
|
111
|
+
);
|
|
112
|
+
Bt(() => {
|
|
113
|
+
if (!y || !r || !_.current) return;
|
|
114
|
+
const t = _.current.querySelector(
|
|
115
|
+
`[data-tree-node-id="${CSS.escape(r)}"]`
|
|
116
|
+
);
|
|
117
|
+
if (!t) return;
|
|
118
|
+
const n = requestAnimationFrame(() => {
|
|
119
|
+
requestAnimationFrame(() => {
|
|
120
|
+
t.scrollIntoView({ block: "center", behavior: "auto" });
|
|
121
|
+
});
|
|
122
|
+
});
|
|
123
|
+
return () => cancelAnimationFrame(n);
|
|
124
|
+
}, [y, r]);
|
|
125
|
+
const p = T(() => !d || x ? X || "" : f || "", [d, x, f, X]), rt = !!p, wt = T(() => !d || x ? !!r : !!(f != null && f.trim()), [d, x, r, f]), w = yt && wt && !i, vt = q(
|
|
126
|
+
(t) => {
|
|
127
|
+
t.preventDefault(), t.stopPropagation(), I ? I() : d ? x ? u("", "", "") : m == null || m("") : u("", "", ""), F && k(!0);
|
|
128
|
+
},
|
|
129
|
+
[I, d, x, u, m, F, k]
|
|
130
|
+
), D = w ? /* @__PURE__ */ e(
|
|
131
|
+
Zt,
|
|
132
|
+
{
|
|
133
|
+
color: "tertiary",
|
|
134
|
+
size: "3xs",
|
|
135
|
+
icon: /* @__PURE__ */ e(Kt, { "aria-hidden": !0, className: j[a] }),
|
|
136
|
+
tabIndex: -1,
|
|
137
|
+
"aria-label": "Clear selection",
|
|
138
|
+
onClick: vt,
|
|
139
|
+
className: "focus-visible:outline-offset-0"
|
|
140
|
+
}
|
|
141
|
+
) : null, nt = "absolute right-7 top-1/2 z-10 -translate-y-1/2", z = q(
|
|
142
|
+
(t, n = rt) => ft(
|
|
143
|
+
t,
|
|
144
|
+
l("min-w-0 w-full", !t && "text-placeholder_subtle"),
|
|
145
|
+
!1,
|
|
146
|
+
"start",
|
|
147
|
+
void 0,
|
|
148
|
+
N,
|
|
149
|
+
l(n ? "text-primary font-medium" : "text-placeholder_subtle", S[a]),
|
|
150
|
+
"z-[100001]"
|
|
151
|
+
),
|
|
152
|
+
[rt, N, a]
|
|
153
|
+
), kt = q(
|
|
154
|
+
({ node: t }) => {
|
|
155
|
+
var s;
|
|
156
|
+
const n = b ? b(t) : !0;
|
|
157
|
+
return /* @__PURE__ */ c("span", { className: l("flex items-center gap-2 min-w-0", !n && "opacity-70"), children: [
|
|
158
|
+
(s = t.metadata) != null && s.icon ? /* @__PURE__ */ e(t.metadata.icon, { className: "size-4 shrink-0 text-fg-quaternary", "aria-hidden": !0 }) : /* @__PURE__ */ e(Mt, { type: t.type }),
|
|
159
|
+
/* @__PURE__ */ e("span", { className: l("min-w-0 flex-1", S[a]), children: ft(
|
|
160
|
+
t.label,
|
|
161
|
+
"min-w-0 w-full",
|
|
162
|
+
!1,
|
|
163
|
+
"start",
|
|
164
|
+
void 0,
|
|
165
|
+
void 0,
|
|
166
|
+
n ? "text-primary" : "text-tertiary",
|
|
167
|
+
"z-[100001]"
|
|
168
|
+
) }),
|
|
169
|
+
n && r === t.id && /* @__PURE__ */ e(Ot, { className: "size-4 shrink-0 text-brand-600", "aria-hidden": !0 })
|
|
170
|
+
] });
|
|
171
|
+
},
|
|
172
|
+
[b, r, a]
|
|
173
|
+
), qt = /* @__PURE__ */ c(
|
|
174
|
+
J,
|
|
175
|
+
{
|
|
176
|
+
isDisabled: i,
|
|
177
|
+
className: l(
|
|
178
|
+
"relative flex w-full min-w-0 cursor-pointer items-center gap-1 bg-primary ring ring-secondary outline-hidden transition duration-100 ease-linear ring-inset",
|
|
179
|
+
ut[a].button,
|
|
180
|
+
y && !i && "ring-1 ring-brand",
|
|
181
|
+
M && "!ring-2 !ring-error",
|
|
182
|
+
i && "cursor-not-allowed bg-disabled_subtle text-disabled"
|
|
183
|
+
),
|
|
184
|
+
children: [
|
|
185
|
+
/* @__PURE__ */ e("span", { className: "min-w-0 flex-1 text-left", children: z(p) }),
|
|
186
|
+
w ? /* @__PURE__ */ e("span", { className: "w-7 shrink-0", "aria-hidden": !0 }) : null,
|
|
187
|
+
/* @__PURE__ */ e(
|
|
188
|
+
ot,
|
|
189
|
+
{
|
|
190
|
+
"aria-hidden": !0,
|
|
191
|
+
className: l(
|
|
192
|
+
"shrink-0 text-fg-quaternary transition-transform",
|
|
193
|
+
j[a],
|
|
194
|
+
y && "rotate-180"
|
|
195
|
+
)
|
|
196
|
+
}
|
|
197
|
+
)
|
|
198
|
+
]
|
|
199
|
+
}
|
|
200
|
+
), Tt = /* @__PURE__ */ c(
|
|
201
|
+
"div",
|
|
202
|
+
{
|
|
203
|
+
className: "p-2 flex flex-col gap-2 flex-1 min-h-0 w-md",
|
|
204
|
+
onKeyDownCapture: (t) => {
|
|
205
|
+
var g;
|
|
206
|
+
if (t.nativeEvent.isComposing || !(t.target instanceof HTMLInputElement)) return;
|
|
207
|
+
if (t.key === "Escape") {
|
|
208
|
+
t.preventDefault(), t.stopPropagation(), k(!1);
|
|
209
|
+
return;
|
|
210
|
+
}
|
|
211
|
+
if (t.key !== "ArrowDown" && t.key !== "ArrowUp") return;
|
|
212
|
+
t.preventDefault(), t.stopPropagation();
|
|
213
|
+
const n = (g = _.current) == null ? void 0 : g.querySelectorAll('[role="treeitem"]'), s = t.key === "ArrowDown" ? n == null ? void 0 : n[0] : n == null ? void 0 : n[n.length - 1];
|
|
214
|
+
s == null || s.focus({ preventScroll: !0 }), s == null || s.scrollIntoView({ block: "nearest", behavior: "instant" });
|
|
215
|
+
},
|
|
216
|
+
children: [
|
|
217
|
+
/* @__PURE__ */ e(
|
|
218
|
+
Wt,
|
|
219
|
+
{
|
|
220
|
+
size: a,
|
|
221
|
+
placeholder: "Search objects or fields",
|
|
222
|
+
value: O,
|
|
223
|
+
onChange: (t) => Q(t),
|
|
224
|
+
className: "ring-0 outline-hidden bg-secondary rounded-lg w-full",
|
|
225
|
+
autoFocus: !0
|
|
226
|
+
}
|
|
227
|
+
),
|
|
228
|
+
/* @__PURE__ */ e("div", { ref: _, className: "overflow-y-auto flex-1 min-h-0 py-1", children: K.length > 0 ? /* @__PURE__ */ e(
|
|
229
|
+
Xt,
|
|
230
|
+
{
|
|
231
|
+
variant: "indented",
|
|
232
|
+
data: K,
|
|
233
|
+
config: Qt,
|
|
234
|
+
CustomNode: kt,
|
|
235
|
+
onNodeClick: bt,
|
|
236
|
+
defaultExpandedIds: Nt,
|
|
237
|
+
syncWithData: !0,
|
|
238
|
+
keyboardNavigation: !0,
|
|
239
|
+
selectedNodeId: r,
|
|
240
|
+
canSelectNode: b,
|
|
241
|
+
"aria-label": "Objects and fields"
|
|
242
|
+
}
|
|
243
|
+
) : /* @__PURE__ */ e("div", { className: l("px-3 py-4 text-tertiary text-center", S[a]), children: "No results found" }) })
|
|
244
|
+
]
|
|
245
|
+
}
|
|
246
|
+
), at = /* @__PURE__ */ e(
|
|
247
|
+
ct,
|
|
248
|
+
{
|
|
249
|
+
placement: "bottom start",
|
|
250
|
+
offset: 4,
|
|
251
|
+
className: ({ isEntering: t, isExiting: n }) => l(
|
|
252
|
+
"max-w-[90vw] max-h-[min(380px,60vh)] overflow-hidden flex flex-col rounded-xl bg-primary shadow-lg ring-1 ring-secondary outline-hidden will-change-transform",
|
|
253
|
+
t && "duration-150 ease-out animate-in fade-in slide-in-from-top-1",
|
|
254
|
+
n && "duration-100 ease-in animate-out fade-out slide-out-to-top-1"
|
|
255
|
+
),
|
|
256
|
+
children: Tt
|
|
257
|
+
}
|
|
258
|
+
), St = /* @__PURE__ */ c(
|
|
259
|
+
ct,
|
|
260
|
+
{
|
|
261
|
+
placement: "bottom start",
|
|
262
|
+
offset: 4,
|
|
263
|
+
className: ({ isEntering: t, isExiting: n }) => l(
|
|
264
|
+
"rounded-xl bg-primary shadow-lg ring-1 ring-secondary outline-hidden will-change-transform max-h-[min(80vh,420px)] overflow-auto ",
|
|
265
|
+
t && "duration-150 ease-out animate-in fade-in slide-in-from-top-1",
|
|
266
|
+
n && "duration-100 ease-in animate-out fade-out slide-out-to-top-1"
|
|
267
|
+
),
|
|
268
|
+
children: [
|
|
269
|
+
/* @__PURE__ */ e("div", { className: "p-2", children: /* @__PURE__ */ e(
|
|
270
|
+
Ut,
|
|
271
|
+
{
|
|
272
|
+
value: U,
|
|
273
|
+
onlyNotifyOnGridSelect: !0,
|
|
274
|
+
onChange: (t) => {
|
|
275
|
+
t && L(t);
|
|
276
|
+
},
|
|
277
|
+
onSelect: (t) => {
|
|
278
|
+
L(t);
|
|
279
|
+
},
|
|
280
|
+
children: /* @__PURE__ */ e(Lt, { size: a, highlightedDates: [] })
|
|
281
|
+
}
|
|
282
|
+
) }),
|
|
283
|
+
/* @__PURE__ */ c("div", { className: "grid grid-cols-2 gap-3 border-t border-secondary px-4 py-3", children: [
|
|
284
|
+
/* @__PURE__ */ e(dt, { size: a, color: "secondary", onClick: () => v(!1), children: "Cancel" }),
|
|
285
|
+
/* @__PURE__ */ e(
|
|
286
|
+
dt,
|
|
287
|
+
{
|
|
288
|
+
size: a,
|
|
289
|
+
color: "primary",
|
|
290
|
+
onClick: () => {
|
|
291
|
+
U && (m == null || m(Yt(U))), v(!1);
|
|
292
|
+
},
|
|
293
|
+
children: "Apply"
|
|
294
|
+
}
|
|
295
|
+
)
|
|
296
|
+
] })
|
|
297
|
+
]
|
|
298
|
+
}
|
|
299
|
+
);
|
|
300
|
+
return /* @__PURE__ */ e("div", { className: l("relative", h), children: d ? /* @__PURE__ */ c(
|
|
301
|
+
"div",
|
|
302
|
+
{
|
|
303
|
+
className: l(
|
|
304
|
+
"relative flex w-full items-center bg-primary ring-1 ring-secondary transition duration-100 ease-linear ring-inset",
|
|
305
|
+
ut[a].button,
|
|
306
|
+
"p-0!",
|
|
307
|
+
M && "!ring-2 !ring-error",
|
|
308
|
+
i && "cursor-not-allowed bg-disabled_subtle text-disabled"
|
|
309
|
+
),
|
|
310
|
+
children: [
|
|
311
|
+
x ? /* @__PURE__ */ c("div", { className: "relative flex min-w-0 flex-1 items-stretch", children: [
|
|
312
|
+
/* @__PURE__ */ c(Y, { isOpen: i ? !1 : y, onOpenChange: k, children: [
|
|
313
|
+
/* @__PURE__ */ c(
|
|
314
|
+
J,
|
|
315
|
+
{
|
|
316
|
+
isDisabled: i,
|
|
317
|
+
className: l(
|
|
318
|
+
"flex flex-1 min-w-0 items-center gap-1 rounded-l-lg p-2 text-left outline-none cursor-pointer",
|
|
319
|
+
S[a],
|
|
320
|
+
i && "cursor-not-allowed"
|
|
321
|
+
),
|
|
322
|
+
children: [
|
|
323
|
+
/* @__PURE__ */ e("span", { className: "min-w-0 flex-1 text-left", children: z(p) }),
|
|
324
|
+
w ? /* @__PURE__ */ e("span", { className: "w-7 shrink-0", "aria-hidden": !0 }) : null,
|
|
325
|
+
/* @__PURE__ */ e(
|
|
326
|
+
ot,
|
|
327
|
+
{
|
|
328
|
+
"aria-hidden": !0,
|
|
329
|
+
className: l(
|
|
330
|
+
"shrink-0 text-fg-quaternary transition-transform",
|
|
331
|
+
j[a],
|
|
332
|
+
y && "rotate-180"
|
|
333
|
+
)
|
|
334
|
+
}
|
|
335
|
+
)
|
|
336
|
+
]
|
|
337
|
+
}
|
|
338
|
+
),
|
|
339
|
+
at
|
|
340
|
+
] }),
|
|
341
|
+
w ? /* @__PURE__ */ e("div", { className: nt, children: D }) : null
|
|
342
|
+
] }) : W ? /* @__PURE__ */ c("div", { className: "relative flex flex-1 items-center min-w-0", children: [
|
|
343
|
+
/* @__PURE__ */ c(Y, { isOpen: i ? !1 : y, onOpenChange: k, children: [
|
|
344
|
+
/* @__PURE__ */ c(
|
|
345
|
+
J,
|
|
346
|
+
{
|
|
347
|
+
isDisabled: i,
|
|
348
|
+
className: l(
|
|
349
|
+
"flex flex-1 min-w-0 items-center gap-2 rounded-l-lg p-2 text-left outline-none cursor-pointer",
|
|
350
|
+
p && "pr-8",
|
|
351
|
+
S[a],
|
|
352
|
+
i && "cursor-not-allowed"
|
|
353
|
+
),
|
|
354
|
+
children: [
|
|
355
|
+
/* @__PURE__ */ e(
|
|
356
|
+
mt,
|
|
357
|
+
{
|
|
358
|
+
"aria-hidden": !0,
|
|
359
|
+
className: l(j[a], "text-fg-quaternary shrink-0")
|
|
360
|
+
}
|
|
361
|
+
),
|
|
362
|
+
/* @__PURE__ */ e("span", { className: "min-w-0 flex-1 text-left", children: z(p) })
|
|
363
|
+
]
|
|
364
|
+
}
|
|
365
|
+
),
|
|
366
|
+
St
|
|
367
|
+
] }),
|
|
368
|
+
w ? /* @__PURE__ */ e("div", { className: "absolute right-2 top-1/2 z-10 -translate-y-1/2", children: D }) : null
|
|
369
|
+
] }) : /* @__PURE__ */ c("div", { className: "relative flex min-w-0 flex-1 items-center", children: [
|
|
370
|
+
/* @__PURE__ */ e(
|
|
371
|
+
"input",
|
|
372
|
+
{
|
|
373
|
+
ref: et,
|
|
374
|
+
type: "text",
|
|
375
|
+
value: p,
|
|
376
|
+
disabled: i,
|
|
377
|
+
onChange: (t) => m == null ? void 0 : m(t.target.value),
|
|
378
|
+
onFocus: () => tt(!0),
|
|
379
|
+
onBlur: () => tt(!1),
|
|
380
|
+
placeholder: N,
|
|
381
|
+
className: l(
|
|
382
|
+
"min-w-0 flex-1 rounded-l-lg bg-transparent p-2 text-primary outline-none placeholder:text-placeholder_subtle",
|
|
383
|
+
p && !V && "text-transparent caret-primary",
|
|
384
|
+
p && "pr-8",
|
|
385
|
+
S[a],
|
|
386
|
+
i && "cursor-not-allowed text-disabled"
|
|
387
|
+
)
|
|
388
|
+
}
|
|
389
|
+
),
|
|
390
|
+
p && !V && /* @__PURE__ */ e(
|
|
391
|
+
"div",
|
|
392
|
+
{
|
|
393
|
+
className: "absolute inset-y-0 left-0 right-8 flex min-w-0 cursor-text items-center px-2",
|
|
394
|
+
onMouseDown: (t) => {
|
|
395
|
+
var n;
|
|
396
|
+
t.preventDefault(), (n = et.current) == null || n.focus();
|
|
397
|
+
},
|
|
398
|
+
children: /* @__PURE__ */ e("div", { className: "min-w-0 w-full", children: z(p) })
|
|
399
|
+
}
|
|
400
|
+
),
|
|
401
|
+
w ? /* @__PURE__ */ e("div", { className: "absolute right-2 top-1/2 z-10 -translate-y-1/2", children: D }) : null
|
|
402
|
+
] }),
|
|
403
|
+
/* @__PURE__ */ e(
|
|
404
|
+
"button",
|
|
405
|
+
{
|
|
406
|
+
type: "button",
|
|
407
|
+
disabled: i,
|
|
408
|
+
onClick: gt,
|
|
409
|
+
"aria-label": x ? "Switch to free text mode" : "Switch to tree select mode",
|
|
410
|
+
className: l(
|
|
411
|
+
"p-2 shrink-0 rounded-r-md flex items-center justify-center transition-colors enabled:cursor-pointer",
|
|
412
|
+
x ? "ring-2 ring-brand ring-inset text-brand-600" : "border-l border-secondary text-fg-quaternary enabled:hover:text-fg-quaternary_hover",
|
|
413
|
+
i && "cursor-not-allowed text-disabled"
|
|
414
|
+
),
|
|
415
|
+
children: /* @__PURE__ */ e(pt, { "aria-hidden": !0, className: j[a] })
|
|
416
|
+
}
|
|
417
|
+
)
|
|
418
|
+
]
|
|
419
|
+
}
|
|
420
|
+
) : /* @__PURE__ */ c("div", { className: "relative flex w-full min-w-0 items-stretch", children: [
|
|
421
|
+
/* @__PURE__ */ c(Y, { isOpen: i ? !1 : y, onOpenChange: k, children: [
|
|
422
|
+
qt,
|
|
423
|
+
at
|
|
424
|
+
] }),
|
|
425
|
+
w ? /* @__PURE__ */ e("div", { className: nt, children: D }) : null
|
|
426
|
+
] }) });
|
|
427
|
+
};
|
|
428
|
+
export {
|
|
429
|
+
de as NestedFieldSelect,
|
|
430
|
+
de as default
|
|
431
|
+
};
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { ComponentType, SVGProps } from 'react';
|
|
2
|
+
export type FilterLogicalOperator = "and" | "or";
|
|
3
|
+
export interface FilterField {
|
|
4
|
+
id: string;
|
|
5
|
+
label: string;
|
|
6
|
+
type: "string" | "number" | "date" | "select" | "boolean" | "float" | "list" | "dict" | "object" | "integer";
|
|
7
|
+
/** Available options for select type fields */
|
|
8
|
+
options?: FilterFieldOption[];
|
|
9
|
+
/** Backend data_type (e.g. "LOOKUP", "TIMESTAMP") — preserves info lost by mapping to the generic `type` */
|
|
10
|
+
dataType?: string;
|
|
11
|
+
/** True while the field's options are being fetched (LOOKUP fields). Lets renderers show a stable loading state instead of falling back to a text input. */
|
|
12
|
+
isLoading?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export interface FilterFieldOption {
|
|
15
|
+
id: string;
|
|
16
|
+
label: string;
|
|
17
|
+
value: string;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Document field structure for nested field selection
|
|
21
|
+
* A field can either be:
|
|
22
|
+
* 1. A regular selectable field (has `type` property)
|
|
23
|
+
* 2. A sub-object container (has `children` property with nested fields)
|
|
24
|
+
*/
|
|
25
|
+
export interface DocumentFieldDefinition {
|
|
26
|
+
key: string;
|
|
27
|
+
label: string;
|
|
28
|
+
/** Field type - only for selectable fields (not sub-objects). Structural: the app's FieldType union fits. */
|
|
29
|
+
type?: string;
|
|
30
|
+
/** Options for select type fields */
|
|
31
|
+
options?: FilterFieldOption[];
|
|
32
|
+
/** Child fields - if present, this field is a sub-object container */
|
|
33
|
+
children?: DocumentFieldDefinition[];
|
|
34
|
+
/** Rules-meta `structure_type` for document fields; absent on object fields and table columns. */
|
|
35
|
+
structureType?: string;
|
|
36
|
+
}
|
|
37
|
+
export interface DocumentDefinition {
|
|
38
|
+
label: string;
|
|
39
|
+
fields: DocumentFieldDefinition[];
|
|
40
|
+
/** Icon for the document root in field pickers. Defaults to Table. */
|
|
41
|
+
icon?: ComponentType<SVGProps<SVGSVGElement>>;
|
|
42
|
+
/** Rules-meta `structure_type`; "doc" for documents, absent for objects. */
|
|
43
|
+
structureType?: "doc";
|
|
44
|
+
}
|
|
45
|
+
export interface DocumentFieldsConfig {
|
|
46
|
+
[documentKey: string]: DocumentDefinition;
|
|
47
|
+
}
|
|
48
|
+
export interface FilterOperator {
|
|
49
|
+
id: string;
|
|
50
|
+
label: string;
|
|
51
|
+
/** Field types this operator applies to */
|
|
52
|
+
applicableTo: FilterField["type"][];
|
|
53
|
+
/** Whether this operator requires a value */
|
|
54
|
+
requiresValue?: boolean;
|
|
55
|
+
/** Whether this operator requires two values (e.g., "between") */
|
|
56
|
+
requiresTwoValues?: boolean;
|
|
57
|
+
/** Whether this operator requires multiple values (e.g., "in", "not in") - renders a tag/multiselect input */
|
|
58
|
+
requiresMultipleValues?: boolean;
|
|
59
|
+
}
|
|
60
|
+
export interface FilterCondition {
|
|
61
|
+
id: string;
|
|
62
|
+
type: "condition";
|
|
63
|
+
fieldId: string;
|
|
64
|
+
operatorId: string;
|
|
65
|
+
value: string;
|
|
66
|
+
value2?: string;
|
|
67
|
+
/** How this row combines with the others. Object Manager record filters keep one value for every row. */
|
|
68
|
+
logicalOperator?: FilterLogicalOperator;
|
|
69
|
+
}
|
|
70
|
+
export interface FilterGroup {
|
|
71
|
+
id: string;
|
|
72
|
+
type: "group";
|
|
73
|
+
operator: FilterLogicalOperator;
|
|
74
|
+
children: FilterNode[];
|
|
75
|
+
}
|
|
76
|
+
export type FilterNode = FilterCondition | FilterGroup;
|
|
77
|
+
export interface FilterGroupBuilderProps {
|
|
78
|
+
/** Available fields for filtering */
|
|
79
|
+
fields: FilterField[];
|
|
80
|
+
/** Available operators */
|
|
81
|
+
operators?: FilterOperator[];
|
|
82
|
+
/** Current filter state */
|
|
83
|
+
value: FilterGroup;
|
|
84
|
+
/** Callback when filters change */
|
|
85
|
+
onChange: (value: FilterGroup) => void;
|
|
86
|
+
/** Maximum nesting depth allowed */
|
|
87
|
+
maxDepth?: number;
|
|
88
|
+
/** Component size */
|
|
89
|
+
size?: "sm" | "md" | "lg";
|
|
90
|
+
/** Custom class name */
|
|
91
|
+
className?: string;
|
|
92
|
+
/** Whether to show the root operator selector */
|
|
93
|
+
showRootOperator?: boolean;
|
|
94
|
+
/** Document fields for nested field selection (optional, uses standard fields if not provided) */
|
|
95
|
+
documentFields?: DocumentFieldsConfig;
|
|
96
|
+
/** Whether to use fixed positioning for the dropdown */
|
|
97
|
+
useFixedPositioning?: boolean;
|
|
98
|
+
/** Set of condition IDs that are invalid (for error highlighting) */
|
|
99
|
+
invalidConditionIds?: Set<string>;
|
|
100
|
+
}
|
|
101
|
+
export declare const DEFAULT_OPERATORS: FilterOperator[];
|
|
102
|
+
export declare const generateId: () => string;
|
|
103
|
+
export declare const createEmptyCondition: (fields: FilterField[], operators?: FilterOperator[]) => FilterCondition;
|
|
104
|
+
export declare const createEmptyGroup: (operator?: FilterLogicalOperator) => FilterGroup;
|
|
105
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/filter-group/types.ts"],"names":[],"mappings":"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"}
|