@mendylanda/ui 0.1.0 → 0.1.1

package/dist/filters/filters.js

@@ -12,7 +12,7 @@ export function FilterChip({ className, ...props }) {
     return (_jsx("div", { "data-mendy-ui": "", "data-slot": "filter-chip", className: cn("mui-123306850fe1 mui-539ae144f076 mui-81b198a2db84 mui-d5111d0e9f48 mui-3fa8c572949b mui-71556df3b421 mui-d191cb569aac mui-c74ab393b96d mui-35f35c41d134 mui-5e49f8678d00 mui-3bc474178684 motion-safe:slide-in-from-bottom-2.5 mui-b225f0361d28 mui-bc94a66158a3", className), ...props }));
 }
 export function FilterEditorTrigger({ className, asChild, ...props }) {
-    return (_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { asChild: asChild, variant: "ghost", "data-mendy-ui": "", "data-slot": "filter-editor-trigger", "aria-haspopup": "dialog", className: cn("mui-222f930b8752 mui-57c930dc1c31 mui-66b490dd6005 mui-52417259a4f5 mui-52101fc7d8bb mui-184ddc11e5f9 mui-71556df3b421 mui-70007b876865 mui-e7e01cc7f4df mui-1a5d10977b93 mui-37ad15a95595 mui-4d6720d47806 mui-2e357972fc10 mui-355efe22aedb mui-50aafa8694bb mui-db549d38ff19 mui-8d3c1014b967 mui-4600b77303d6 mui-4027d9c589b6 mui-6f73a280432e", className), ...props }) }));
+    return (_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { asChild: asChild, variant: "ghost", "data-mendy-ui": "", "data-slot": "filter-editor-trigger", "aria-haspopup": "dialog", className: cn("mui-222f930b8752 mui-57c930dc1c31 mui-66b490dd6005 mui-52417259a4f5 mui-52101fc7d8bb mui-184ddc11e5f9 mui-71556df3b421 mui-70007b876865 mui-e7e01cc7f4df mui-e9347b78185f mui-37ad15a95595 mui-4d6720d47806 mui-2e357972fc10 mui-355efe22aedb mui-50aafa8694bb mui-db549d38ff19 mui-8d3c1014b967 mui-4600b77303d6 mui-4027d9c589b6 mui-6f73a280432e", className), ...props }) }));
 }
 export function FilterEditorContent({ className, onClick, ...props }) {
     return (_jsx(DropdownMenuContent, { "data-mendy-ui": "", "data-slot": "filter-editor-content", role: "dialog", "aria-orientation": undefined, align: "start", sideOffset: 6, loop: true, onClick: (event) => {
@@ -21,7 +21,7 @@ export function FilterEditorContent({ className, onClick, ...props }) {
         }, className: cn("mui-dcd942c18ddc mui-34055e6f8c1b mui-2368e909f3a5 mui-04760bcd507f mui-37d8a3f448ff", className), ...props }));
 }
 export function FilterRemove({ className, children, ...props }) {
-    return (_jsx(Button, { variant: "ghost", type: "button", "data-mendy-ui": "", "data-slot": "filter-remove", className: cn("mui-222f930b8752 mui-57c930dc1c31 mui-52417259a4f5 mui-04760bcd507f mui-8867d85ed290 mui-27ead27a81df mui-71556df3b421 mui-a503dd374cca mui-8d940fccb093 mui-163a623b3716 mui-37ad15a95595 mui-4d6720d47806 mui-2e357972fc10 mui-355efe22aedb mui-50aafa8694bb mui-db549d38ff19 mui-8d3c1014b967 mui-4600b77303d6", className), ...props, children: children ?? _jsx(XIcon, { className: "mui-61c000c8a98a", "aria-hidden": "true" }) }));
+    return (_jsx(Button, { variant: "ghost", type: "button", "data-mendy-ui": "", "data-slot": "filter-remove", className: cn("mui-222f930b8752 mui-57c930dc1c31 mui-52417259a4f5 mui-04760bcd507f mui-8867d85ed290 mui-27ead27a81df mui-71556df3b421 mui-a503dd374cca mui-55860251be20 mui-163a623b3716 mui-37ad15a95595 mui-4d6720d47806 mui-2e357972fc10 mui-355efe22aedb mui-50aafa8694bb mui-db549d38ff19 mui-8d3c1014b967 mui-4600b77303d6", className), ...props, children: children ?? _jsx(XIcon, { className: "mui-61c000c8a98a", "aria-hidden": "true" }) }));
 }
 /** Editing and removal are independent. Values remain owned by the caller. */
 export function AppliedFilter({ label, editor, onRemove, disabled, open, onOpenChange, editLabel = `Edit ${label} filter`, removeLabel = `Remove ${label} filter`, contentProps, triggerProps, removeProps, children, ...props }) {

package/dist/filters/use-filter-options.js

@@ -1,4 +1,5 @@
 "use client";
+import { useValueDraft } from "./use-value-draft.js";
 import { createContext, useContext, useEffect, useLayoutEffect, useRef, useState } from "react";
 export const FilterOptionCache = createContext(null);
 function acquire(cache, key, load) {
@@ -39,6 +40,7 @@ function acquire(cache, key, load) {
     let released = false;
     return {
         promise: current.promise,
+        signal: current.abort.signal,
         release() {
             if (released)
                 return;
@@ -71,12 +73,12 @@ export function useFilterOptions(id, field, value, enabled) {
     useLayoutEffect(() => {
         latest.current = source;
     }, [source]);
-    const [localQuery, setLocalQuery] = useState("");
+    const scopeKey = JSON.stringify([id, source?.kind, source?.scope, source?.params]);
+    const [localQuery, setLocalQuery] = useValueDraft(scopeKey, () => "", `${id}:query`);
     const query = source?.query ?? localQuery;
     const [retryKey, retry] = useState(0);
-    const scopeKey = JSON.stringify([id, source?.scope, source?.params]);
     const requestKey = JSON.stringify([scopeKey, query, retryKey]);
-    const identity = JSON.stringify([id, source?.scope]);
+    const identity = JSON.stringify([id, source?.kind, source?.scope]);
     const ids = selectedIds(value);
     const idsKey = JSON.stringify(ids);
     const [page, setPage] = useState({ key: "", items: [], loading: false });
@@ -182,7 +184,7 @@ export function useFilterOptions(id, field, value, enabled) {
             moreRelease.current = request.release;
             request.promise
                 .then((result) => {
-                if (currentRequest.current !== requestKey)
+                if (request.signal.aborted || currentRequest.current !== requestKey)
                     return;
                 setPage((previous) => ({
                     key: requestKey,
@@ -193,7 +195,7 @@ export function useFilterOptions(id, field, value, enabled) {
                     loading: false,
                 }));
             }, (error) => {
-                if (currentRequest.current === requestKey)
+                if (!request.signal.aborted && currentRequest.current === requestKey)
                     setPage((previous) => ({ ...previous, loading: false, error: errorMessage(error) }));
             })
                 .finally(request.release);

package/dist/filters/use-menu-pointer.d.ts

@@ -0,0 +1,10 @@
+import type { PointerEvent, RefObject } from "react";
+/** Allow a short diagonal path from a filter row into its adjacent editor. */
+export declare function useMenuPointer({ editor, selectedId, onChoose, }: {
+    editor: RefObject<HTMLDivElement | null>;
+    selectedId?: string;
+    onChoose(id: string): void;
+}): {
+    move: (id: string, event: PointerEvent<HTMLButtonElement>) => void;
+    cancel: () => void;
+};

package/dist/filters/use-menu-pointer.js

@@ -0,0 +1,64 @@
+"use client";
+import { useEffect, useLayoutEffect, useRef } from "react";
+/** Allow a short diagonal path from a filter row into its adjacent editor. */
+export function useMenuPointer({ editor, selectedId, onChoose, }) {
+    const origin = useRef(null);
+    const last = useRef(null);
+    const pending = useRef(null);
+    const candidate = useRef(null);
+    const choose = useRef(onChoose);
+    useLayoutEffect(() => {
+        choose.current = onChoose;
+    });
+    function cancel() {
+        if (pending.current !== null)
+            clearTimeout(pending.current);
+        pending.current = null;
+        candidate.current = null;
+    }
+    useEffect(() => cancel, []);
+    useEffect(() => {
+        cancel();
+        origin.current = null;
+    }, [selectedId]);
+    function move(id, event) {
+        if (event.pointerType !== "mouse")
+            return;
+        const point = { x: event.clientX, y: event.clientY };
+        const previous = last.current;
+        last.current = point;
+        // Layout changes beneath a stationary cursor are not navigation intent.
+        if (previous?.x === point.x && previous.y === point.y)
+            return;
+        if (id === selectedId) {
+            cancel();
+            origin.current = point;
+            return;
+        }
+        const start = origin.current;
+        const bounds = editor.current?.getBoundingClientRect();
+        if (start && previous && bounds) {
+            const edge = start.x < bounds.left ? bounds.left : bounds.right;
+            const distance = edge - start.x;
+            const progress = (point.x - start.x) / distance;
+            const towardsEditor = (point.x - previous.x) * distance > 0;
+            const top = start.y + (bounds.top - 8 - start.y) * progress;
+            const bottom = start.y + (bounds.bottom + 8 - start.y) * progress;
+            if (towardsEditor && progress >= 0 && progress <= 1 && point.y >= top && point.y <= bottom) {
+                candidate.current = id;
+                if (pending.current === null) {
+                    pending.current = setTimeout(() => {
+                        const next = candidate.current;
+                        cancel();
+                        if (next)
+                            choose.current(next);
+                    }, 300);
+                }
+                return;
+            }
+        }
+        cancel();
+        choose.current(id);
+    }
+    return { move, cancel };
+}

package/dist/filters/use-value-draft.d.ts

@@ -1,2 +1,9 @@
-/** Preserve unfinished edits until the application's committed value changes. */
-export declare function useValueDraft<V, D>(value: V, createDraft: (value: V) => D): readonly [D, (draft: D) => void];
+interface SavedDraft {
+    value: unknown;
+    draft: unknown;
+}
+export type DraftCache = Map<string, SavedDraft>;
+export declare const FilterDraftCache: import("react").Context<DraftCache | null>;
+/** Keep a menu-session draft until its committed value changes. Outside a menu, state stays local. */
+export declare function useValueDraft<V, D>(value: V, createDraft: (value: V) => D, key?: string): readonly [D, (draft: D) => void];
+export {};

package/dist/filters/use-value-draft.js

@@ -1,16 +1,31 @@
 "use client";
-import { useState } from "react";
+import { createContext, useContext, useLayoutEffect, useState } from "react";
 import { equalValues } from "./filter-definition.js";
-/** Preserve unfinished edits until the application's committed value changes. */
-export function useValueDraft(value, createDraft) {
-    const [state, setState] = useState(() => ({ value, draft: createDraft(value) }));
+export const FilterDraftCache = createContext(null);
+/** Keep a menu-session draft until its committed value changes. Outside a menu, state stays local. */
+export function useValueDraft(value, createDraft, key) {
+    const cache = useContext(FilterDraftCache);
+    const [state, setState] = useState(() => {
+        const saved = key ? cache?.get(key) : undefined;
+        return {
+            value,
+            draft: saved && equalValues(saved.value, value) ? saved.draft : createDraft(value),
+        };
+    });
     let current = state;
     if (!equalValues(state.value, value)) {
         current = { value, draft: createDraft(value) };
         setState(current);
     }
+    useLayoutEffect(() => {
+        if (key)
+            cache?.set(key, current);
+    });
     function setDraft(draft) {
-        setState({ value, draft });
+        const next = { value, draft };
+        if (key)
+            cache?.set(key, next);
+        setState(next);
     }
     return [current.draft, setDraft];
 }

package/dist/primitives/calendar.js

@@ -35,7 +35,7 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
             range_start: cn("mui-10c0bae8cba9 mui-292affc1f780", defaultClassNames.range_start),
             range_middle: cn("mui-52417259a4f5", defaultClassNames.range_middle),
             range_end: cn("mui-34bbd346e74c mui-292affc1f780", defaultClassNames.range_end),
-            today: cn("mui-3fa8c572949b mui-292affc1f780 mui-cc209238d847 mui-3cc0d07ef843", defaultClassNames.today),
+            today: cn("mui-3fa8c572949b mui-cc310a330231 mui-b7ff49878425 mui-d9bdd2c94504 mui-3cc0d07ef843", defaultClassNames.today),
             outside: cn("mui-35f35c41d134 mui-7d900a71e5ba", defaultClassNames.outside),
             disabled: cn("mui-35f35c41d134 mui-0b5a4d1257ab", defaultClassNames.disabled),
             hidden: cn("mui-b75af7ef6c4d", defaultClassNames.hidden),
@@ -70,6 +70,6 @@ function CalendarDayButton({ className, day, modifiers, ...props }) {
     return (_jsx(Button, { ref: ref, variant: "ghost", size: "icon", "data-day": format(day.date, "yyyy-MM-dd"), "data-selected-single": modifiers.selected &&
             !modifiers.range_start &&
             !modifiers.range_end &&
-            !modifiers.range_middle, "data-range-start": modifiers.range_start, "data-range-end": modifiers.range_end, "data-range-middle": modifiers.range_middle, className: cn("mui-222f930b8752 mui-129d6f9b1e07 mui-4dad94bd15e3 mui-58d0413dd93c mui-1458e495e3ae mui-302c0d124a94 mui-19e97f3f40e6 mui-761cdb81bddb mui-52101fc7d8bb mui-60052b901494 mui-3f96bf138f7b mui-d39eb62b8363 mui-47cbd20a4dc0 mui-4eb7d653ae35 mui-96308b55e0d6 mui-a55dbe6f3eec mui-714051e55e8e mui-c764cebcd540 mui-05ec0700cd48 mui-5fb598fb06f4 mui-0813905aa141 mui-8020e31bff67 mui-ab65911baf1d mui-f5460d79341c mui-421a7d3e6631 mui-a39af81d518c mui-b6991ab170de mui-b2786f463a62 mui-ba417cf466b0 mui-829c8ef4f9c5", defaultClassNames.day, className), ...props }));
+            !modifiers.range_middle, "data-range-start": modifiers.range_start, "data-range-end": modifiers.range_end, "data-range-middle": modifiers.range_middle, className: cn("mui-222f930b8752 mui-129d6f9b1e07 mui-4dad94bd15e3 mui-58d0413dd93c mui-1458e495e3ae mui-302c0d124a94 mui-19e97f3f40e6 mui-761cdb81bddb mui-52101fc7d8bb mui-60052b901494 mui-3f96bf138f7b mui-d39eb62b8363 mui-5892a880410a mui-31b75c623c06 mui-96308b55e0d6 mui-a55dbe6f3eec mui-714051e55e8e mui-c764cebcd540 mui-05ec0700cd48 mui-5fb598fb06f4 mui-0813905aa141 mui-8020e31bff67 mui-ab65911baf1d mui-f5460d79341c mui-421a7d3e6631 mui-a39af81d518c mui-b6991ab170de mui-b2786f463a62 mui-ba417cf466b0 mui-829c8ef4f9c5", defaultClassNames.day, className), ...props }));
 }
 export { Calendar, CalendarDayButton };

package/dist/primitives/dropdown-menu.js

@@ -25,13 +25,13 @@ function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
     return (_jsx(DropdownMenuPrimitive.Item, { "data-mendy-ui": "", "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("mui-d2d9e1f13413 mui-222f930b8752 mui-d343f41ba73e mui-71556df3b421 mui-074569488cca mui-02e603944040 mui-e7e01cc7f4df mui-a8c1dfb1d4ef mui-c74ab393b96d mui-59edd3d33673 mui-78905c9e865c mui-a8c1861c5d03 mui-a85c4c5d7465 mui-397f5ba426a0 mui-9beb654fcb0d mui-6fa6a8ade7c4 mui-f3f7a9c5e1b3 mui-e2bb4ac97190 mui-353a727facfd mui-98a28c2293f7 mui-bcae9d37090c mui-040e748a3fa0 mui-eb5ef2dbc2d4 mui-8637dfd54fbb mui-82b114bbff3d", className), ...props }));
 }
 function DropdownMenuCheckboxItem({ className, children, checked, ...props }) {
-    return (_jsxs(DropdownMenuPrimitive.CheckboxItem, { "data-mendy-ui": "", "data-slot": "dropdown-menu-checkbox-item", className: cn("mui-d2d9e1f13413 mui-222f930b8752 mui-d343f41ba73e mui-71556df3b421 mui-074569488cca mui-02e603944040 mui-a8c1dfb1d4ef mui-98a5b6fff1d2 mui-75b27e813dcc mui-c74ab393b96d mui-59edd3d33673 mui-78905c9e865c mui-a8c1861c5d03 mui-a85c4c5d7465 mui-397f5ba426a0 mui-9beb654fcb0d mui-bcae9d37090c mui-040e748a3fa0 mui-eb5ef2dbc2d4", className), checked: checked, ...props, children: [_jsx("span", { className: "mui-33228ff7d583 mui-747355bdc2a2 mui-5b9fdf1819c4 mui-222f930b8752 mui-61c000c8a98a mui-71556df3b421 mui-a503dd374cca", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "mui-100c22d5776b" }) }) }), children] }));
+    return (_jsxs(DropdownMenuPrimitive.CheckboxItem, { "data-mendy-ui": "", "data-slot": "dropdown-menu-checkbox-item", className: cn("mui-d2d9e1f13413 mui-222f930b8752 mui-d343f41ba73e mui-71556df3b421 mui-074569488cca mui-02e603944040 mui-a8c1dfb1d4ef mui-05d4103bd67f mui-078d945937da mui-c74ab393b96d mui-59edd3d33673 mui-78905c9e865c mui-a8c1861c5d03 mui-a85c4c5d7465 mui-397f5ba426a0 mui-9beb654fcb0d mui-bcae9d37090c mui-040e748a3fa0 mui-eb5ef2dbc2d4", className), checked: checked, ...props, children: [_jsx("span", { className: "mui-33228ff7d583 mui-747355bdc2a2 mui-207bd0b3f259 mui-222f930b8752 mui-61c000c8a98a mui-71556df3b421 mui-a503dd374cca", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "mui-100c22d5776b" }) }) }), children] }));
 }
 function DropdownMenuRadioGroup({ ...props }) {
     return (_jsx(DropdownMenuPrimitive.RadioGroup, { "data-mendy-ui": "", "data-slot": "dropdown-menu-radio-group", ...props }));
 }
 function DropdownMenuRadioItem({ className, children, ...props }) {
-    return (_jsxs(DropdownMenuPrimitive.RadioItem, { "data-mendy-ui": "", "data-slot": "dropdown-menu-radio-item", className: cn("mui-d2d9e1f13413 mui-222f930b8752 mui-d343f41ba73e mui-71556df3b421 mui-074569488cca mui-02e603944040 mui-a8c1dfb1d4ef mui-98a5b6fff1d2 mui-75b27e813dcc mui-c74ab393b96d mui-59edd3d33673 mui-78905c9e865c mui-a8c1861c5d03 mui-a85c4c5d7465 mui-397f5ba426a0 mui-9beb654fcb0d mui-bcae9d37090c mui-040e748a3fa0 mui-eb5ef2dbc2d4", className), ...props, children: [_jsx("span", { className: "mui-33228ff7d583 mui-747355bdc2a2 mui-5b9fdf1819c4 mui-222f930b8752 mui-61c000c8a98a mui-71556df3b421 mui-a503dd374cca", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "mui-9e7600197f38 mui-717b342c2d01" }) }) }), children] }));
+    return (_jsxs(DropdownMenuPrimitive.RadioItem, { "data-mendy-ui": "", "data-slot": "dropdown-menu-radio-item", className: cn("mui-d2d9e1f13413 mui-222f930b8752 mui-d343f41ba73e mui-71556df3b421 mui-074569488cca mui-02e603944040 mui-a8c1dfb1d4ef mui-05d4103bd67f mui-078d945937da mui-c74ab393b96d mui-59edd3d33673 mui-78905c9e865c mui-a8c1861c5d03 mui-a85c4c5d7465 mui-397f5ba426a0 mui-9beb654fcb0d mui-bcae9d37090c mui-040e748a3fa0 mui-eb5ef2dbc2d4", className), ...props, children: [_jsx("span", { className: "mui-33228ff7d583 mui-747355bdc2a2 mui-207bd0b3f259 mui-222f930b8752 mui-61c000c8a98a mui-71556df3b421 mui-a503dd374cca", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "mui-9e7600197f38 mui-717b342c2d01" }) }) }), children] }));
 }
 function DropdownMenuLabel({ className, inset, ...props }) {
     return (_jsx(DropdownMenuPrimitive.Label, { "data-mendy-ui": "", "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("mui-e7e01cc7f4df mui-a8c1dfb1d4ef mui-c74ab393b96d mui-daaac3fbf55e mui-6fa6a8ade7c4", className), ...props }));