trackhome-react 0.3.0 → 0.5.0

package/dist/widgets/categorical.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Field, RankedBars, MetricField, EventTypeField, TagPrefixField } from './common.js';
+/** All categorical kinds resolve to a ranked [{type|tag, count}] list. */
+function CategoricalRender({ data, theme }) {
+    const d = data ?? [];
+    const rows = d.map((x) => ({ label: x.type ?? x.tag ?? '—', count: x.count }));
+    return _jsx(RankedBars, { rows: rows, theme: theme });
+}
+function BreakdownEditForm({ draft, update, ctx }) {
+    return (_jsxs(_Fragment, { children: [_jsx(Field, { label: "Breakdown", ctx: ctx, children: _jsxs("select", { style: ctx.inputStyle, value: draft.breakdown ?? 'event_type', onChange: (e) => update({ breakdown: e.target.value }), children: [_jsx("option", { value: "event_type", children: "Event type" }), _jsx("option", { value: "tag", children: "Tag value" })] }) }), draft.breakdown === 'tag' && _jsx(TagPrefixField, { draft: draft, update: update, ctx: ctx }), _jsx(MetricField, { draft: draft, update: update, ctx: ctx }), _jsx(EventTypeField, { draft: draft, update: update, ctx: ctx })] }));
+}
+const breakdownConfig = () => ({ breakdown: 'event_type', metric: 'count' });
+export const barWidget = {
+    meta: { value: 'bar', label: 'Bar', hint: 'Vertical categorical bars' },
+    defaultConfig: breakdownConfig,
+    Render: CategoricalRender,
+    EditForm: BreakdownEditForm,
+};
+export const pieWidget = {
+    meta: { value: 'pie', label: 'Pie', hint: 'Donut share-of-total' },
+    defaultConfig: breakdownConfig,
+    Render: CategoricalRender,
+    EditForm: BreakdownEditForm,
+};
+export const topEventsWidget = {
+    meta: { value: 'top_events', label: 'Top events', hint: 'Ranked event-type list' },
+    defaultConfig: () => ({ metric: 'count' }),
+    Render: CategoricalRender,
+    EditForm: ({ draft, update, ctx }) => (_jsxs(_Fragment, { children: [_jsx(MetricField, { draft: draft, update: update, ctx: ctx }), _jsx(EventTypeField, { draft: draft, update: update, ctx: ctx })] })),
+};
+export const topTagsWidget = {
+    meta: { value: 'top_tags', label: 'Top tags', hint: 'Ranked tag-value list (needs prefix)' },
+    defaultConfig: () => ({ metric: 'count' }),
+    Render: CategoricalRender,
+    EditForm: ({ draft, update, ctx }) => (_jsxs(_Fragment, { children: [_jsx(TagPrefixField, { draft: draft, update: update, ctx: ctx }), _jsx(MetricField, { draft: draft, update: update, ctx: ctx })] })),
+};
+//# sourceMappingURL=categorical.js.map

package/dist/widgets/categorical.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"categorical.js","sourceRoot":"","sources":["../../src/widgets/categorical.tsx"],"names":[],"mappings":"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"}

package/dist/widgets/common.d.ts

@@ -0,0 +1,42 @@
+/** Render + form building blocks shared across widget kinds. */
+import React from 'react';
+import type { Theme, EditCtx, Widget } from './types.js';
+export declare function NoData({ theme, label }: {
+    theme: Theme;
+    label?: string;
+}): React.JSX.Element;
+/** Horizontal ranked-bar list used by bar/pie/top_events/top_tags/funnel. */
+export declare function RankedBars({ rows, theme, barHeight, }: {
+    rows: {
+        label: string;
+        count: number;
+        suffix?: string;
+    }[];
+    theme: Theme;
+    barHeight?: number;
+}): React.JSX.Element;
+/** Labeled field wrapper for EditForms. */
+export declare function Field({ label, ctx, children }: {
+    label: string;
+    ctx: EditCtx;
+    children: React.ReactNode;
+}): React.JSX.Element;
+/** Metric <select> reused by every value-based widget. */
+export declare function MetricField({ draft, update, ctx, }: {
+    draft: Widget;
+    update: (patch: Partial<Widget>) => void;
+    ctx: EditCtx;
+}): React.JSX.Element;
+/** Optional event-type filter with autosuggest. */
+export declare function EventTypeField({ draft, update, ctx, }: {
+    draft: Widget;
+    update: (patch: Partial<Widget>) => void;
+    ctx: EditCtx;
+}): React.JSX.Element;
+/** Tag-prefix field with autosuggest. */
+export declare function TagPrefixField({ draft, update, ctx, }: {
+    draft: Widget;
+    update: (patch: Partial<Widget>) => void;
+    ctx: EditCtx;
+}): React.JSX.Element;
+//# sourceMappingURL=common.d.ts.map

package/dist/widgets/common.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../src/widgets/common.tsx"],"names":[],"mappings":"AAAA,gEAAgE;AAChE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAU,MAAM,YAAY,CAAC;AAIjE,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,KAAkB,EAAE,EAAE;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,qBAErF;AAED,6EAA6E;AAC7E,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,EACL,SAAa,GACd,EAAE;IACD,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC1D,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,qBAgCA;AAED,2CAA2C;AAC3C,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,qBAOzG;AAED,0DAA0D;AAC1D,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,MAAM,EACN,GAAG,GACJ,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACzC,GAAG,EAAE,OAAO,CAAC;CACd,qBAeA;AAED,mDAAmD;AACnD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,MAAM,EACN,GAAG,GACJ,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACzC,GAAG,EAAE,OAAO,CAAC;CACd,qBAgBA;AAED,yCAAyC;AACzC,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,MAAM,EACN,GAAG,GACJ,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACzC,GAAG,EAAE,OAAO,CAAC;CACd,qBAgBA"}

package/dist/widgets/common.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ACCENT, subTextColor, trackColor } from './types.js';
+import { AutosuggestInput } from './inputs.js';
+export function NoData({ theme, label = 'No data.' }) {
+    return _jsx("div", { style: { fontSize: 12, color: subTextColor(theme) }, children: label });
+}
+/** Horizontal ranked-bar list used by bar/pie/top_events/top_tags/funnel. */
+export function RankedBars({ rows, theme, barHeight = 8, }) {
+    const subtext = subTextColor(theme);
+    if (rows.length === 0)
+        return _jsx(NoData, { theme: theme });
+    const max = Math.max(...rows.map((r) => r.count), 1);
+    return (_jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 4 }, children: rows.map((r, i) => (_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 8 }, children: [_jsx("div", { style: {
+                        fontSize: 11,
+                        color: subtext,
+                        width: 120,
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        whiteSpace: 'nowrap',
+                        fontFamily: 'monospace',
+                    }, children: r.label }), _jsx("div", { style: { flex: 1, height: barHeight, background: trackColor(theme), borderRadius: 4, overflow: 'hidden' }, children: _jsx("div", { style: { width: `${(r.count / max) * 100}%`, height: '100%', background: ACCENT, borderRadius: 4 } }) }), _jsxs("div", { style: { fontSize: 11, color: subtext, minWidth: 50, textAlign: 'right' }, children: [r.count.toLocaleString(), r.suffix ?? ''] })] }, i))) }));
+}
+/** Labeled field wrapper for EditForms. */
+export function Field({ label, ctx, children }) {
+    return (_jsxs("label", { children: [_jsx("span", { style: ctx.labelStyle, children: label }), children] }));
+}
+/** Metric <select> reused by every value-based widget. */
+export function MetricField({ draft, update, ctx, }) {
+    return (_jsx(Field, { label: "Metric", ctx: ctx, children: _jsxs("select", { style: ctx.inputStyle, value: draft.metric ?? 'count', onChange: (e) => update({ metric: e.target.value }), children: [_jsx("option", { value: "count", children: "Count" }), _jsx("option", { value: "unique", children: "Unique visitors" }), _jsx("option", { value: "sum", children: "Sum" }), _jsx("option", { value: "avg", children: "Average" })] }) }));
+}
+/** Optional event-type filter with autosuggest. */
+export function EventTypeField({ draft, update, ctx, }) {
+    return (_jsx(Field, { label: "Event type filter (optional)", ctx: ctx, children: _jsx(AutosuggestInput, { endpoint: ctx.endpoint, authKey: ctx.authKey, uid: ctx.uid, suggestPath: "events", value: draft.eventType ?? '', onChange: (v) => update({ eventType: v || undefined }), placeholder: "e.g. page_view", theme: ctx.theme, inputStyle: ctx.inputStyle }) }));
+}
+/** Tag-prefix field with autosuggest. */
+export function TagPrefixField({ draft, update, ctx, }) {
+    return (_jsx(Field, { label: "Tag prefix", ctx: ctx, children: _jsx(AutosuggestInput, { endpoint: ctx.endpoint, authKey: ctx.authKey, uid: ctx.uid, suggestPath: "prefixes", value: draft.tagPrefix ?? '', onChange: (v) => update({ tagPrefix: v || undefined }), placeholder: "e.g. variant:", theme: ctx.theme, inputStyle: ctx.inputStyle }) }));
+}
+//# sourceMappingURL=common.js.map

package/dist/widgets/common.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.js","sourceRoot":"","sources":["../../src/widgets/common.tsx"],"names":[],"mappings":"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"}

package/dist/widgets/funnel.d.ts

@@ -0,0 +1,3 @@
+import type { WidgetUI } from './types.js';
+export declare const funnelWidget: WidgetUI;
+//# sourceMappingURL=funnel.d.ts.map

package/dist/widgets/funnel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"funnel.d.ts","sourceRoot":"","sources":["../../src/widgets/funnel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAA0C,MAAM,YAAY,CAAC;AA4MnF,eAAO,MAAM,YAAY,EAAE,QAK1B,CAAC"}

package/dist/widgets/funnel.js

@@ -0,0 +1,83 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ACCENT, subTextColor, trackColor } from './types.js';
+import { Field, NoData } from './common.js';
+import { AutosuggestInput, TagsAutosuggestInput } from './inputs.js';
+/** Compact waterfall: per-step visitors bar + overall conversion %. */
+function FunnelRender({ widget, data, theme }) {
+    const d = data ?? {};
+    const steps = d.steps ?? [];
+    if (steps.length === 0) {
+        const hint = (widget.steps?.length ?? 0) < 2 ? 'Add at least 2 steps to this funnel.' : 'No funnel data.';
+        return _jsx(NoData, { theme: theme, label: hint });
+    }
+    const subtext = subTextColor(theme);
+    const max = Math.max(...steps.map((s) => s.visitors), 1);
+    return (_jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 4 }, children: steps.map((s, i) => (_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 8 }, children: [_jsxs("div", { style: {
+                        fontSize: 11,
+                        color: subtext,
+                        width: 120,
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        whiteSpace: 'nowrap',
+                        fontFamily: 'monospace',
+                    }, children: [i + 1, ". ", s.type] }), _jsx("div", { style: { flex: 1, height: 10, background: trackColor(theme), borderRadius: 4, overflow: 'hidden' }, children: _jsx("div", { style: { width: `${(s.visitors / max) * 100}%`, height: '100%', background: ACCENT, borderRadius: 4 } }) }), _jsxs("div", { style: { fontSize: 11, color: subtext, minWidth: 78, textAlign: 'right', fontVariantNumeric: 'tabular-nums' }, children: [s.visitors.toLocaleString(), " \u00B7 ", Math.round(s.conversionOverall * 100), "%"] })] }, i))) }));
+}
+function FunnelEditForm({ draft, update, ctx }) {
+    const steps = draft.steps ?? [];
+    const setSteps = (next) => update({ steps: next });
+    const updateStep = (i, patch) => setSteps(steps.map((s, idx) => (idx === i ? { ...s, ...patch } : s)));
+    const stepBoxStyle = {
+        border: `1px solid ${ctx.theme === 'dark' ? '#334155' : '#cbd5e1'}`,
+        borderRadius: 8,
+        padding: 8,
+        display: 'flex',
+        flexDirection: 'column',
+        gap: 6,
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(Field, { label: "Window (minutes between steps)", ctx: ctx, children: _jsx("input", { type: "number", min: 1, style: ctx.inputStyle, value: draft.windowMinutes ?? 30, onChange: (e) => update({ windowMinutes: Number(e.target.value) || 30 }) }) }), _jsxs("div", { children: [_jsx("div", { style: { ...ctx.labelStyle, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: _jsxs("span", { children: ["Steps (", steps.length, ")"] }) }), _jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: steps.map((step, i) => (_jsxs("div", { style: stepBoxStyle, children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }, children: [_jsxs("span", { style: { fontSize: 11, fontWeight: 600, color: ctx.subLabelColor }, children: ["Step ", i + 1] }), _jsxs("div", { style: { display: 'flex', gap: 2 }, children: [_jsx("button", { type: "button", title: "Move up", disabled: i === 0, onClick: () => {
+                                                        if (i === 0)
+                                                            return;
+                                                        const next = steps.slice();
+                                                        [next[i - 1], next[i]] = [next[i], next[i - 1]];
+                                                        setSteps(next);
+                                                    }, style: miniBtn(ctx.theme, i === 0), children: "\u2191" }), _jsx("button", { type: "button", title: "Move down", disabled: i === steps.length - 1, onClick: () => {
+                                                        if (i === steps.length - 1)
+                                                            return;
+                                                        const next = steps.slice();
+                                                        [next[i + 1], next[i]] = [next[i], next[i + 1]];
+                                                        setSteps(next);
+                                                    }, style: miniBtn(ctx.theme, i === steps.length - 1), children: "\u2193" }), _jsx("button", { type: "button", title: "Remove step", onClick: () => setSteps(steps.filter((_, idx) => idx !== i)), style: { ...miniBtn(ctx.theme, false), background: '#ef4444', color: '#fff' }, children: "\u00D7" })] })] }), _jsx(AutosuggestInput, { endpoint: ctx.endpoint, authKey: ctx.authKey, uid: ctx.uid, suggestPath: "events", value: step.type, onChange: (v) => updateStep(i, { type: v }), placeholder: "event type, e.g. signup", theme: ctx.theme, inputStyle: ctx.inputStyle }), _jsx(TagsAutosuggestInput, { endpoint: ctx.endpoint, authKey: ctx.authKey, uid: ctx.uid, tags: step.tags ?? [], onChange: (t) => updateStep(i, { tags: t }), placeholder: "step tag filters (optional)", theme: ctx.theme, inputStyle: ctx.inputStyle, inputId: `funnel-step-${i}-tags` })] }, i))) }), _jsx("button", { type: "button", onClick: () => setSteps([...steps, { type: '', tags: [] }]), style: {
+                            marginTop: 8,
+                            width: '100%',
+                            padding: '6px 10px',
+                            fontSize: 12,
+                            fontWeight: 600,
+                            borderRadius: 6,
+                            border: `1px dashed ${ACCENT}`,
+                            background: 'transparent',
+                            color: ACCENT,
+                            cursor: 'pointer',
+                        }, children: "+ Add step" })] }), _jsx(Field, { label: "Funnel tag filter (optional, applies to all steps)", ctx: ctx, children: _jsx(TagsAutosuggestInput, { endpoint: ctx.endpoint, authKey: ctx.authKey, uid: ctx.uid, tags: draft.filterTags ?? [], onChange: (t) => update({ filterTags: t }), placeholder: "type to search, Enter to add", theme: ctx.theme, inputStyle: ctx.inputStyle, inputId: "funnel-filter-tags" }) })] }));
+}
+function miniBtn(theme, disabled) {
+    return {
+        background: theme === 'dark' ? '#475569' : '#e2e8f0',
+        color: theme === 'dark' ? '#f1f5f9' : '#1e293b',
+        border: 'none',
+        borderRadius: 4,
+        width: 22,
+        height: 22,
+        fontSize: 13,
+        cursor: disabled ? 'not-allowed' : 'pointer',
+        opacity: disabled ? 0.3 : 1,
+        padding: 0,
+        lineHeight: 1,
+    };
+}
+export const funnelWidget = {
+    meta: { value: 'funnel', label: 'Funnel', hint: 'Funnel waterfall (inline steps)' },
+    defaultConfig: () => ({ steps: [], windowMinutes: 30, filterTags: [] }),
+    Render: FunnelRender,
+    EditForm: FunnelEditForm,
+};
+//# sourceMappingURL=funnel.js.map

package/dist/widgets/funnel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"funnel.js","sourceRoot":"","sources":["../../src/widgets/funnel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AASrE,uEAAuE;AACvE,SAAS,YAAY,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAe;IACxD,MAAM,CAAC,GAAI,IAAsE,IAAI,EAAE,CAAC;IACxF,MAAM,KAAK,GAAG,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;IAC5B,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACvB,MAAM,IAAI,GAAG,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,sCAAsC,CAAC,CAAC,CAAC,iBAAiB,CAAC;QAC1G,OAAO,KAAC,MAAM,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,GAAI,CAAC;IAC/C,CAAC;IACD,MAAM,OAAO,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACpC,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC;IACzD,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,YAC7D,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACnB,eAAa,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACnE,eACE,KAAK,EAAE;wBACL,QAAQ,EAAE,EAAE;wBACZ,KAAK,EAAE,OAAO;wBACd,KAAK,EAAE,GAAG;wBACV,QAAQ,EAAE,QAAQ;wBAClB,YAAY,EAAE,UAAU;wBACxB,UAAU,EAAE,QAAQ;wBACpB,UAAU,EAAE,WAAW;qBACxB,aAEA,CAAC,GAAG,CAAC,QAAI,CAAC,CAAC,IAAI,IACZ,EACN,cAAK,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,CAAC,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,YACrG,cAAK,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,EAAE,GAAI,GAC1G,EACN,eAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,aAC/G,CAAC,CAAC,QAAQ,CAAC,cAAc,EAAE,cAAK,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,GAAG,GAAG,CAAC,SAClE,KAnBE,CAAC,CAoBL,CACP,CAAC,GACE,CACP,CAAC;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAiB;IAC3D,MAAM,KAAK,GAAiB,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;IAC9C,MAAM,QAAQ,GAAG,CAAC,IAAkB,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;IACjE,MAAM,UAAU,GAAG,CAAC,CAAS,EAAE,KAA0B,EAAE,EAAE,CAC3D,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAExE,MAAM,YAAY,GAAwB;QACxC,MAAM,EAAE,aAAa,GAAG,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;QACnE,YAAY,EAAE,CAAC;QACf,OAAO,EAAE,CAAC;QACV,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,GAAG,EAAE,CAAC;KACP,CAAC;IAEF,OAAO,CACL,8BACE,KAAC,KAAK,IAAC,KAAK,EAAC,gCAAgC,EAAC,GAAG,EAAE,GAAG,YACpD,gBACE,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,CAAC,EACN,KAAK,EAAE,GAAG,CAAC,UAAU,EACrB,KAAK,EAAE,KAAK,CAAC,aAAa,IAAI,EAAE,EAChC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,EAAE,CAAC,GACxE,GACI,EAER,0BACE,cAAK,KAAK,EAAE,EAAE,GAAG,GAAG,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,eAAe,EAAE,UAAU,EAAE,QAAQ,EAAE,YACvG,sCAAc,KAAK,CAAC,MAAM,SAAS,GAC/B,EACN,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,YAC7D,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,eAAa,KAAK,EAAE,YAAY,aAC9B,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,eAAe,EAAE,GAAG,EAAE,CAAC,EAAE,aAC5F,gBAAM,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,CAAC,aAAa,EAAE,sBAAQ,CAAC,GAAG,CAAC,IAAQ,EAC7F,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,EAAE,aACrC,iBACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,CAAC,KAAK,CAAC,EACjB,OAAO,EAAE,GAAG,EAAE;wDACZ,IAAI,CAAC,KAAK,CAAC;4DAAE,OAAO;wDACpB,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;wDAC3B,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;wDAChD,QAAQ,CAAC,IAAI,CAAC,CAAC;oDACjB,CAAC,EACD,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC,uBAG3B,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,WAAW,EACjB,QAAQ,EAAE,CAAC,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAChC,OAAO,EAAE,GAAG,EAAE;wDACZ,IAAI,CAAC,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC;4DAAE,OAAO;wDACnC,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;wDAC3B,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;wDAChD,QAAQ,CAAC,IAAI,CAAC,CAAC;oDACjB,CAAC,EACD,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,uBAG1C,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,aAAa,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,EAC5D,KAAK,EAAE,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,uBAGtE,IACL,IACF,EACN,KAAC,gBAAgB,IACf,QAAQ,EAAE,GAAG,CAAC,QAAQ,EACtB,OAAO,EAAE,GAAG,CAAC,OAAO,EACpB,GAAG,EAAE,GAAG,CAAC,GAAG,EACZ,WAAW,EAAC,QAAQ,EACpB,KAAK,EAAE,IAAI,CAAC,IAAI,EAChB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAC3C,WAAW,EAAC,yBAAyB,EACrC,KAAK,EAAE,GAAG,CAAC,KAAK,EAChB,UAAU,EAAE,GAAG,CAAC,UAAU,GAC1B,EACF,KAAC,oBAAoB,IACnB,QAAQ,EAAE,GAAG,CAAC,QAAQ,EACtB,OAAO,EAAE,GAAG,CAAC,OAAO,EACpB,GAAG,EAAE,GAAG,CAAC,GAAG,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,EAAE,EACrB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAC3C,WAAW,EAAC,6BAA6B,EACzC,KAAK,EAAE,GAAG,CAAC,KAAK,EAChB,UAAU,EAAE,GAAG,CAAC,UAAU,EAC1B,OAAO,EAAE,eAAe,CAAC,OAAO,GAChC,KA/DM,CAAC,CAgEL,CACP,CAAC,GACE,EACN,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,GAAG,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,EAC3D,KAAK,EAAE;4BACL,SAAS,EAAE,CAAC;4BACZ,KAAK,EAAE,MAAM;4BACb,OAAO,EAAE,UAAU;4BACnB,QAAQ,EAAE,EAAE;4BACZ,UAAU,EAAE,GAAG;4BACf,YAAY,EAAE,CAAC;4BACf,MAAM,EAAE,cAAc,MAAM,EAAE;4BAC9B,UAAU,EAAE,aAAa;4BACzB,KAAK,EAAE,MAAM;4BACb,MAAM,EAAE,SAAS;yBAClB,2BAGM,IACL,EAEN,KAAC,KAAK,IAAC,KAAK,EAAC,oDAAoD,EAAC,GAAG,EAAE,GAAG,YACxE,KAAC,oBAAoB,IACnB,QAAQ,EAAE,GAAG,CAAC,QAAQ,EACtB,OAAO,EAAE,GAAG,CAAC,OAAO,EACpB,GAAG,EAAE,GAAG,CAAC,GAAG,EACZ,IAAI,EAAE,KAAK,CAAC,UAAU,IAAI,EAAE,EAC5B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,EAC1C,WAAW,EAAC,8BAA8B,EAC1C,KAAK,EAAE,GAAG,CAAC,KAAK,EAChB,UAAU,EAAE,GAAG,CAAC,UAAU,EAC1B,OAAO,EAAC,oBAAoB,GAC5B,GACI,IACP,CACJ,CAAC;AACJ,CAAC;AAED,SAAS,OAAO,CAAC,KAAuB,EAAE,QAAiB;IACzD,OAAO;QACL,UAAU,EAAE,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;QACpD,KAAK,EAAE,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;QAC/C,MAAM,EAAE,MAAM;QACd,YAAY,EAAE,CAAC;QACf,KAAK,EAAE,EAAE;QACT,MAAM,EAAE,EAAE;QACV,QAAQ,EAAE,EAAE;QACZ,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;QAC5C,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QAC3B,OAAO,EAAE,CAAC;QACV,UAAU,EAAE,CAAC;KACd,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,YAAY,GAAa;IACpC,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,iCAAiC,EAAE;IACnF,aAAa,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC;IACvE,MAAM,EAAE,YAAY;IACpB,QAAQ,EAAE,cAAc;CACzB,CAAC"}

package/dist/widgets/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types.js';
+export * from './registry.js';
+export { AutosuggestInput, TagsAutosuggestInput } from './inputs.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/widgets/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/widgets/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC"}

package/dist/widgets/index.js

@@ -0,0 +1,4 @@
+export * from './types.js';
+export * from './registry.js';
+export { AutosuggestInput, TagsAutosuggestInput } from './inputs.js';
+//# sourceMappingURL=index.js.map

package/dist/widgets/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/widgets/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC"}

package/dist/widgets/inputs.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Autosuggest inputs shared by every widget EditForm.
+ *
+ * Zero deps; each fetches /e/<key>/<uid>/suggest/* with a 150ms debounce.
+ *   - AutosuggestInput     — single value (event type / tag prefix)
+ *   - TagsAutosuggestInput — multi value chips (tag filters)
+ */
+import React from 'react';
+import type { Theme } from './types.js';
+export declare function AutosuggestInput({ endpoint, authKey, uid, suggestPath, value, onChange, placeholder, theme, inputStyle, }: {
+    endpoint: string;
+    authKey: string;
+    uid: string;
+    suggestPath: 'events' | 'prefixes';
+    value: string;
+    onChange: (v: string) => void;
+    placeholder?: string;
+    theme: Theme;
+    inputStyle: React.CSSProperties;
+}): React.JSX.Element;
+export declare function TagsAutosuggestInput({ endpoint, authKey, uid, tags, onChange, placeholder, theme, inputStyle, inputId, }: {
+    endpoint: string;
+    authKey: string;
+    uid: string;
+    tags: string[];
+    onChange: (tags: string[]) => void;
+    placeholder?: string;
+    theme: Theme;
+    inputStyle: React.CSSProperties;
+    inputId?: string;
+}): React.JSX.Element;
+//# sourceMappingURL=inputs.d.ts.map

package/dist/widgets/inputs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"inputs.d.ts","sourceRoot":"","sources":["../../src/widgets/inputs.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAgBxC,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,OAAO,EACP,GAAG,EACH,WAAW,EACX,KAAK,EACL,QAAQ,EACR,WAAW,EACX,KAAK,EACL,UAAU,GACX,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,EAAE,QAAQ,GAAG,UAAU,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,KAAK,CAAC,aAAa,CAAC;CACjC,qBAqKA;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,OAAO,EACP,GAAG,EACH,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,UAAU,EACV,OAA8B,GAC/B,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,KAAK,CAAC,aAAa,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,qBAkPA"}

package/dist/widgets/inputs.js

@@ -0,0 +1,312 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Autosuggest inputs shared by every widget EditForm.
+ *
+ * Zero deps; each fetches /e/<key>/<uid>/suggest/* with a 150ms debounce.
+ *   - AutosuggestInput     — single value (event type / tag prefix)
+ *   - TagsAutosuggestInput — multi value chips (tag filters)
+ */
+import { useState, useEffect } from 'react';
+function useDebounced(value, delayMs) {
+    const [debounced, setDebounced] = useState(value);
+    useEffect(() => {
+        const t = setTimeout(() => setDebounced(value), delayMs);
+        return () => clearTimeout(t);
+    }, [value, delayMs]);
+    return debounced;
+}
+export function AutosuggestInput({ endpoint, authKey, uid, suggestPath, value, onChange, placeholder, theme, inputStyle, }) {
+    const [text, setText] = useState(value);
+    const [open, setOpen] = useState(false);
+    const [highlight, setHighlight] = useState(0);
+    const [items, setItems] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const debounced = useDebounced(text.trim(), 150);
+    useEffect(() => {
+        setText(value);
+    }, [value]);
+    useEffect(() => {
+        let cancelled = false;
+        if (!open || debounced.length === 0) {
+            setItems([]);
+            setLoading(false);
+            return;
+        }
+        setLoading(true);
+        const url = `${endpoint.replace(/\/$/, '')}/e/${authKey}/${uid}/suggest/${suggestPath}?q=${encodeURIComponent(debounced)}&limit=10`;
+        fetch(url)
+            .then((r) => (r.ok ? r.json() : Promise.reject(new Error(String(r.status)))))
+            .then((body) => {
+            if (cancelled)
+                return;
+            setItems(body.items ?? []);
+            setHighlight(0);
+        })
+            .catch(() => {
+            if (cancelled)
+                return;
+            setItems([]);
+        })
+            .finally(() => {
+            if (!cancelled)
+                setLoading(false);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [endpoint, authKey, uid, suggestPath, debounced, open]);
+    const showItemCreate = text.trim().length > 0 && !items.some((it) => it.value === text.trim());
+    function commit(v) {
+        setText(v);
+        onChange(v);
+        setOpen(false);
+    }
+    function onKeyDown(e) {
+        const totalOptions = items.length + (showItemCreate ? 1 : 0);
+        if (e.key === 'ArrowDown' && totalOptions > 0) {
+            e.preventDefault();
+            setOpen(true);
+            setHighlight((h) => Math.min(h + 1, totalOptions - 1));
+        }
+        else if (e.key === 'ArrowUp' && totalOptions > 0) {
+            e.preventDefault();
+            setHighlight((h) => Math.max(h - 1, 0));
+        }
+        else if (e.key === 'Enter') {
+            if (open && totalOptions > 0) {
+                e.preventDefault();
+                if (highlight < items.length)
+                    commit(items[highlight].value);
+                else
+                    commit(text.trim());
+            }
+        }
+        else if (e.key === 'Escape') {
+            setOpen(false);
+        }
+    }
+    const dropdownBg = theme === 'dark' ? '#0f172a' : '#ffffff';
+    const dropdownBorder = theme === 'dark' ? '#334155' : '#cbd5e1';
+    const hoverBg = theme === 'dark' ? '#1e293b' : '#eef2ff';
+    const subText = theme === 'dark' ? '#94a3b8' : '#64748b';
+    return (_jsxs("div", { style: { position: 'relative' }, children: [_jsx("input", { style: inputStyle, value: text, onChange: (e) => {
+                    setText(e.target.value);
+                    onChange(e.target.value);
+                    setOpen(true);
+                    setHighlight(0);
+                }, onFocus: () => setOpen(true), onBlur: () => setTimeout(() => setOpen(false), 120), onKeyDown: onKeyDown, placeholder: placeholder, autoComplete: "off", spellCheck: false }), open && text.trim().length > 0 && (_jsxs("div", { style: {
+                    position: 'absolute',
+                    top: 'calc(100% + 2px)',
+                    left: 0,
+                    right: 0,
+                    background: dropdownBg,
+                    border: `1px solid ${dropdownBorder}`,
+                    borderRadius: 6,
+                    boxShadow: '0 8px 24px rgba(0,0,0,0.15)',
+                    zIndex: 1100,
+                    maxHeight: 240,
+                    overflowY: 'auto',
+                    fontSize: 12,
+                }, onMouseDown: (e) => e.preventDefault(), children: [loading && _jsx("div", { style: { padding: '8px 10px', color: subText }, children: "Searching\u2026" }), !loading && items.length === 0 && !showItemCreate && (_jsx("div", { style: { padding: '8px 10px', color: subText }, children: "No matches." })), items.map((it, i) => (_jsxs("div", { onMouseEnter: () => setHighlight(i), onMouseDown: (e) => {
+                            e.preventDefault();
+                            commit(it.value);
+                        }, style: {
+                            padding: '6px 10px',
+                            cursor: 'pointer',
+                            display: 'flex',
+                            justifyContent: 'space-between',
+                            gap: 8,
+                            background: i === highlight ? hoverBg : 'transparent',
+                            borderRadius: 4,
+                            fontFamily: suggestPath === 'prefixes' ? 'monospace' : undefined,
+                        }, children: [_jsx("span", { style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: it.value }), _jsx("span", { style: { color: subText, flexShrink: 0, fontVariantNumeric: 'tabular-nums' }, children: it.count.toLocaleString() })] }, it.value))), showItemCreate && (_jsxs("div", { onMouseEnter: () => setHighlight(items.length), onMouseDown: (e) => {
+                            e.preventDefault();
+                            commit(text.trim());
+                        }, style: {
+                            padding: '6px 10px',
+                            cursor: 'pointer',
+                            borderTop: `1px dashed ${dropdownBorder}`,
+                            marginTop: items.length > 0 ? 4 : 0,
+                            background: highlight === items.length ? hoverBg : 'transparent',
+                            borderRadius: 4,
+                            color: '#4f46e5',
+                            fontStyle: 'italic',
+                        }, children: ["Use \"", text.trim(), "\"", suggestPath === 'prefixes' ? ' (new prefix)' : ' (new)'] }))] }))] }));
+}
+export function TagsAutosuggestInput({ endpoint, authKey, uid, tags, onChange, placeholder, theme, inputStyle, inputId = 'tag-input-internal', }) {
+    const [text, setText] = useState('');
+    const [open, setOpen] = useState(false);
+    const [highlight, setHighlight] = useState(0);
+    const [items, setItems] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const debounced = useDebounced(text.trim(), 150);
+    useEffect(() => {
+        let cancelled = false;
+        if (!open || debounced.length === 0) {
+            setItems([]);
+            setLoading(false);
+            return;
+        }
+        setLoading(true);
+        const url = `${endpoint.replace(/\/$/, '')}/e/${authKey}/${uid}/suggest/tags?q=${encodeURIComponent(debounced)}&limit=10`;
+        fetch(url)
+            .then((r) => (r.ok ? r.json() : Promise.reject(new Error(String(r.status)))))
+            .then((body) => {
+            if (cancelled)
+                return;
+            setItems(body.items ?? []);
+            setHighlight(0);
+        })
+            .catch(() => {
+            if (cancelled)
+                return;
+            setItems([]);
+        })
+            .finally(() => {
+            if (!cancelled)
+                setLoading(false);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [endpoint, authKey, uid, debounced, open]);
+    function addTag(raw) {
+        const v = raw.trim();
+        if (!v)
+            return;
+        const next = Array.from(new Set([...tags, v]));
+        onChange(next);
+        setText('');
+        setItems([]);
+        setHighlight(0);
+    }
+    function removeTag(t) {
+        onChange(tags.filter((x) => x !== t));
+    }
+    function onKeyDown(e) {
+        const totalOptions = items.length + (text.trim().length > 0 && !items.some((it) => it.value === text.trim()) ? 1 : 0);
+        if (e.key === 'ArrowDown' && totalOptions > 0) {
+            e.preventDefault();
+            setOpen(true);
+            setHighlight((h) => Math.min(h + 1, totalOptions - 1));
+        }
+        else if (e.key === 'ArrowUp' && totalOptions > 0) {
+            e.preventDefault();
+            setHighlight((h) => Math.max(h - 1, 0));
+        }
+        else if (e.key === 'Enter' || e.key === ',') {
+            e.preventDefault();
+            if (open && totalOptions > 0) {
+                if (highlight < items.length)
+                    addTag(items[highlight].value);
+                else
+                    addTag(text.trim());
+            }
+            else {
+                addTag(text.trim());
+            }
+        }
+        else if (e.key === 'Backspace' && text === '' && tags.length > 0) {
+            removeTag(tags[tags.length - 1]);
+        }
+        else if (e.key === 'Escape') {
+            setOpen(false);
+        }
+    }
+    const dropdownBg = theme === 'dark' ? '#0f172a' : '#ffffff';
+    const dropdownBorder = theme === 'dark' ? '#334155' : '#cbd5e1';
+    const hoverBg = theme === 'dark' ? '#1e293b' : '#eef2ff';
+    const subText = theme === 'dark' ? '#94a3b8' : '#64748b';
+    const chipBg = theme === 'dark' ? '#334155' : '#e0e7ff';
+    const chipText = theme === 'dark' ? '#f1f5f9' : '#3730a3';
+    const showItemCreate = text.trim().length > 0 && !items.some((it) => it.value === text.trim());
+    return (_jsxs("div", { style: {
+            ...inputStyle,
+            display: 'flex',
+            flexWrap: 'wrap',
+            gap: 4,
+            alignItems: 'center',
+            padding: '4px 6px',
+            cursor: 'text',
+            minHeight: inputStyle.padding ?? 36,
+        }, onMouseDown: () => {
+            const i = document.getElementById(inputId);
+            if (i)
+                i.focus();
+        }, children: [tags.map((t) => (_jsxs("span", { style: {
+                    display: 'inline-flex',
+                    alignItems: 'center',
+                    gap: 4,
+                    background: chipBg,
+                    color: chipText,
+                    padding: '2px 4px 2px 8px',
+                    borderRadius: 4,
+                    fontSize: 11,
+                    fontFamily: 'monospace',
+                }, children: [t, _jsx("button", { type: "button", onMouseDown: (e) => {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            removeTag(t);
+                        }, style: {
+                            border: 'none',
+                            background: 'transparent',
+                            color: chipText,
+                            cursor: 'pointer',
+                            fontSize: 13,
+                            lineHeight: 1,
+                            padding: '0 4px',
+                        }, "aria-label": `Remove ${t}`, children: "\u00D7" })] }, t))), _jsxs("div", { style: { position: 'relative', flex: 1, minWidth: 80 }, children: [_jsx("input", { id: inputId, style: {
+                            width: '100%',
+                            background: 'transparent',
+                            border: 'none',
+                            outline: 'none',
+                            color: 'inherit',
+                            fontSize: 13,
+                            padding: '4px 2px',
+                            fontFamily: 'monospace',
+                        }, value: text, onChange: (e) => {
+                            const next = e.target.value.replace(/,/g, '');
+                            setText(next);
+                            setOpen(true);
+                            setHighlight(0);
+                        }, onFocus: () => setOpen(true), onBlur: () => setTimeout(() => setOpen(false), 120), onKeyDown: onKeyDown, placeholder: tags.length === 0 ? placeholder : '', autoComplete: "off", spellCheck: false }), open && text.trim().length > 0 && (_jsxs("div", { style: {
+                            position: 'absolute',
+                            top: 'calc(100% + 2px)',
+                            left: 0,
+                            right: 0,
+                            background: dropdownBg,
+                            border: `1px solid ${dropdownBorder}`,
+                            borderRadius: 6,
+                            boxShadow: '0 8px 24px rgba(0,0,0,0.15)',
+                            zIndex: 1100,
+                            maxHeight: 240,
+                            overflowY: 'auto',
+                            fontSize: 12,
+                        }, onMouseDown: (e) => e.preventDefault(), children: [loading && _jsx("div", { style: { padding: '8px 10px', color: subText }, children: "Searching\u2026" }), !loading && items.length === 0 && !showItemCreate && (_jsx("div", { style: { padding: '8px 10px', color: subText }, children: "No matches." })), items.map((it, i) => (_jsxs("div", { onMouseEnter: () => setHighlight(i), onMouseDown: (e) => {
+                                    e.preventDefault();
+                                    addTag(it.value);
+                                }, style: {
+                                    padding: '6px 10px',
+                                    cursor: 'pointer',
+                                    display: 'flex',
+                                    justifyContent: 'space-between',
+                                    gap: 8,
+                                    background: i === highlight ? hoverBg : 'transparent',
+                                    borderRadius: 4,
+                                    fontFamily: 'monospace',
+                                }, children: [_jsx("span", { style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: it.value }), _jsx("span", { style: { color: subText, flexShrink: 0, fontVariantNumeric: 'tabular-nums' }, children: it.count.toLocaleString() })] }, it.value))), showItemCreate && (_jsxs("div", { onMouseEnter: () => setHighlight(items.length), onMouseDown: (e) => {
+                                    e.preventDefault();
+                                    addTag(text.trim());
+                                }, style: {
+                                    padding: '6px 10px',
+                                    cursor: 'pointer',
+                                    borderTop: `1px dashed ${dropdownBorder}`,
+                                    marginTop: items.length > 0 ? 4 : 0,
+                                    background: highlight === items.length ? hoverBg : 'transparent',
+                                    borderRadius: 4,
+                                    color: '#4f46e5',
+                                    fontStyle: 'italic',
+                                    fontFamily: 'monospace',
+                                }, children: ["Add \"", text.trim(), "\" (new tag)"] }))] }))] })] }));
+}
+//# sourceMappingURL=inputs.js.map