@banzamel/mineralui 0.9.0 → 0.10.0

package/dist/theme/ThemeProvider.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { MineralTheme, MineralMode, MineralModePreference } from './types';
+interface ThemeContextValue {
+    theme: MineralTheme;
+    mode: MineralModePreference;
+    resolvedMode: MineralMode;
+    setMode: (next: MineralModePreference) => void;
+    toggleMode: () => void;
+}
+export type MineralThemeScope = 'body' | 'wrapper';
+interface MineralThemeProviderProps {
+    theme?: MineralTheme;
+    mode?: MineralModePreference;
+    persist?: boolean;
+    scope?: MineralThemeScope;
+    children: ReactNode;
+}
+export declare function MineralThemeProvider({ theme, mode: modeProp, persist, scope, children, }: MineralThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useTheme(): ThemeContextValue;
+export {};

package/dist/theme/index.d.ts

@@ -0,0 +1,3 @@
+export { MineralThemeProvider as MThemeProvider, useTheme as useMTheme, MineralThemeProvider, useTheme, } from './ThemeProvider';
+export type { MineralThemeScope } from './ThemeProvider';
+export type { MineralTheme, MineralMode, MineralModePreference, MineralColor, MineralSize, MineralFontColor, } from './types';

package/dist/theme/types.d.ts

@@ -0,0 +1,50 @@
+export type MineralMode = 'dark' | 'light';
+export type MineralModePreference = MineralMode | 'system';
+export type MineralFontColor = 'default' | 'muted' | 'heading' | 'inverted' | 'inherit' | 'primary' | 'neutral' | 'success' | 'error' | 'warning' | 'info' | 'danger';
+export interface MineralTheme {
+    primaryRgb?: string;
+    primary?: string;
+    primaryDark?: string;
+    primaryLight?: string;
+    neutralRgb?: string;
+    neutral?: string;
+    dark?: string;
+    darkLight?: string;
+    surface?: string;
+    surfaceContrast?: string;
+    pageBg?: string;
+    pageText?: string;
+    text?: string;
+    textSecondary?: string;
+    textHeading?: string;
+    border?: string;
+    borderHover?: string;
+    borderFocus?: string;
+    successRgb?: string;
+    success?: string;
+    errorRgb?: string;
+    error?: string;
+    warningRgb?: string;
+    warning?: string;
+    infoRgb?: string;
+    info?: string;
+    fontFamily?: string;
+    fontFamilySans?: string;
+    fontFamilyMono?: string;
+    fontFamilyHeading?: string;
+    fontColorDefault?: string;
+    fontColorMuted?: string;
+    fontColorHeading?: string;
+    fontColorInverted?: string;
+    fontColorPrimary?: string;
+    fontColorNeutral?: string;
+    fontColorSuccess?: string;
+    fontColorError?: string;
+    fontColorWarning?: string;
+    fontColorInfo?: string;
+    radiusSm?: string;
+    radiusMd?: string;
+    radiusLg?: string;
+}
+export type MineralColor = 'primary' | 'neutral' | 'success' | 'error' | 'warning' | 'info' | 'danger';
+export type MineralSize = 'sm' | 'md' | 'lg';

package/dist/theme.cjs

@@ -0,0 +1,2 @@
+require('./style-runtime.cjs')
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./ThemeProvider-CCWDIXiA.cjs`);exports.MThemeProvider=e.t,exports.MineralThemeProvider=e.t,exports.useMTheme=e.n,exports.useTheme=e.n;

package/dist/theme.d.ts

@@ -0,0 +1,2 @@
+export * from './theme.entry'
+export {}

package/dist/theme.entry.d.ts

@@ -0,0 +1 @@
+export * from './theme';

package/dist/theme.js

@@ -0,0 +1,3 @@
+import './style-runtime.js'
+import { n as e, t } from "./ThemeProvider-COEImCNH.js";
+export { t as MThemeProvider, t as MineralThemeProvider, e as useMTheme, e as useTheme };

package/dist/typography.cjs

@@ -0,0 +1,2 @@
+require('./style-runtime.cjs')
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./Heading-CALsycVL.cjs`),t=require(`./Text-DUuY1RDL.cjs`),n=require(`./Link-DSIStgFG.cjs`),r=require(`./Kbd-wmU-rhWO.cjs`);exports.Code=r.a,exports.MCode=r.a,exports.Heading=e.t,exports.MHeading=e.t,exports.Kbd=r.t,exports.MKbd=r.t,exports.List=r.r,exports.MList=r.r,exports.ListItem=r.i,exports.MListItem=r.i,exports.MLink=n.t,exports.MSubText=r.n,exports.SubText=r.n,exports.MText=t.t,exports.Text=t.t;

package/dist/typography.d.ts

@@ -0,0 +1,3 @@
+export * from './components/typography';
+export { Heading as MHeading, Text as MText, SubText as MSubText, MLink, Code as MCode, List as MList, ListItem as MListItem, Kbd as MKbd, } from './components/typography';
+export type { HeadingProps as MHeadingProps, TextProps as MTextProps, TextAlign as MTextAlign, SubTextProps as MSubTextProps, SubTextSize as MSubTextSize, CodeProps as MCodeProps, ListProps as MListProps, KbdProps as MKbdProps, } from './components/typography';

package/dist/typography.js

@@ -0,0 +1,6 @@
+import './style-runtime.js'
+import { t as e } from "./Heading-DtcgehrI.js";
+import { t } from "./Text-DOVuH0uw.js";
+import { t as n } from "./Link-D3lmTu3R.js";
+import { a as r, i, n as a, r as o, t as s } from "./Kbd-qcCkiDkW.js";
+export { r as Code, r as MCode, e as Heading, e as MHeading, s as Kbd, s as MKbd, o as List, o as MList, i as ListItem, i as MListItem, n as MLink, a as MSubText, a as SubText, t as MText, t as Text };

package/dist/useClickOutside-CS-Mc6ne.cjs

@@ -0,0 +1,2 @@
+let e=require(`react`);function t(t,n){(0,e.useEffect)(()=>{let e=e=>{!t.current||t.current.contains(e.target)||n()};return document.addEventListener(`mousedown`,e),document.addEventListener(`touchstart`,e),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`touchstart`,e)}},[t,n])}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return t}});
+//# sourceMappingURL=useClickOutside-CS-Mc6ne.cjs.map

package/dist/useClickOutside-CS-Mc6ne.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside-CS-Mc6ne.cjs","names":[],"sources":["../src/utils/useClickOutside.ts"],"sourcesContent":["import {useEffect, type RefObject} from 'react'\n\n// Trigger a callback when pointer interaction happens outside the referenced element.\nexport function useClickOutside(ref: RefObject<HTMLElement | null>, handler: () => void): void {\n    useEffect(() => {\n        const listener = (e: MouseEvent | TouchEvent) => {\n            if (!ref.current || ref.current.contains(e.target as Node)) return\n            handler()\n        }\n\n        document.addEventListener('mousedown', listener)\n        document.addEventListener('touchstart', listener)\n        return () => {\n            document.removeEventListener('mousedown', listener)\n            document.removeEventListener('touchstart', listener)\n        }\n    }, [ref, handler])\n}\n"],"mappings":"uBAGA,SAAgB,EAAgB,EAAoC,EAA2B,EAC3F,EAAA,EAAA,eAAgB,CACZ,IAAM,EAAY,GAA+B,CACzC,CAAC,EAAI,SAAW,EAAI,QAAQ,SAAS,EAAE,OAAe,EAC1D,GAAS,EAKb,OAFA,SAAS,iBAAiB,YAAa,EAAS,CAChD,SAAS,iBAAiB,aAAc,EAAS,KACpC,CACT,SAAS,oBAAoB,YAAa,EAAS,CACnD,SAAS,oBAAoB,aAAc,EAAS,GAEzD,CAAC,EAAK,EAAQ,CAAC"}

package/dist/useClickOutside-Dcye4Ut0.js

@@ -0,0 +1,16 @@
+import { useEffect as e } from "react";
+//#region src/utils/useClickOutside.ts
+function t(t, n) {
+	e(() => {
+		let e = (e) => {
+			!t.current || t.current.contains(e.target) || n();
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("touchstart", e), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("touchstart", e);
+		};
+	}, [t, n]);
+}
+//#endregion
+export { t };
+
+//# sourceMappingURL=useClickOutside-Dcye4Ut0.js.map

package/dist/useClickOutside-Dcye4Ut0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside-Dcye4Ut0.js","names":[],"sources":["../src/utils/useClickOutside.ts"],"sourcesContent":["import {useEffect, type RefObject} from 'react'\n\n// Trigger a callback when pointer interaction happens outside the referenced element.\nexport function useClickOutside(ref: RefObject<HTMLElement | null>, handler: () => void): void {\n    useEffect(() => {\n        const listener = (e: MouseEvent | TouchEvent) => {\n            if (!ref.current || ref.current.contains(e.target as Node)) return\n            handler()\n        }\n\n        document.addEventListener('mousedown', listener)\n        document.addEventListener('touchstart', listener)\n        return () => {\n            document.removeEventListener('mousedown', listener)\n            document.removeEventListener('touchstart', listener)\n        }\n    }, [ref, handler])\n}\n"],"mappings":";;AAGA,SAAgB,EAAgB,GAAoC,GAA2B;AAC3F,SAAgB;EACZ,IAAM,KAAY,MAA+B;AACzC,IAAC,EAAI,WAAW,EAAI,QAAQ,SAAS,EAAE,OAAe,IAC1D,GAAS;;AAKb,SAFA,SAAS,iBAAiB,aAAa,EAAS,EAChD,SAAS,iBAAiB,cAAc,EAAS,QACpC;AAET,GADA,SAAS,oBAAoB,aAAa,EAAS,EACnD,SAAS,oBAAoB,cAAc,EAAS;;IAEzD,CAAC,GAAK,EAAQ,CAAC"}

package/dist/useDebounce-C3jbJOKC.cjs

@@ -0,0 +1,2 @@
+let e=require(`react`);function t(t,n){let[r,i]=(0,e.useState)(t);return(0,e.useEffect)(()=>{let e=setTimeout(()=>i(t),n);return()=>clearTimeout(e)},[t,n]),r}function n(t,n){let r=(0,e.useRef)(t);r.current=t;let i=(0,e.useRef)(null);return(0,e.useCallback)(((...e)=>{i.current&&clearTimeout(i.current),i.current=setTimeout(()=>r.current(...e),n)}),[n])}Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return t}});
+//# sourceMappingURL=useDebounce-C3jbJOKC.cjs.map

package/dist/useDebounce-C3jbJOKC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce-C3jbJOKC.cjs","names":[],"sources":["../src/utils/useDebounce.ts"],"sourcesContent":["import {useState, useEffect, useRef, useCallback} from 'react'\n\n// Expose a value only after it stays stable for the given delay.\nexport function useDebounce<T>(value: T, delay: number): T {\n    const [debounced, setDebounced] = useState(value)\n\n    useEffect(() => {\n        const timer = setTimeout(() => setDebounced(value), delay)\n        return () => clearTimeout(timer)\n    }, [value, delay])\n\n    return debounced\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\n// Wrap a callback so repeated calls collapse into the latest invocation.\nexport function useDebouncedCallback<T extends (...args: any[]) => void>(callback: T, delay: number): T {\n    const callbackRef = useRef(callback)\n    callbackRef.current = callback\n    const timerRef = useRef<ReturnType<typeof setTimeout>>(null)\n\n    return useCallback(\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        ((...args: any[]) => {\n            if (timerRef.current) clearTimeout(timerRef.current)\n            timerRef.current = setTimeout(() => callbackRef.current(...args), delay)\n        }) as T,\n        [delay]\n    )\n}\n"],"mappings":"uBAGA,SAAgB,EAAe,EAAU,EAAkB,CACvD,GAAM,CAAC,EAAW,IAAA,EAAA,EAAA,UAAyB,EAAM,CAOjD,OALA,EAAA,EAAA,eAAgB,CACZ,IAAM,EAAQ,eAAiB,EAAa,EAAM,CAAE,EAAM,CAC1D,UAAa,aAAa,EAAM,EACjC,CAAC,EAAO,EAAM,CAAC,CAEX,EAKX,SAAgB,EAAyD,EAAa,EAAkB,CACpG,IAAM,GAAA,EAAA,EAAA,QAAqB,EAAS,CACpC,EAAY,QAAU,EACtB,IAAM,GAAA,EAAA,EAAA,QAAiD,KAAK,CAE5D,OAAA,EAAA,EAAA,eAEM,GAAG,IAAgB,CACb,EAAS,SAAS,aAAa,EAAS,QAAQ,CACpD,EAAS,QAAU,eAAiB,EAAY,QAAQ,GAAG,EAAK,CAAE,EAAM,GAE5E,CAAC,EAAM,CACV"}

package/dist/useDebounce-D-v3IRXp.js

@@ -0,0 +1,21 @@
+import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
+//#region src/utils/useDebounce.ts
+function i(e, n) {
+	let [i, a] = r(e);
+	return t(() => {
+		let t = setTimeout(() => a(e), n);
+		return () => clearTimeout(t);
+	}, [e, n]), i;
+}
+function a(t, r) {
+	let i = n(t);
+	i.current = t;
+	let a = n(null);
+	return e(((...e) => {
+		a.current && clearTimeout(a.current), a.current = setTimeout(() => i.current(...e), r);
+	}), [r]);
+}
+//#endregion
+export { a as n, i as t };
+
+//# sourceMappingURL=useDebounce-D-v3IRXp.js.map

package/dist/useDebounce-D-v3IRXp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce-D-v3IRXp.js","names":[],"sources":["../src/utils/useDebounce.ts"],"sourcesContent":["import {useState, useEffect, useRef, useCallback} from 'react'\n\n// Expose a value only after it stays stable for the given delay.\nexport function useDebounce<T>(value: T, delay: number): T {\n    const [debounced, setDebounced] = useState(value)\n\n    useEffect(() => {\n        const timer = setTimeout(() => setDebounced(value), delay)\n        return () => clearTimeout(timer)\n    }, [value, delay])\n\n    return debounced\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\n// Wrap a callback so repeated calls collapse into the latest invocation.\nexport function useDebouncedCallback<T extends (...args: any[]) => void>(callback: T, delay: number): T {\n    const callbackRef = useRef(callback)\n    callbackRef.current = callback\n    const timerRef = useRef<ReturnType<typeof setTimeout>>(null)\n\n    return useCallback(\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        ((...args: any[]) => {\n            if (timerRef.current) clearTimeout(timerRef.current)\n            timerRef.current = setTimeout(() => callbackRef.current(...args), delay)\n        }) as T,\n        [delay]\n    )\n}\n"],"mappings":";;AAGA,SAAgB,EAAe,GAAU,GAAkB;CACvD,IAAM,CAAC,GAAW,KAAgB,EAAS,EAAM;AAOjD,QALA,QAAgB;EACZ,IAAM,IAAQ,iBAAiB,EAAa,EAAM,EAAE,EAAM;AAC1D,eAAa,aAAa,EAAM;IACjC,CAAC,GAAO,EAAM,CAAC,EAEX;;AAKX,SAAgB,EAAyD,GAAa,GAAkB;CACpG,IAAM,IAAc,EAAO,EAAS;AACpC,GAAY,UAAU;CACtB,IAAM,IAAW,EAAsC,KAAK;AAE5D,QAAO,IAED,GAAG,MAAgB;AAEjB,EADI,EAAS,WAAS,aAAa,EAAS,QAAQ,EACpD,EAAS,UAAU,iBAAiB,EAAY,QAAQ,GAAG,EAAK,EAAE,EAAM;KAE5E,CAAC,EAAM,CACV"}

package/dist/useFormField-Bz4d7m8u.cjs

@@ -0,0 +1,2 @@
+const e=require(`./validators-B7cSTrU_.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);var r=(0,t.createContext)(null);function i(){return(0,t.useContext)(r)}function a({initialValues:i={},onSubmit:a,onChange:o,validationMode:s=`onBlur`,children:c,className:l,style:u,noValidate:d=!0}){let[f,p]=(0,t.useState)({...i}),[m,h]=(0,t.useState)({}),[g,_]=(0,t.useState)({}),[v,y]=(0,t.useState)(!1),b=(0,t.useRef)(new Map),x=(0,t.useCallback)(e=>{b.current.set(e.name,e)},[]),S=(0,t.useCallback)(e=>{b.current.delete(e)},[]),C=(0,t.useCallback)((t,n)=>{let r=b.current.get(t);if(!r)return{valid:!0};let i=n===void 0?f[t]:n,a=i==null?``:String(i);if(r.required){let t=e.f(a);if(!t.valid)return t}if(r.validate)for(let e of r.validate){let t=e(a);if(!t.valid)return t}return{valid:!0}},[f]),w=(0,t.useCallback)(e=>{let t=C(e);return h(n=>{if(t.valid){let t={...n};return delete t[e],t}return{...n,[e]:t.error}}),t},[C]),T=(0,t.useCallback)(()=>{let e=!0,t={};for(let[n]of b.current){let r=C(n);r.valid||(e=!1,t[n]=r.error)}h(t);let n={};for(let[e]of b.current)n[e]=!0;return _(n),e},[C]),E=(0,t.useCallback)((e,t)=>{p(n=>{let r={...n,[e]:t};return o?.(r),r}),s===`onChange`&&g[e]&&setTimeout(()=>w(e),0)},[o,s,g,w]),D=(0,t.useCallback)((e,t)=>{h(n=>({...n,[e]:t}))},[]),O=(0,t.useCallback)((e,t)=>{_(n=>({...n,[e]:t})),s===`onBlur`&&t&&w(e)},[s,w]),k=(0,t.useCallback)(()=>{p({...i}),h({}),_({}),y(!1)},[i]),A=(0,t.useCallback)(async e=>{if(e.preventDefault(),v||!T())return;y(!0);let t={setSubmitting:y,resetForm:k,setFieldError:D};try{await a?.(f,t)}finally{y(!1)}},[v,T,f,a,k,D]),j=(0,t.useMemo)(()=>({values:f,errors:m,touched:g,registerField:x,unregisterField:S,setFieldValue:E,setFieldError:D,setFieldTouched:O,validateField:w,validateAll:T,resetForm:k,isSubmitting:v}),[f,m,g,x,S,E,D,O,w,T,k,v]);return(0,n.jsx)(r.Provider,{value:j,children:(0,n.jsx)(`form`,{onSubmit:A,noValidate:d,className:`form${l?` ${l}`:``}`,style:u,children:typeof c==`function`?c(j):c})})}function o(e,n){let r=i();(0,t.useEffect)(()=>{if(r)return r.registerField({name:e,validate:n?.validate,required:n?.required}),()=>r.unregisterField(e)},[r,e,n?.validate,n?.required]);let a=(0,t.useCallback)(t=>{r?.setFieldValue(e,t)},[r,e]),o=(0,t.useCallback)(()=>{r?.setFieldTouched(e,!0)},[r,e]);return{value:r?.values[e]??``,error:r?.errors[e],touched:r?.touched[e]??!1,onChange:a,onBlur:o}}Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return o}});
+//# sourceMappingURL=useFormField-Bz4d7m8u.cjs.map

package/dist/useFormField-Bz4d7m8u.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormField-Bz4d7m8u.cjs","names":[],"sources":["../src/components/form/Form/FormContext.ts","../src/components/form/Form/Form.tsx","../src/components/form/Form/useFormField.ts"],"sourcesContent":["import {createContext, useContext} from 'react'\nimport type {FormContextValue} from './Form.types'\n\nexport const FormContext = createContext<FormContextValue | null>(null)\n\n// Read the nearest form context to integrate custom fields with shared state.\nexport function useFormContext(): FormContextValue | null {\n    return useContext(FormContext)\n}\n","import {useState, useRef, useCallback, useMemo} from 'react'\nimport type * as React from 'react'\nimport type {FormProps, FieldRegistration, FormContextValue, FormHelpers} from './Form.types'\nimport {FormContext} from './FormContext'\nimport {validateRequired} from '../../../utils/validators'\nimport type {ValidationResult} from '../../../utils/validators'\nimport './Form.css'\n\n// Coordinate form values, validation state and submit helpers through context.\nexport function Form({\n    initialValues = {},\n    onSubmit,\n    onChange,\n    validationMode = 'onBlur',\n    children,\n    className,\n    style,\n    noValidate = true,\n}: FormProps) {\n    const [values, setValues] = useState<Record<string, unknown>>({...initialValues})\n    const [errors, setErrors] = useState<Record<string, string>>({})\n    const [touched, setTouched] = useState<Record<string, boolean>>({})\n    const [isSubmitting, setIsSubmitting] = useState(false)\n    const fieldsRef = useRef<Map<string, FieldRegistration>>(new Map())\n\n    // Track mounted fields so validation stays aligned with active inputs.\n    const registerField = useCallback((reg: FieldRegistration) => {\n        fieldsRef.current.set(reg.name, reg)\n    }, [])\n\n    const unregisterField = useCallback((name: string) => {\n        fieldsRef.current.delete(name)\n    }, [])\n\n    // Run required and custom validators without mutating visible error state yet.\n    const validateFieldInternal = useCallback(\n        (name: string, val?: unknown): ValidationResult => {\n            const reg = fieldsRef.current.get(name)\n            if (!reg) return {valid: true}\n\n            const fieldValue = val !== undefined ? val : values[name]\n            const strValue = fieldValue != null ? String(fieldValue) : ''\n\n            // Required check\n            if (reg.required) {\n                const reqResult = validateRequired(strValue)\n                if (!reqResult.valid) return reqResult\n            }\n\n            // Custom validators\n            if (reg.validate) {\n                for (const validator of reg.validate) {\n                    const result = validator(strValue)\n                    if (!result.valid) return result\n                }\n            }\n\n            return {valid: true}\n        },\n        [values]\n    )\n\n    // Persist the latest validation result for a single field.\n    const validateField = useCallback(\n        (name: string): ValidationResult => {\n            const result = validateFieldInternal(name)\n            setErrors((prev) => {\n                if (result.valid) {\n                    const next = {...prev}\n                    delete next[name]\n                    return next\n                }\n                return {...prev, [name]: result.error!}\n            })\n            return result\n        },\n        [validateFieldInternal]\n    )\n\n    // Validate every registered field before submit.\n    const validateAll = useCallback((): boolean => {\n        let allValid = true\n        const newErrors: Record<string, string> = {}\n\n        for (const [name] of fieldsRef.current) {\n            const result = validateFieldInternal(name)\n            if (!result.valid) {\n                allValid = false\n                newErrors[name] = result.error!\n            }\n        }\n\n        setErrors(newErrors)\n        // Mark all as touched\n        const allTouched: Record<string, boolean> = {}\n        for (const [name] of fieldsRef.current) {\n            allTouched[name] = true\n        }\n        setTouched(allTouched)\n\n        return allValid\n    }, [validateFieldInternal])\n\n    // Update field values and trigger onChange or validation according to mode.\n    const setFieldValue = useCallback(\n        (name: string, val: unknown) => {\n            setValues((prev) => {\n                const next = {...prev, [name]: val}\n                onChange?.(next)\n                return next\n            })\n\n            if (validationMode === 'onChange' && touched[name]) {\n                // Defer validation to next tick so values are updated\n                setTimeout(() => validateField(name), 0)\n            }\n        },\n        [onChange, validationMode, touched, validateField]\n    )\n\n    const setFieldError = useCallback((name: string, error: string) => {\n        setErrors((prev) => ({...prev, [name]: error}))\n    }, [])\n\n    // Mark fields as touched so blur validation can start surfacing errors.\n    const setFieldTouched = useCallback(\n        (name: string, isTouched: boolean) => {\n            setTouched((prev) => ({...prev, [name]: isTouched}))\n            if (validationMode === 'onBlur' && isTouched) {\n                validateField(name)\n            }\n        },\n        [validationMode, validateField]\n    )\n\n    const resetForm = useCallback(() => {\n        setValues({...initialValues})\n        setErrors({})\n        setTouched({})\n        setIsSubmitting(false)\n    }, [initialValues])\n\n    // Guard submit flow with validation and a single in-flight submission state.\n    const handleSubmit = useCallback(\n        async (e: React.FormEvent<HTMLFormElement>) => {\n            e.preventDefault()\n            if (isSubmitting) return\n\n            const valid = validateAll()\n            if (!valid) return\n\n            setIsSubmitting(true)\n            const helpers: FormHelpers = {\n                setSubmitting: setIsSubmitting,\n                resetForm,\n                setFieldError,\n            }\n\n            try {\n                await onSubmit?.(values, helpers)\n            } finally {\n                setIsSubmitting(false)\n            }\n        },\n        [isSubmitting, validateAll, values, onSubmit, resetForm, setFieldError]\n    )\n\n    // Memoize the public form context to limit downstream re-renders.\n    const ctx = useMemo<FormContextValue>(\n        () => ({\n            values,\n            errors,\n            touched,\n            registerField,\n            unregisterField,\n            setFieldValue,\n            setFieldError,\n            setFieldTouched,\n            validateField,\n            validateAll,\n            resetForm,\n            isSubmitting,\n        }),\n        [\n            values,\n            errors,\n            touched,\n            registerField,\n            unregisterField,\n            setFieldValue,\n            setFieldError,\n            setFieldTouched,\n            validateField,\n            validateAll,\n            resetForm,\n            isSubmitting,\n        ]\n    )\n\n    return (\n        <FormContext.Provider value={ctx}>\n            <form\n                onSubmit={handleSubmit}\n                noValidate={noValidate}\n                className={`form${className ? ` ${className}` : ''}`}\n                style={style}\n            >\n                {typeof children === 'function' ? children(ctx) : children}\n            </form>\n        </FormContext.Provider>\n    )\n}\n","import {useEffect, useCallback} from 'react'\nimport {useFormContext} from './FormContext'\nimport type {ValidatorFn} from '../../../utils/validators'\n\nexport interface UseFormFieldOptions {\n    validate?: ValidatorFn[]\n    required?: boolean\n}\n\nexport interface UseFormFieldReturn {\n    value: unknown\n    error: string | undefined\n    touched: boolean\n    onChange: (value: unknown) => void\n    onBlur: () => void\n}\n\n// Connect a field name to the nearest form context and expose field-level helpers.\nexport function useFormField(name: string, options?: UseFormFieldOptions): UseFormFieldReturn {\n    const ctx = useFormContext()\n\n    // Register the field definition so the form can validate and reset it centrally.\n    useEffect(() => {\n        if (!ctx) return\n        ctx.registerField({\n            name,\n            validate: options?.validate,\n            required: options?.required,\n        })\n        return () => ctx.unregisterField(name)\n    }, [ctx, name, options?.validate, options?.required])\n\n    // Forward value updates into the form state.\n    const onChange = useCallback(\n        (val: unknown) => {\n            ctx?.setFieldValue(name, val)\n        },\n        [ctx, name]\n    )\n\n    // Mark the field as touched when the control loses focus.\n    const onBlur = useCallback(() => {\n        ctx?.setFieldTouched(name, true)\n    }, [ctx, name])\n\n    return {\n        value: ctx?.values[name] ?? '',\n        error: ctx?.errors[name],\n        touched: ctx?.touched[name] ?? false,\n        onChange,\n        onBlur,\n    }\n}\n"],"mappings":"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"}

package/dist/useFormField-jOnRqGD2.js

@@ -0,0 +1,166 @@
+import { f as e } from "./validators-Y1nYXhNR.js";
+import { createContext as t, useCallback as n, useContext as r, useEffect as i, useMemo as a, useRef as o, useState as s } from "react";
+import { jsx as c } from "react/jsx-runtime";
+//#region src/components/form/Form/FormContext.ts
+var l = t(null);
+function u() {
+	return r(l);
+}
+//#endregion
+//#region src/components/form/Form/Form.tsx
+function d({ initialValues: t = {}, onSubmit: r, onChange: i, validationMode: u = "onBlur", children: d, className: f, style: p, noValidate: m = !0 }) {
+	let [h, g] = s({ ...t }), [_, v] = s({}), [y, b] = s({}), [x, S] = s(!1), C = o(/* @__PURE__ */ new Map()), w = n((e) => {
+		C.current.set(e.name, e);
+	}, []), T = n((e) => {
+		C.current.delete(e);
+	}, []), E = n((t, n) => {
+		let r = C.current.get(t);
+		if (!r) return { valid: !0 };
+		let i = n === void 0 ? h[t] : n, a = i == null ? "" : String(i);
+		if (r.required) {
+			let t = e(a);
+			if (!t.valid) return t;
+		}
+		if (r.validate) for (let e of r.validate) {
+			let t = e(a);
+			if (!t.valid) return t;
+		}
+		return { valid: !0 };
+	}, [h]), D = n((e) => {
+		let t = E(e);
+		return v((n) => {
+			if (t.valid) {
+				let t = { ...n };
+				return delete t[e], t;
+			}
+			return {
+				...n,
+				[e]: t.error
+			};
+		}), t;
+	}, [E]), O = n(() => {
+		let e = !0, t = {};
+		for (let [n] of C.current) {
+			let r = E(n);
+			r.valid || (e = !1, t[n] = r.error);
+		}
+		v(t);
+		let n = {};
+		for (let [e] of C.current) n[e] = !0;
+		return b(n), e;
+	}, [E]), k = n((e, t) => {
+		g((n) => {
+			let r = {
+				...n,
+				[e]: t
+			};
+			return i?.(r), r;
+		}), u === "onChange" && y[e] && setTimeout(() => D(e), 0);
+	}, [
+		i,
+		u,
+		y,
+		D
+	]), A = n((e, t) => {
+		v((n) => ({
+			...n,
+			[e]: t
+		}));
+	}, []), j = n((e, t) => {
+		b((n) => ({
+			...n,
+			[e]: t
+		})), u === "onBlur" && t && D(e);
+	}, [u, D]), M = n(() => {
+		g({ ...t }), v({}), b({}), S(!1);
+	}, [t]), N = n(async (e) => {
+		if (e.preventDefault(), x || !O()) return;
+		S(!0);
+		let t = {
+			setSubmitting: S,
+			resetForm: M,
+			setFieldError: A
+		};
+		try {
+			await r?.(h, t);
+		} finally {
+			S(!1);
+		}
+	}, [
+		x,
+		O,
+		h,
+		r,
+		M,
+		A
+	]), P = a(() => ({
+		values: h,
+		errors: _,
+		touched: y,
+		registerField: w,
+		unregisterField: T,
+		setFieldValue: k,
+		setFieldError: A,
+		setFieldTouched: j,
+		validateField: D,
+		validateAll: O,
+		resetForm: M,
+		isSubmitting: x
+	}), [
+		h,
+		_,
+		y,
+		w,
+		T,
+		k,
+		A,
+		j,
+		D,
+		O,
+		M,
+		x
+	]);
+	return /* @__PURE__ */ c(l.Provider, {
+		value: P,
+		children: /* @__PURE__ */ c("form", {
+			onSubmit: N,
+			noValidate: m,
+			className: `form${f ? ` ${f}` : ""}`,
+			style: p,
+			children: typeof d == "function" ? d(P) : d
+		})
+	});
+}
+//#endregion
+//#region src/components/form/Form/useFormField.ts
+function f(e, t) {
+	let r = u();
+	i(() => {
+		if (r) return r.registerField({
+			name: e,
+			validate: t?.validate,
+			required: t?.required
+		}), () => r.unregisterField(e);
+	}, [
+		r,
+		e,
+		t?.validate,
+		t?.required
+	]);
+	let a = n((t) => {
+		r?.setFieldValue(e, t);
+	}, [r, e]), o = n(() => {
+		r?.setFieldTouched(e, !0);
+	}, [r, e]);
+	return {
+		value: r?.values[e] ?? "",
+		error: r?.errors[e],
+		touched: r?.touched[e] ?? !1,
+		onChange: a,
+		onBlur: o
+	};
+}
+//#endregion
+export { d as n, u as r, f as t };
+
+//# sourceMappingURL=useFormField-jOnRqGD2.js.map

package/dist/useFormField-jOnRqGD2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormField-jOnRqGD2.js","names":[],"sources":["../src/components/form/Form/FormContext.ts","../src/components/form/Form/Form.tsx","../src/components/form/Form/useFormField.ts"],"sourcesContent":["import {createContext, useContext} from 'react'\nimport type {FormContextValue} from './Form.types'\n\nexport const FormContext = createContext<FormContextValue | null>(null)\n\n// Read the nearest form context to integrate custom fields with shared state.\nexport function useFormContext(): FormContextValue | null {\n    return useContext(FormContext)\n}\n","import {useState, useRef, useCallback, useMemo} from 'react'\nimport type * as React from 'react'\nimport type {FormProps, FieldRegistration, FormContextValue, FormHelpers} from './Form.types'\nimport {FormContext} from './FormContext'\nimport {validateRequired} from '../../../utils/validators'\nimport type {ValidationResult} from '../../../utils/validators'\nimport './Form.css'\n\n// Coordinate form values, validation state and submit helpers through context.\nexport function Form({\n    initialValues = {},\n    onSubmit,\n    onChange,\n    validationMode = 'onBlur',\n    children,\n    className,\n    style,\n    noValidate = true,\n}: FormProps) {\n    const [values, setValues] = useState<Record<string, unknown>>({...initialValues})\n    const [errors, setErrors] = useState<Record<string, string>>({})\n    const [touched, setTouched] = useState<Record<string, boolean>>({})\n    const [isSubmitting, setIsSubmitting] = useState(false)\n    const fieldsRef = useRef<Map<string, FieldRegistration>>(new Map())\n\n    // Track mounted fields so validation stays aligned with active inputs.\n    const registerField = useCallback((reg: FieldRegistration) => {\n        fieldsRef.current.set(reg.name, reg)\n    }, [])\n\n    const unregisterField = useCallback((name: string) => {\n        fieldsRef.current.delete(name)\n    }, [])\n\n    // Run required and custom validators without mutating visible error state yet.\n    const validateFieldInternal = useCallback(\n        (name: string, val?: unknown): ValidationResult => {\n            const reg = fieldsRef.current.get(name)\n            if (!reg) return {valid: true}\n\n            const fieldValue = val !== undefined ? val : values[name]\n            const strValue = fieldValue != null ? String(fieldValue) : ''\n\n            // Required check\n            if (reg.required) {\n                const reqResult = validateRequired(strValue)\n                if (!reqResult.valid) return reqResult\n            }\n\n            // Custom validators\n            if (reg.validate) {\n                for (const validator of reg.validate) {\n                    const result = validator(strValue)\n                    if (!result.valid) return result\n                }\n            }\n\n            return {valid: true}\n        },\n        [values]\n    )\n\n    // Persist the latest validation result for a single field.\n    const validateField = useCallback(\n        (name: string): ValidationResult => {\n            const result = validateFieldInternal(name)\n            setErrors((prev) => {\n                if (result.valid) {\n                    const next = {...prev}\n                    delete next[name]\n                    return next\n                }\n                return {...prev, [name]: result.error!}\n            })\n            return result\n        },\n        [validateFieldInternal]\n    )\n\n    // Validate every registered field before submit.\n    const validateAll = useCallback((): boolean => {\n        let allValid = true\n        const newErrors: Record<string, string> = {}\n\n        for (const [name] of fieldsRef.current) {\n            const result = validateFieldInternal(name)\n            if (!result.valid) {\n                allValid = false\n                newErrors[name] = result.error!\n            }\n        }\n\n        setErrors(newErrors)\n        // Mark all as touched\n        const allTouched: Record<string, boolean> = {}\n        for (const [name] of fieldsRef.current) {\n            allTouched[name] = true\n        }\n        setTouched(allTouched)\n\n        return allValid\n    }, [validateFieldInternal])\n\n    // Update field values and trigger onChange or validation according to mode.\n    const setFieldValue = useCallback(\n        (name: string, val: unknown) => {\n            setValues((prev) => {\n                const next = {...prev, [name]: val}\n                onChange?.(next)\n                return next\n            })\n\n            if (validationMode === 'onChange' && touched[name]) {\n                // Defer validation to next tick so values are updated\n                setTimeout(() => validateField(name), 0)\n            }\n        },\n        [onChange, validationMode, touched, validateField]\n    )\n\n    const setFieldError = useCallback((name: string, error: string) => {\n        setErrors((prev) => ({...prev, [name]: error}))\n    }, [])\n\n    // Mark fields as touched so blur validation can start surfacing errors.\n    const setFieldTouched = useCallback(\n        (name: string, isTouched: boolean) => {\n            setTouched((prev) => ({...prev, [name]: isTouched}))\n            if (validationMode === 'onBlur' && isTouched) {\n                validateField(name)\n            }\n        },\n        [validationMode, validateField]\n    )\n\n    const resetForm = useCallback(() => {\n        setValues({...initialValues})\n        setErrors({})\n        setTouched({})\n        setIsSubmitting(false)\n    }, [initialValues])\n\n    // Guard submit flow with validation and a single in-flight submission state.\n    const handleSubmit = useCallback(\n        async (e: React.FormEvent<HTMLFormElement>) => {\n            e.preventDefault()\n            if (isSubmitting) return\n\n            const valid = validateAll()\n            if (!valid) return\n\n            setIsSubmitting(true)\n            const helpers: FormHelpers = {\n                setSubmitting: setIsSubmitting,\n                resetForm,\n                setFieldError,\n            }\n\n            try {\n                await onSubmit?.(values, helpers)\n            } finally {\n                setIsSubmitting(false)\n            }\n        },\n        [isSubmitting, validateAll, values, onSubmit, resetForm, setFieldError]\n    )\n\n    // Memoize the public form context to limit downstream re-renders.\n    const ctx = useMemo<FormContextValue>(\n        () => ({\n            values,\n            errors,\n            touched,\n            registerField,\n            unregisterField,\n            setFieldValue,\n            setFieldError,\n            setFieldTouched,\n            validateField,\n            validateAll,\n            resetForm,\n            isSubmitting,\n        }),\n        [\n            values,\n            errors,\n            touched,\n            registerField,\n            unregisterField,\n            setFieldValue,\n            setFieldError,\n            setFieldTouched,\n            validateField,\n            validateAll,\n            resetForm,\n            isSubmitting,\n        ]\n    )\n\n    return (\n        <FormContext.Provider value={ctx}>\n            <form\n                onSubmit={handleSubmit}\n                noValidate={noValidate}\n                className={`form${className ? ` ${className}` : ''}`}\n                style={style}\n            >\n                {typeof children === 'function' ? children(ctx) : children}\n            </form>\n        </FormContext.Provider>\n    )\n}\n","import {useEffect, useCallback} from 'react'\nimport {useFormContext} from './FormContext'\nimport type {ValidatorFn} from '../../../utils/validators'\n\nexport interface UseFormFieldOptions {\n    validate?: ValidatorFn[]\n    required?: boolean\n}\n\nexport interface UseFormFieldReturn {\n    value: unknown\n    error: string | undefined\n    touched: boolean\n    onChange: (value: unknown) => void\n    onBlur: () => void\n}\n\n// Connect a field name to the nearest form context and expose field-level helpers.\nexport function useFormField(name: string, options?: UseFormFieldOptions): UseFormFieldReturn {\n    const ctx = useFormContext()\n\n    // Register the field definition so the form can validate and reset it centrally.\n    useEffect(() => {\n        if (!ctx) return\n        ctx.registerField({\n            name,\n            validate: options?.validate,\n            required: options?.required,\n        })\n        return () => ctx.unregisterField(name)\n    }, [ctx, name, options?.validate, options?.required])\n\n    // Forward value updates into the form state.\n    const onChange = useCallback(\n        (val: unknown) => {\n            ctx?.setFieldValue(name, val)\n        },\n        [ctx, name]\n    )\n\n    // Mark the field as touched when the control loses focus.\n    const onBlur = useCallback(() => {\n        ctx?.setFieldTouched(name, true)\n    }, [ctx, name])\n\n    return {\n        value: ctx?.values[name] ?? '',\n        error: ctx?.errors[name],\n        touched: ctx?.touched[name] ?? false,\n        onChange,\n        onBlur,\n    }\n}\n"],"mappings":"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"}

package/dist/useGhostText-BNcH5o9H.js

@@ -0,0 +1,51 @@
+import { useCallback as e, useMemo as t, useState as n } from "react";
+//#region src/utils/useGhostText.ts
+function r(e) {
+	return typeof e == "string" ? e : String(e);
+}
+function i(e, t, n) {
+	if (!t) return [];
+	let r = t.toLowerCase();
+	return e.filter((e) => n(e).toLowerCase().startsWith(r));
+}
+function a({ options: a, value: o, minChars: s = 2, getLabel: c = r, filter: l }) {
+	let [u, d] = n(0), f = t(() => o.length < s ? [] : l ? l(a, o) : i(a, o, c), [
+		a,
+		o,
+		s,
+		l,
+		c
+	]), p = f.length > 0 ? f[u % f.length] : null, m = p ? c(p) : "", h = m && m.toLowerCase().startsWith(o.toLowerCase()) ? m.slice(o.length) : "", g = e(() => !h || !p ? {
+		value: o,
+		option: null
+	} : {
+		value: o + h,
+		option: p
+	}, [
+		h,
+		p,
+		o
+	]), _ = e(() => {
+		f.length > 1 && d((e) => (e + 1) % f.length);
+	}, [f.length]), v = e(() => {
+		f.length > 1 && d((e) => (e - 1 + f.length) % f.length);
+	}, [f.length]), y = e(() => d(0), []), b = e((e) => (e.key === "Tab" || e.key === "Enter") && h ? (e.preventDefault(), !0) : e.key === "ArrowDown" && f.length > 1 ? (e.preventDefault(), _(), !1) : e.key === "ArrowUp" && f.length > 1 ? (e.preventDefault(), v(), !1) : !1, [
+		h,
+		f.length,
+		_,
+		v
+	]);
+	return {
+		hint: h,
+		accept: g,
+		next: _,
+		prev: v,
+		reset: y,
+		matchCount: f.length,
+		onKeyDown: b
+	};
+}
+//#endregion
+export { a as t };
+
+//# sourceMappingURL=useGhostText-BNcH5o9H.js.map

package/dist/useGhostText-BNcH5o9H.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGhostText-BNcH5o9H.js","names":[],"sources":["../src/utils/useGhostText.ts"],"sourcesContent":["import {useState, useCallback, useMemo} from 'react'\nimport type * as React from 'react'\n\nexport interface GhostTextOptions<T = string> {\n    options: T[]\n    value: string\n    minChars?: number\n    getLabel?: (option: T) => string\n    filter?: (options: T[], input: string) => T[]\n}\n\nexport interface GhostTextReturn<T = string> {\n    /** The ghost suffix to render after the typed text. */\n    hint: string\n    /** Accept the current hint and return the full value. */\n    accept: () => {value: string; option: T | null}\n    /** Cycle to the next matching option. */\n    next: () => void\n    /** Cycle to the previous matching option. */\n    prev: () => void\n    /** Reset the hint index (call on value change). */\n    reset: () => void\n    /** Number of matching options. */\n    matchCount: number\n    /** Handle keyboard events — Tab/Enter accept, arrows cycle, Escape resets. */\n    onKeyDown: (e: React.KeyboardEvent) => boolean\n}\n\nfunction defaultGetLabel<T>(option: T): string {\n    return typeof option === 'string' ? option : String(option)\n}\n\nfunction defaultFilter<T>(options: T[], input: string, getLabel: (o: T) => string): T[] {\n    if (!input) return []\n    const lower = input.toLowerCase()\n    return options.filter((o) => getLabel(o).toLowerCase().startsWith(lower))\n}\n\n// Manage inline ghost-text suggestions for any text input.\nexport function useGhostText<T = string>({\n    options,\n    value,\n    minChars = 2,\n    getLabel = defaultGetLabel,\n    filter,\n}: GhostTextOptions<T>): GhostTextReturn<T> {\n    const [hintIndex, setHintIndex] = useState(0)\n\n    const filtered = useMemo(() => {\n        if (value.length < minChars) return []\n        if (filter) return filter(options, value)\n        return defaultFilter(options, value, getLabel)\n    }, [options, value, minChars, filter, getLabel])\n\n    const current = filtered.length > 0 ? filtered[hintIndex % filtered.length] : null\n    const fullLabel = current ? getLabel(current) : ''\n    const hint =\n        fullLabel && fullLabel.toLowerCase().startsWith(value.toLowerCase()) ? fullLabel.slice(value.length) : ''\n\n    const accept = useCallback(() => {\n        if (!hint || !current) return {value, option: null}\n        return {value: value + hint, option: current}\n    }, [hint, current, value])\n\n    const next = useCallback(() => {\n        if (filtered.length > 1) setHintIndex((i) => (i + 1) % filtered.length)\n    }, [filtered.length])\n\n    const prev = useCallback(() => {\n        if (filtered.length > 1) setHintIndex((i) => (i - 1 + filtered.length) % filtered.length)\n    }, [filtered.length])\n\n    const reset = useCallback(() => setHintIndex(0), [])\n\n    const onKeyDown = useCallback(\n        (e: React.KeyboardEvent): boolean => {\n            if ((e.key === 'Tab' || e.key === 'Enter') && hint) {\n                e.preventDefault()\n                return true // signal: caller should accept\n            }\n            if (e.key === 'ArrowDown' && filtered.length > 1) {\n                e.preventDefault()\n                next()\n                return false\n            }\n            if (e.key === 'ArrowUp' && filtered.length > 1) {\n                e.preventDefault()\n                prev()\n                return false\n            }\n            return false\n        },\n        [hint, filtered.length, next, prev]\n    )\n\n    return {hint, accept, next, prev, reset, matchCount: filtered.length, onKeyDown}\n}\n"],"mappings":";;AA4BA,SAAS,EAAmB,GAAmB;AAC3C,QAAO,OAAO,KAAW,WAAW,IAAS,OAAO,EAAO;;AAG/D,SAAS,EAAiB,GAAc,GAAe,GAAiC;AACpF,KAAI,CAAC,EAAO,QAAO,EAAE;CACrB,IAAM,IAAQ,EAAM,aAAa;AACjC,QAAO,EAAQ,QAAQ,MAAM,EAAS,EAAE,CAAC,aAAa,CAAC,WAAW,EAAM,CAAC;;AAI7E,SAAgB,EAAyB,EACrC,YACA,UACA,cAAW,GACX,cAAW,GACX,aACwC;CACxC,IAAM,CAAC,GAAW,KAAgB,EAAS,EAAE,EAEvC,IAAW,QACT,EAAM,SAAS,IAAiB,EAAE,GAClC,IAAe,EAAO,GAAS,EAAM,GAClC,EAAc,GAAS,GAAO,EAAS,EAC/C;EAAC;EAAS;EAAO;EAAU;EAAQ;EAAS,CAAC,EAE1C,IAAU,EAAS,SAAS,IAAI,EAAS,IAAY,EAAS,UAAU,MACxE,IAAY,IAAU,EAAS,EAAQ,GAAG,IAC1C,IACF,KAAa,EAAU,aAAa,CAAC,WAAW,EAAM,aAAa,CAAC,GAAG,EAAU,MAAM,EAAM,OAAO,GAAG,IAErG,IAAS,QACP,CAAC,KAAQ,CAAC,IAAgB;EAAC;EAAO,QAAQ;EAAK,GAC5C;EAAC,OAAO,IAAQ;EAAM,QAAQ;EAAQ,EAC9C;EAAC;EAAM;EAAS;EAAM,CAAC,EAEpB,IAAO,QAAkB;AAC3B,EAAI,EAAS,SAAS,KAAG,GAAc,OAAO,IAAI,KAAK,EAAS,OAAO;IACxE,CAAC,EAAS,OAAO,CAAC,EAEf,IAAO,QAAkB;AAC3B,EAAI,EAAS,SAAS,KAAG,GAAc,OAAO,IAAI,IAAI,EAAS,UAAU,EAAS,OAAO;IAC1F,CAAC,EAAS,OAAO,CAAC,EAEf,IAAQ,QAAkB,EAAa,EAAE,EAAE,EAAE,CAAC,EAE9C,IAAY,GACb,OACQ,EAAE,QAAQ,SAAS,EAAE,QAAQ,YAAY,KAC1C,EAAE,gBAAgB,EACX,MAEP,EAAE,QAAQ,eAAe,EAAS,SAAS,KAC3C,EAAE,gBAAgB,EAClB,GAAM,EACC,MAEP,EAAE,QAAQ,aAAa,EAAS,SAAS,KACzC,EAAE,gBAAgB,EAClB,GAAM,EACC,MAEJ,IAEX;EAAC;EAAM,EAAS;EAAQ;EAAM;EAAK,CACtC;AAED,QAAO;EAAC;EAAM;EAAQ;EAAM;EAAM;EAAO,YAAY,EAAS;EAAQ;EAAU"}

package/dist/useGhostText-CoYhBGCg.cjs

@@ -0,0 +1,2 @@
+let e=require(`react`);function t(e){return typeof e==`string`?e:String(e)}function n(e,t,n){if(!t)return[];let r=t.toLowerCase();return e.filter(e=>n(e).toLowerCase().startsWith(r))}function r({options:r,value:i,minChars:a=2,getLabel:o=t,filter:s}){let[c,l]=(0,e.useState)(0),u=(0,e.useMemo)(()=>i.length<a?[]:s?s(r,i):n(r,i,o),[r,i,a,s,o]),d=u.length>0?u[c%u.length]:null,f=d?o(d):``,p=f&&f.toLowerCase().startsWith(i.toLowerCase())?f.slice(i.length):``,m=(0,e.useCallback)(()=>!p||!d?{value:i,option:null}:{value:i+p,option:d},[p,d,i]),h=(0,e.useCallback)(()=>{u.length>1&&l(e=>(e+1)%u.length)},[u.length]),g=(0,e.useCallback)(()=>{u.length>1&&l(e=>(e-1+u.length)%u.length)},[u.length]),_=(0,e.useCallback)(()=>l(0),[]),v=(0,e.useCallback)(e=>(e.key===`Tab`||e.key===`Enter`)&&p?(e.preventDefault(),!0):e.key===`ArrowDown`&&u.length>1?(e.preventDefault(),h(),!1):e.key===`ArrowUp`&&u.length>1?(e.preventDefault(),g(),!1):!1,[p,u.length,h,g]);return{hint:p,accept:m,next:h,prev:g,reset:_,matchCount:u.length,onKeyDown:v}}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return r}});
+//# sourceMappingURL=useGhostText-CoYhBGCg.cjs.map

package/dist/useGhostText-CoYhBGCg.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGhostText-CoYhBGCg.cjs","names":[],"sources":["../src/utils/useGhostText.ts"],"sourcesContent":["import {useState, useCallback, useMemo} from 'react'\nimport type * as React from 'react'\n\nexport interface GhostTextOptions<T = string> {\n    options: T[]\n    value: string\n    minChars?: number\n    getLabel?: (option: T) => string\n    filter?: (options: T[], input: string) => T[]\n}\n\nexport interface GhostTextReturn<T = string> {\n    /** The ghost suffix to render after the typed text. */\n    hint: string\n    /** Accept the current hint and return the full value. */\n    accept: () => {value: string; option: T | null}\n    /** Cycle to the next matching option. */\n    next: () => void\n    /** Cycle to the previous matching option. */\n    prev: () => void\n    /** Reset the hint index (call on value change). */\n    reset: () => void\n    /** Number of matching options. */\n    matchCount: number\n    /** Handle keyboard events — Tab/Enter accept, arrows cycle, Escape resets. */\n    onKeyDown: (e: React.KeyboardEvent) => boolean\n}\n\nfunction defaultGetLabel<T>(option: T): string {\n    return typeof option === 'string' ? option : String(option)\n}\n\nfunction defaultFilter<T>(options: T[], input: string, getLabel: (o: T) => string): T[] {\n    if (!input) return []\n    const lower = input.toLowerCase()\n    return options.filter((o) => getLabel(o).toLowerCase().startsWith(lower))\n}\n\n// Manage inline ghost-text suggestions for any text input.\nexport function useGhostText<T = string>({\n    options,\n    value,\n    minChars = 2,\n    getLabel = defaultGetLabel,\n    filter,\n}: GhostTextOptions<T>): GhostTextReturn<T> {\n    const [hintIndex, setHintIndex] = useState(0)\n\n    const filtered = useMemo(() => {\n        if (value.length < minChars) return []\n        if (filter) return filter(options, value)\n        return defaultFilter(options, value, getLabel)\n    }, [options, value, minChars, filter, getLabel])\n\n    const current = filtered.length > 0 ? filtered[hintIndex % filtered.length] : null\n    const fullLabel = current ? getLabel(current) : ''\n    const hint =\n        fullLabel && fullLabel.toLowerCase().startsWith(value.toLowerCase()) ? fullLabel.slice(value.length) : ''\n\n    const accept = useCallback(() => {\n        if (!hint || !current) return {value, option: null}\n        return {value: value + hint, option: current}\n    }, [hint, current, value])\n\n    const next = useCallback(() => {\n        if (filtered.length > 1) setHintIndex((i) => (i + 1) % filtered.length)\n    }, [filtered.length])\n\n    const prev = useCallback(() => {\n        if (filtered.length > 1) setHintIndex((i) => (i - 1 + filtered.length) % filtered.length)\n    }, [filtered.length])\n\n    const reset = useCallback(() => setHintIndex(0), [])\n\n    const onKeyDown = useCallback(\n        (e: React.KeyboardEvent): boolean => {\n            if ((e.key === 'Tab' || e.key === 'Enter') && hint) {\n                e.preventDefault()\n                return true // signal: caller should accept\n            }\n            if (e.key === 'ArrowDown' && filtered.length > 1) {\n                e.preventDefault()\n                next()\n                return false\n            }\n            if (e.key === 'ArrowUp' && filtered.length > 1) {\n                e.preventDefault()\n                prev()\n                return false\n            }\n            return false\n        },\n        [hint, filtered.length, next, prev]\n    )\n\n    return {hint, accept, next, prev, reset, matchCount: filtered.length, onKeyDown}\n}\n"],"mappings":"uBA4BA,SAAS,EAAmB,EAAmB,CAC3C,OAAO,OAAO,GAAW,SAAW,EAAS,OAAO,EAAO,CAG/D,SAAS,EAAiB,EAAc,EAAe,EAAiC,CACpF,GAAI,CAAC,EAAO,MAAO,EAAE,CACrB,IAAM,EAAQ,EAAM,aAAa,CACjC,OAAO,EAAQ,OAAQ,GAAM,EAAS,EAAE,CAAC,aAAa,CAAC,WAAW,EAAM,CAAC,CAI7E,SAAgB,EAAyB,CACrC,UACA,QACA,WAAW,EACX,WAAW,EACX,UACwC,CACxC,GAAM,CAAC,EAAW,IAAA,EAAA,EAAA,UAAyB,EAAE,CAEvC,GAAA,EAAA,EAAA,aACE,EAAM,OAAS,EAAiB,EAAE,CAClC,EAAe,EAAO,EAAS,EAAM,CAClC,EAAc,EAAS,EAAO,EAAS,CAC/C,CAAC,EAAS,EAAO,EAAU,EAAQ,EAAS,CAAC,CAE1C,EAAU,EAAS,OAAS,EAAI,EAAS,EAAY,EAAS,QAAU,KACxE,EAAY,EAAU,EAAS,EAAQ,CAAG,GAC1C,EACF,GAAa,EAAU,aAAa,CAAC,WAAW,EAAM,aAAa,CAAC,CAAG,EAAU,MAAM,EAAM,OAAO,CAAG,GAErG,GAAA,EAAA,EAAA,iBACE,CAAC,GAAQ,CAAC,EAAgB,CAAC,QAAO,OAAQ,KAAK,CAC5C,CAAC,MAAO,EAAQ,EAAM,OAAQ,EAAQ,CAC9C,CAAC,EAAM,EAAS,EAAM,CAAC,CAEpB,GAAA,EAAA,EAAA,iBAAyB,CACvB,EAAS,OAAS,GAAG,EAAc,IAAO,EAAI,GAAK,EAAS,OAAO,EACxE,CAAC,EAAS,OAAO,CAAC,CAEf,GAAA,EAAA,EAAA,iBAAyB,CACvB,EAAS,OAAS,GAAG,EAAc,IAAO,EAAI,EAAI,EAAS,QAAU,EAAS,OAAO,EAC1F,CAAC,EAAS,OAAO,CAAC,CAEf,GAAA,EAAA,EAAA,iBAA0B,EAAa,EAAE,CAAE,EAAE,CAAC,CAE9C,GAAA,EAAA,EAAA,aACD,IACQ,EAAE,MAAQ,OAAS,EAAE,MAAQ,UAAY,GAC1C,EAAE,gBAAgB,CACX,IAEP,EAAE,MAAQ,aAAe,EAAS,OAAS,GAC3C,EAAE,gBAAgB,CAClB,GAAM,CACC,IAEP,EAAE,MAAQ,WAAa,EAAS,OAAS,GACzC,EAAE,gBAAgB,CAClB,GAAM,CACC,IAEJ,GAEX,CAAC,EAAM,EAAS,OAAQ,EAAM,EAAK,CACtC,CAED,MAAO,CAAC,OAAM,SAAQ,OAAM,OAAM,QAAO,WAAY,EAAS,OAAQ,YAAU"}

package/dist/useInteractionEffect-B5_UpgTt.js

@@ -0,0 +1,40 @@
+import { useCallback as e, useRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/utils/useInteractionEffect.tsx
+function r(e, t, n) {
+	let r = t.getBoundingClientRect(), i = Math.max(r.width, r.height) * 1.75, a = i / 2, o = document.createElement("span"), s = n.centered || n.clientX === void 0 ? r.width / 2 - a : n.clientX - r.left - a, c = n.centered || n.clientY === void 0 ? r.height / 2 - a : n.clientY - r.top - a;
+	o.className = "click-effect-wave", o.style.width = `${i}px`, o.style.height = `${i}px`, o.style.left = `${s}px`, o.style.top = `${c}px`, n.color && o.style.setProperty("--click-effect-color", n.color), e.appendChild(o), o.addEventListener("animationend", () => o.remove(), { once: !0 });
+}
+function i({ effect: i = "ripple", disabled: a = !1, centered: o = !1, color: s } = {}) {
+	let c = t(null), l = i === "ripple" && !a, u = e((e) => {
+		!l || !e || !c.current || r(c.current, e, {
+			centered: !0,
+			color: s
+		});
+	}, [s, l]), d = e((e) => {
+		!l || !c.current || e.pointerType === "mouse" && e.button !== 0 || r(c.current, e.currentTarget, {
+			centered: o,
+			color: s,
+			clientX: e.clientX,
+			clientY: e.clientY
+		});
+	}, [
+		o,
+		s,
+		l
+	]);
+	return {
+		effectClassName: l ? "click-effect-root" : void 0,
+		effectLayer: l ? /* @__PURE__ */ n("span", {
+			ref: c,
+			className: "click-effect-layer",
+			"aria-hidden": "true"
+		}) : null,
+		handlePointerDown: d,
+		triggerEffect: u
+	};
+}
+//#endregion
+export { i as t };
+
+//# sourceMappingURL=useInteractionEffect-B5_UpgTt.js.map

package/dist/useInteractionEffect-B5_UpgTt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInteractionEffect-B5_UpgTt.js","names":[],"sources":["../src/utils/useInteractionEffect.tsx"],"sourcesContent":["import {useCallback, useRef} from 'react'\nimport type {PointerEvent, ReactElement} from 'react'\n\nexport type MineralClickEffect = 'none' | 'ripple'\n\nexport interface UseInteractionEffectOptions {\n    effect?: MineralClickEffect\n    disabled?: boolean\n    centered?: boolean\n    color?: string\n}\n\nexport interface UseInteractionEffectResult<T extends HTMLElement> {\n    effectClassName?: string\n    effectLayer: ReactElement | null\n    handlePointerDown: (event: PointerEvent<T>) => void\n    triggerEffect: (target: T | null) => void\n}\n\ninterface RippleOptions {\n    centered: boolean\n    color?: string\n    clientX?: number\n    clientY?: number\n}\n\n// Render and position a ripple wave inside the dedicated effect layer.\nfunction appendRipple(layer: HTMLSpanElement, host: HTMLElement, options: RippleOptions) {\n    const rect = host.getBoundingClientRect()\n    const size = Math.max(rect.width, rect.height) * 1.75\n    const radius = size / 2\n    const wave = document.createElement('span')\n    const x =\n        options.centered || options.clientX === undefined\n            ? rect.width / 2 - radius\n            : options.clientX - rect.left - radius\n    const y =\n        options.centered || options.clientY === undefined\n            ? rect.height / 2 - radius\n            : options.clientY - rect.top - radius\n\n    wave.className = 'click-effect-wave'\n    wave.style.width = `${size}px`\n    wave.style.height = `${size}px`\n    wave.style.left = `${x}px`\n    wave.style.top = `${y}px`\n\n    if (options.color) {\n        wave.style.setProperty('--click-effect-color', options.color)\n    }\n\n    layer.appendChild(wave)\n    wave.addEventListener('animationend', () => wave.remove(), {once: true})\n}\n\n// Attach a lightweight click feedback effect without coupling it to a specific component.\nexport function useInteractionEffect<T extends HTMLElement = HTMLElement>({\n    effect = 'ripple',\n    disabled = false,\n    centered = false,\n    color,\n}: UseInteractionEffectOptions = {}): UseInteractionEffectResult<T> {\n    const layerRef = useRef<HTMLSpanElement>(null)\n    const enabled = effect === 'ripple' && !disabled\n\n    // Trigger a centered ripple for keyboard-driven or programmatic actions.\n    const triggerEffect = useCallback(\n        (target: T | null) => {\n            if (!enabled || !target || !layerRef.current) {\n                return\n            }\n\n            appendRipple(layerRef.current, target, {centered: true, color})\n        },\n        [color, enabled]\n    )\n\n    // Start the ripple from the actual pointer position when possible.\n    const handlePointerDown = useCallback(\n        (event: PointerEvent<T>) => {\n            if (!enabled || !layerRef.current) {\n                return\n            }\n\n            if (event.pointerType === 'mouse' && event.button !== 0) {\n                return\n            }\n\n            appendRipple(layerRef.current, event.currentTarget, {\n                centered,\n                color,\n                clientX: event.clientX,\n                clientY: event.clientY,\n            })\n        },\n        [centered, color, enabled]\n    )\n\n    return {\n        effectClassName: enabled ? 'click-effect-root' : undefined,\n        effectLayer: enabled ? <span ref={layerRef} className=\"click-effect-layer\" aria-hidden=\"true\" /> : null,\n        handlePointerDown,\n        triggerEffect,\n    }\n}\n"],"mappings":";;;AA2BA,SAAS,EAAa,GAAwB,GAAmB,GAAwB;CACrF,IAAM,IAAO,EAAK,uBAAuB,EACnC,IAAO,KAAK,IAAI,EAAK,OAAO,EAAK,OAAO,GAAG,MAC3C,IAAS,IAAO,GAChB,IAAO,SAAS,cAAc,OAAO,EACrC,IACF,EAAQ,YAAY,EAAQ,YAAY,KAAA,IAClC,EAAK,QAAQ,IAAI,IACjB,EAAQ,UAAU,EAAK,OAAO,GAClC,IACF,EAAQ,YAAY,EAAQ,YAAY,KAAA,IAClC,EAAK,SAAS,IAAI,IAClB,EAAQ,UAAU,EAAK,MAAM;AAavC,CAXA,EAAK,YAAY,qBACjB,EAAK,MAAM,QAAQ,GAAG,EAAK,KAC3B,EAAK,MAAM,SAAS,GAAG,EAAK,KAC5B,EAAK,MAAM,OAAO,GAAG,EAAE,KACvB,EAAK,MAAM,MAAM,GAAG,EAAE,KAElB,EAAQ,SACR,EAAK,MAAM,YAAY,wBAAwB,EAAQ,MAAM,EAGjE,EAAM,YAAY,EAAK,EACvB,EAAK,iBAAiB,sBAAsB,EAAK,QAAQ,EAAE,EAAC,MAAM,IAAK,CAAC;;AAI5E,SAAgB,EAA0D,EACtE,YAAS,UACT,cAAW,IACX,cAAW,IACX,aAC6B,EAAE,EAAiC;CAChE,IAAM,IAAW,EAAwB,KAAK,EACxC,IAAU,MAAW,YAAY,CAAC,GAGlC,IAAgB,GACjB,MAAqB;AACd,GAAC,KAAW,CAAC,KAAU,CAAC,EAAS,WAIrC,EAAa,EAAS,SAAS,GAAQ;GAAC,UAAU;GAAM;GAAM,CAAC;IAEnE,CAAC,GAAO,EAAQ,CACnB,EAGK,IAAoB,GACrB,MAA2B;AACpB,GAAC,KAAW,CAAC,EAAS,WAItB,EAAM,gBAAgB,WAAW,EAAM,WAAW,KAItD,EAAa,EAAS,SAAS,EAAM,eAAe;GAChD;GACA;GACA,SAAS,EAAM;GACf,SAAS,EAAM;GAClB,CAAC;IAEN;EAAC;EAAU;EAAO;EAAQ,CAC7B;AAED,QAAO;EACH,iBAAiB,IAAU,sBAAsB,KAAA;EACjD,aAAa,IAAU,kBAAC,QAAD;GAAM,KAAK;GAAU,WAAU;GAAqB,eAAY;GAAS,CAAA,GAAG;EACnG;EACA;EACH"}

package/dist/useInteractionEffect-BaJeiUns.cjs

@@ -0,0 +1,2 @@
+let e=require(`react`),t=require(`react/jsx-runtime`);function n(e,t,n){let r=t.getBoundingClientRect(),i=Math.max(r.width,r.height)*1.75,a=i/2,o=document.createElement(`span`),s=n.centered||n.clientX===void 0?r.width/2-a:n.clientX-r.left-a,c=n.centered||n.clientY===void 0?r.height/2-a:n.clientY-r.top-a;o.className=`click-effect-wave`,o.style.width=`${i}px`,o.style.height=`${i}px`,o.style.left=`${s}px`,o.style.top=`${c}px`,n.color&&o.style.setProperty(`--click-effect-color`,n.color),e.appendChild(o),o.addEventListener(`animationend`,()=>o.remove(),{once:!0})}function r({effect:r=`ripple`,disabled:i=!1,centered:a=!1,color:o}={}){let s=(0,e.useRef)(null),c=r===`ripple`&&!i,l=(0,e.useCallback)(e=>{!c||!e||!s.current||n(s.current,e,{centered:!0,color:o})},[o,c]),u=(0,e.useCallback)(e=>{!c||!s.current||e.pointerType===`mouse`&&e.button!==0||n(s.current,e.currentTarget,{centered:a,color:o,clientX:e.clientX,clientY:e.clientY})},[a,o,c]);return{effectClassName:c?`click-effect-root`:void 0,effectLayer:c?(0,t.jsx)(`span`,{ref:s,className:`click-effect-layer`,"aria-hidden":`true`}):null,handlePointerDown:u,triggerEffect:l}}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return r}});
+//# sourceMappingURL=useInteractionEffect-BaJeiUns.cjs.map

package/dist/useInteractionEffect-BaJeiUns.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInteractionEffect-BaJeiUns.cjs","names":[],"sources":["../src/utils/useInteractionEffect.tsx"],"sourcesContent":["import {useCallback, useRef} from 'react'\nimport type {PointerEvent, ReactElement} from 'react'\n\nexport type MineralClickEffect = 'none' | 'ripple'\n\nexport interface UseInteractionEffectOptions {\n    effect?: MineralClickEffect\n    disabled?: boolean\n    centered?: boolean\n    color?: string\n}\n\nexport interface UseInteractionEffectResult<T extends HTMLElement> {\n    effectClassName?: string\n    effectLayer: ReactElement | null\n    handlePointerDown: (event: PointerEvent<T>) => void\n    triggerEffect: (target: T | null) => void\n}\n\ninterface RippleOptions {\n    centered: boolean\n    color?: string\n    clientX?: number\n    clientY?: number\n}\n\n// Render and position a ripple wave inside the dedicated effect layer.\nfunction appendRipple(layer: HTMLSpanElement, host: HTMLElement, options: RippleOptions) {\n    const rect = host.getBoundingClientRect()\n    const size = Math.max(rect.width, rect.height) * 1.75\n    const radius = size / 2\n    const wave = document.createElement('span')\n    const x =\n        options.centered || options.clientX === undefined\n            ? rect.width / 2 - radius\n            : options.clientX - rect.left - radius\n    const y =\n        options.centered || options.clientY === undefined\n            ? rect.height / 2 - radius\n            : options.clientY - rect.top - radius\n\n    wave.className = 'click-effect-wave'\n    wave.style.width = `${size}px`\n    wave.style.height = `${size}px`\n    wave.style.left = `${x}px`\n    wave.style.top = `${y}px`\n\n    if (options.color) {\n        wave.style.setProperty('--click-effect-color', options.color)\n    }\n\n    layer.appendChild(wave)\n    wave.addEventListener('animationend', () => wave.remove(), {once: true})\n}\n\n// Attach a lightweight click feedback effect without coupling it to a specific component.\nexport function useInteractionEffect<T extends HTMLElement = HTMLElement>({\n    effect = 'ripple',\n    disabled = false,\n    centered = false,\n    color,\n}: UseInteractionEffectOptions = {}): UseInteractionEffectResult<T> {\n    const layerRef = useRef<HTMLSpanElement>(null)\n    const enabled = effect === 'ripple' && !disabled\n\n    // Trigger a centered ripple for keyboard-driven or programmatic actions.\n    const triggerEffect = useCallback(\n        (target: T | null) => {\n            if (!enabled || !target || !layerRef.current) {\n                return\n            }\n\n            appendRipple(layerRef.current, target, {centered: true, color})\n        },\n        [color, enabled]\n    )\n\n    // Start the ripple from the actual pointer position when possible.\n    const handlePointerDown = useCallback(\n        (event: PointerEvent<T>) => {\n            if (!enabled || !layerRef.current) {\n                return\n            }\n\n            if (event.pointerType === 'mouse' && event.button !== 0) {\n                return\n            }\n\n            appendRipple(layerRef.current, event.currentTarget, {\n                centered,\n                color,\n                clientX: event.clientX,\n                clientY: event.clientY,\n            })\n        },\n        [centered, color, enabled]\n    )\n\n    return {\n        effectClassName: enabled ? 'click-effect-root' : undefined,\n        effectLayer: enabled ? <span ref={layerRef} className=\"click-effect-layer\" aria-hidden=\"true\" /> : null,\n        handlePointerDown,\n        triggerEffect,\n    }\n}\n"],"mappings":"sDA2BA,SAAS,EAAa,EAAwB,EAAmB,EAAwB,CACrF,IAAM,EAAO,EAAK,uBAAuB,CACnC,EAAO,KAAK,IAAI,EAAK,MAAO,EAAK,OAAO,CAAG,KAC3C,EAAS,EAAO,EAChB,EAAO,SAAS,cAAc,OAAO,CACrC,EACF,EAAQ,UAAY,EAAQ,UAAY,IAAA,GAClC,EAAK,MAAQ,EAAI,EACjB,EAAQ,QAAU,EAAK,KAAO,EAClC,EACF,EAAQ,UAAY,EAAQ,UAAY,IAAA,GAClC,EAAK,OAAS,EAAI,EAClB,EAAQ,QAAU,EAAK,IAAM,EAEvC,EAAK,UAAY,oBACjB,EAAK,MAAM,MAAQ,GAAG,EAAK,IAC3B,EAAK,MAAM,OAAS,GAAG,EAAK,IAC5B,EAAK,MAAM,KAAO,GAAG,EAAE,IACvB,EAAK,MAAM,IAAM,GAAG,EAAE,IAElB,EAAQ,OACR,EAAK,MAAM,YAAY,uBAAwB,EAAQ,MAAM,CAGjE,EAAM,YAAY,EAAK,CACvB,EAAK,iBAAiB,mBAAsB,EAAK,QAAQ,CAAE,CAAC,KAAM,GAAK,CAAC,CAI5E,SAAgB,EAA0D,CACtE,SAAS,SACT,WAAW,GACX,WAAW,GACX,SAC6B,EAAE,CAAiC,CAChE,IAAM,GAAA,EAAA,EAAA,QAAmC,KAAK,CACxC,EAAU,IAAW,UAAY,CAAC,EAGlC,GAAA,EAAA,EAAA,aACD,GAAqB,CACd,CAAC,GAAW,CAAC,GAAU,CAAC,EAAS,SAIrC,EAAa,EAAS,QAAS,EAAQ,CAAC,SAAU,GAAM,QAAM,CAAC,EAEnE,CAAC,EAAO,EAAQ,CACnB,CAGK,GAAA,EAAA,EAAA,aACD,GAA2B,CACpB,CAAC,GAAW,CAAC,EAAS,SAItB,EAAM,cAAgB,SAAW,EAAM,SAAW,GAItD,EAAa,EAAS,QAAS,EAAM,cAAe,CAChD,WACA,QACA,QAAS,EAAM,QACf,QAAS,EAAM,QAClB,CAAC,EAEN,CAAC,EAAU,EAAO,EAAQ,CAC7B,CAED,MAAO,CACH,gBAAiB,EAAU,oBAAsB,IAAA,GACjD,YAAa,GAAU,EAAA,EAAA,KAAC,OAAD,CAAM,IAAK,EAAU,UAAU,qBAAqB,cAAY,OAAS,CAAA,CAAG,KACnG,oBACA,gBACH"}

package/dist/useKeyboardNav-CmUKtJag.js

@@ -0,0 +1,43 @@
+import { useCallback as e, useState as t } from "react";
+//#region src/utils/useKeyboardNav.ts
+function n({ itemCount: n, onSelect: r, onClose: i, isOpen: a, loop: o = !0 }) {
+	let [s, c] = t(-1);
+	return {
+		activeIndex: s,
+		setActiveIndex: c,
+		resetIndex: e(() => c(-1), []),
+		onKeyDown: e((e) => {
+			if (!(!a || n === 0)) switch (e.key) {
+				case "ArrowDown":
+					e.preventDefault(), c((e) => e >= n - 1 ? o ? 0 : e : e + 1);
+					break;
+				case "ArrowUp":
+					e.preventDefault(), c((e) => e <= 0 ? o ? n - 1 : 0 : e - 1);
+					break;
+				case "Enter":
+					e.preventDefault(), s >= 0 && s < n && r(s);
+					break;
+				case "Escape":
+					e.preventDefault(), i();
+					break;
+				case "Home":
+					e.preventDefault(), c(0);
+					break;
+				case "End":
+					e.preventDefault(), c(n - 1);
+					break;
+			}
+		}, [
+			a,
+			n,
+			s,
+			r,
+			i,
+			o
+		])
+	};
+}
+//#endregion
+export { n as t };
+
+//# sourceMappingURL=useKeyboardNav-CmUKtJag.js.map