@fayegram-ai/faye-ui 0.0.0-stage → 0.1.0

package/dist/overlays/tooltip.js

@@ -0,0 +1,103 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tooltip as Base } from '@base-ui/react/tooltip';
+import { styledPart } from '@fayegram-ai/faye-ui/provider/parts';
+import { createContext, forwardRef, useContext, useEffect, useId, useMemo, useRef, useState } from 'react';
+import { PortalTheme, useEnvironment } from '@fayegram-ai/faye-ui/provider/provider';
+import './tooltip.css';
+import { usePopupScrollRef } from './_popup-scroll.js';
+const DescriptionContext = createContext(undefined);
+const AccessibleRoot = props => {
+    const generatedId = useId(), [descriptionId, register] = useState(undefined);
+    const value = useMemo(() => ({ generatedId, descriptionId, register }), [generatedId, descriptionId]);
+    return _jsx(DescriptionContext.Provider, { value: value, children: _jsx(Base.Root, { ...props }) });
+};
+const AccessibleTrigger = props => {
+    const context = useContext(DescriptionContext);
+    const describedBy = [props['aria-describedby'], context?.descriptionId].filter(Boolean).join(' ') || undefined;
+    return _jsx(Base.Trigger, { ...props, "aria-describedby": describedBy });
+};
+const AccessiblePopup = forwardRef((props, ref) => {
+    const context = useContext(DescriptionContext), fallbackId = useId();
+    const id = props.id ?? context?.generatedId ?? fallbackId;
+    const register = context?.register;
+    useEffect(() => { register?.(id); return () => register?.(undefined); }, [register, id]);
+    return _jsx(Base.Popup, { ...props, ref: usePopupScrollRef(ref), id: id, role: props.role ?? 'tooltip' });
+});
+function Portal({ children, container, ...props }) { const environment = useEnvironment(); return _jsx(Base.Portal, { ...props, container: container ?? environment.portalContainer ?? environment.ownerDocument?.body, children: _jsx(PortalTheme, { children: children }) }); }
+export const Tooltip = {
+    Provider: Base.Provider,
+    Root: AccessibleRoot,
+    Trigger: styledPart(AccessibleTrigger, 'tooltip', 'trigger'),
+    Positioner: styledPart(Base.Positioner, 'tooltip', 'positioner', { positionMethod: 'fixed', sideOffset: 6 }),
+    Popup: styledPart(AccessiblePopup, 'tooltip', 'popup'),
+    Arrow: styledPart(Base.Arrow, 'tooltip', 'arrow'),
+    Portal,
+};
+/** Touch hold supplements the existing hover/focus/dismissal engine. A normal tap still activates its control. */
+export function TouchTooltip({ children, content, open, defaultOpen = false, onOpenChange, disabled = false, longPressDelay = 600, touchCloseDelay = 1500, moveTolerance = 10, triggerProps, positionerProps, popupProps }) {
+    const controlled = useRef(open !== undefined);
+    if (controlled.current !== (open !== undefined))
+        throw new Error('A touch tooltip changed controlledness');
+    if (![longPressDelay, touchCloseDelay, moveTolerance].every(value => Number.isFinite(value) && value >= 0))
+        throw new RangeError('Invalid touch tooltip timing');
+    const inactive = disabled || Boolean(triggerProps?.disabled);
+    const id = useId(), [internal, setInternal] = useState(defaultOpen);
+    const shown = open ?? internal;
+    const timers = useRef({});
+    const press = useRef(undefined);
+    const suppressClick = useRef(false);
+    const latest = useRef({ open, onOpenChange, disabled: inactive });
+    latest.current = { open, onOpenChange, disabled: inactive };
+    const change = (next) => { if (latest.current.open === undefined)
+        setInternal(next); latest.current.onOpenChange?.(next); };
+    const clear = () => { clearTimeout(timers.current.hold); clearTimeout(timers.current.close); timers.current = {}; };
+    useEffect(() => () => { clear(); press.current = undefined; }, []);
+    useEffect(() => { if (inactive) {
+        clear();
+        press.current = undefined;
+        suppressClick.current = false;
+        setInternal(false);
+    } }, [inactive]);
+    const finish = (cancelled) => {
+        clearTimeout(timers.current.hold);
+        const held = press.current?.held;
+        press.current = undefined;
+        if (held) {
+            suppressClick.current = !cancelled;
+            if (cancelled)
+                change(false);
+            else
+                timers.current.close = setTimeout(() => change(false), touchCloseDelay);
+        }
+    };
+    return _jsxs(Tooltip.Root, { open: shown && !inactive, disabled: inactive, triggerId: triggerProps?.id ?? id, onOpenChange: next => { clear(); if (!next && press.current)
+            press.current.held = false; change(next); }, children: [_jsx(Tooltip.Trigger, { ...triggerProps, id: triggerProps?.id ?? id, render: children, disabled: inactive, onPointerDown: event => {
+                    triggerProps?.onPointerDown?.(event);
+                    if (event.defaultPrevented || disabled || triggerProps?.disabled || event.pointerType !== 'touch' || !event.isPrimary)
+                        return;
+                    clear();
+                    suppressClick.current = false;
+                    press.current = { x: event.clientX, y: event.clientY, id: event.pointerId, held: false };
+                    timers.current.hold = setTimeout(() => { if (!press.current || latest.current.disabled)
+                        return; press.current.held = true; suppressClick.current = true; change(true); }, longPressDelay);
+                }, onPointerMove: event => {
+                    triggerProps?.onPointerMove?.(event);
+                    if (press.current && Math.hypot(event.clientX - press.current.x, event.clientY - press.current.y) > moveTolerance)
+                        finish(true);
+                }, onPointerUp: event => { triggerProps?.onPointerUp?.(event); if (event.pointerId === press.current?.id)
+                    finish(false); }, onPointerCancel: event => { triggerProps?.onPointerCancel?.(event); finish(true); }, onPointerLeave: event => { triggerProps?.onPointerLeave?.(event); if (press.current)
+                    finish(true); }, onContextMenu: event => {
+                    triggerProps?.onContextMenu?.(event);
+                    if (press.current)
+                        event.preventDefault();
+                }, onClickCapture: event => {
+                    triggerProps?.onClickCapture?.(event);
+                    if (suppressClick.current) {
+                        suppressClick.current = false;
+                        event.preventDefault();
+                        event.stopPropagation();
+                    }
+                } }), _jsx(Tooltip.Portal, { children: _jsx(Tooltip.Positioner, { ...positionerProps, children: _jsx(Tooltip.Popup, { ...popupProps, children: content }) }) })] });
+}
+//# sourceMappingURL=tooltip.js.map

package/dist/overlays/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\nimport { Tooltip as Base } from '@base-ui/react/tooltip';\nimport { styledPart } from '@fayegram-ai/provider/parts';\nimport { createContext, forwardRef, useContext, useEffect, useId, useMemo, useRef, useState, type ComponentProps, type ReactElement, type ReactNode } from 'react';\nimport { PortalTheme, useEnvironment } from '@fayegram-ai/provider/provider';\nimport './tooltip.css';\nimport { usePopupScrollRef } from './_popup-scroll.js';\nconst DescriptionContext = createContext<{\n    generatedId: string;\n    descriptionId?: string;\n    register: (id: string | undefined) => void;\n} | undefined>(undefined);\nconst AccessibleRoot: typeof Base.Root = props => {\n    const generatedId = useId(), [descriptionId, register] = useState<string | undefined>(undefined);\n    const value = useMemo(() => ({ generatedId, descriptionId, register }), [generatedId, descriptionId]);\n    return <DescriptionContext.Provider value={value}><Base.Root {...props}/></DescriptionContext.Provider>;\n};\nconst AccessibleTrigger: typeof Base.Trigger = props => {\n    const context = useContext(DescriptionContext);\n    const describedBy = [props['aria-describedby'], context?.descriptionId].filter(Boolean).join(' ') || undefined;\n    return <Base.Trigger {...props} aria-describedby={describedBy}/>;\n};\nconst AccessiblePopup: typeof Base.Popup = forwardRef<HTMLDivElement, ComponentProps<typeof Base.Popup>>((props, ref) => {\n    const context = useContext(DescriptionContext), fallbackId = useId();\n    const id = props.id ?? context?.generatedId ?? fallbackId;\n    const register = context?.register;\n    useEffect(() => { register?.(id); return () => register?.(undefined); }, [register, id]);\n    return <Base.Popup {...props} ref={usePopupScrollRef(ref)} id={id} role={props.role ?? 'tooltip'}/>;\n});\nfunction Portal({ children, container, ...props }: ComponentProps<typeof Base.Portal>) { const environment = useEnvironment(); return <Base.Portal {...props} container={container ?? environment.portalContainer ?? environment.ownerDocument?.body}><PortalTheme>{children}</PortalTheme></Base.Portal>; }\nexport const Tooltip = {\n    Provider: Base.Provider,\n    Root: AccessibleRoot,\n    Trigger: styledPart(AccessibleTrigger, 'tooltip', 'trigger'),\n    Positioner: styledPart(Base.Positioner, 'tooltip', 'positioner', { positionMethod: 'fixed', sideOffset: 6 }),\n    Popup: styledPart(AccessiblePopup, 'tooltip', 'popup'),\n    Arrow: styledPart(Base.Arrow, 'tooltip', 'arrow'),\n    Portal,\n} as const;\n\nexport interface TouchTooltipProps {\n    children: ReactElement;\n    content: ReactNode;\n    open?: boolean;\n    defaultOpen?: boolean;\n    onOpenChange?: (open: boolean) => void;\n    disabled?: boolean;\n    longPressDelay?: number;\n    touchCloseDelay?: number;\n    moveTolerance?: number;\n    triggerProps?: ComponentProps<typeof Tooltip.Trigger>;\n    positionerProps?: ComponentProps<typeof Tooltip.Positioner>;\n    popupProps?: ComponentProps<typeof Tooltip.Popup>;\n}\n/** Touch hold supplements the existing hover/focus/dismissal engine. A normal tap still activates its control. */\nexport function TouchTooltip({ children, content, open, defaultOpen = false, onOpenChange, disabled = false, longPressDelay = 600, touchCloseDelay = 1500, moveTolerance = 10, triggerProps, positionerProps, popupProps }: TouchTooltipProps) {\n    const controlled = useRef(open !== undefined);\n    if (controlled.current !== (open !== undefined)) throw new Error('A touch tooltip changed controlledness');\n    if (![longPressDelay,touchCloseDelay,moveTolerance].every(value => Number.isFinite(value) && value >= 0)) throw new RangeError('Invalid touch tooltip timing');\n    const inactive = disabled || Boolean(triggerProps?.disabled);\n    const id = useId(), [internal,setInternal] = useState(defaultOpen);\n    const shown = open ?? internal;\n    const timers = useRef<{ hold?: ReturnType<typeof setTimeout>; close?: ReturnType<typeof setTimeout> }>({});\n    const press = useRef<{ x:number; y:number; id:number; held:boolean } | undefined>(undefined);\n    const suppressClick = useRef(false);\n    const latest = useRef({open,onOpenChange,disabled:inactive}); latest.current = {open,onOpenChange,disabled:inactive};\n    const change = (next: boolean) => { if (latest.current.open === undefined) setInternal(next); latest.current.onOpenChange?.(next); };\n    const clear = () => { clearTimeout(timers.current.hold); clearTimeout(timers.current.close); timers.current = {}; };\n    useEffect(() => () => { clear(); press.current = undefined; }, []);\n    useEffect(() => { if (inactive) { clear(); press.current = undefined; suppressClick.current = false; setInternal(false); } }, [inactive]);\n    const finish = (cancelled: boolean) => {\n        clearTimeout(timers.current.hold);\n        const held = press.current?.held; press.current = undefined;\n        if (held) {\n            suppressClick.current = !cancelled;\n            if (cancelled) change(false);\n            else timers.current.close = setTimeout(() => change(false),touchCloseDelay);\n        }\n    };\n    return <Tooltip.Root open={shown && !inactive} disabled={inactive} triggerId={triggerProps?.id ?? id} onOpenChange={next => { clear(); if (!next && press.current) press.current.held = false; change(next); }}>\n        <Tooltip.Trigger {...triggerProps} id={triggerProps?.id ?? id} render={children} disabled={inactive} onPointerDown={event => {\n            triggerProps?.onPointerDown?.(event);\n            if (event.defaultPrevented || disabled || triggerProps?.disabled || event.pointerType !== 'touch' || !event.isPrimary) return;\n            clear(); suppressClick.current = false;\n            press.current = {x:event.clientX,y:event.clientY,id:event.pointerId,held:false};\n            timers.current.hold = setTimeout(() => { if (!press.current || latest.current.disabled) return; press.current.held = true; suppressClick.current = true; change(true); },longPressDelay);\n        }} onPointerMove={event => {\n            triggerProps?.onPointerMove?.(event);\n            if (press.current && Math.hypot(event.clientX-press.current.x,event.clientY-press.current.y) > moveTolerance) finish(true);\n        }} onPointerUp={event => { triggerProps?.onPointerUp?.(event); if (event.pointerId === press.current?.id) finish(false); }} onPointerCancel={event => { triggerProps?.onPointerCancel?.(event); finish(true); }} onPointerLeave={event => { triggerProps?.onPointerLeave?.(event); if (press.current) finish(true); }} onContextMenu={event => {\n            triggerProps?.onContextMenu?.(event); if (press.current) event.preventDefault();\n        }} onClickCapture={event => {\n            triggerProps?.onClickCapture?.(event);\n            if (suppressClick.current) { suppressClick.current = false; event.preventDefault(); event.stopPropagation(); }\n        }}/>\n        <Tooltip.Portal><Tooltip.Positioner {...positionerProps}><Tooltip.Popup {...popupProps}>{content}</Tooltip.Popup></Tooltip.Positioner></Tooltip.Portal>\n    </Tooltip.Root>;\n}\n"]}

package/dist/patterns/accessibility-preferences.css

@@ -0,0 +1,9 @@
+@layer faye-ui.reset,faye-ui.tokens,faye-ui.base,faye-ui.components,faye-ui.variants,faye-ui.brand,faye-ui.product,faye-ui.local;
+@layer faye-ui.components{
+ .faye-ui-accessibility-preferences{container:faye-ui-accessibility/inline-size;min-inline-size:0;margin:0;padding:0;border:0;color:var(--faye-ui-color-text)}
+ .faye-ui-accessibility-preferences>legend{padding:0;margin-block-end:var(--faye-ui-space-3);font-weight:var(--faye-ui-font-weight-medium)}
+ .faye-ui-accessibility-preferences-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--faye-ui-space-3)}
+ .faye-ui-accessibility-preference{display:grid;gap:var(--faye-ui-space-1);min-inline-size:0;font-size:var(--faye-ui-font-size-sm);line-height:var(--faye-ui-line-normal)}
+ .faye-ui-accessibility-preferences>.faye-ui-button-root{margin-block-start:var(--faye-ui-space-3);max-inline-size:100%;white-space:normal;overflow-wrap:anywhere}
+ @container faye-ui-accessibility (max-width:24rem){.faye-ui-accessibility-preferences-grid{grid-template-columns:minmax(0,1fr)}}
+}

package/dist/patterns/accessibility-preferences.d.ts

@@ -0,0 +1,14 @@
+import { type FieldsetHTMLAttributes } from 'react';
+import { type AccessibilityPreferences as AccessibilityValues } from '@fayegram-ai/faye-ui/contracts/accessibility';
+import './accessibility-preferences.css';
+export interface AccessibilityPreferencesValue extends AccessibilityValues {
+    readonly motion: 'system' | 'reduced';
+}
+export interface AccessibilityPreferencesProps extends Omit<FieldsetHTMLAttributes<HTMLFieldSetElement>, 'onChange'> {
+    value: AccessibilityPreferencesValue;
+    onValueChange: (value: AccessibilityPreferencesValue) => void;
+    labels?: Partial<Record<'title' | 'focus' | 'hints' | 'contrast' | 'motion' | 'automatic' | 'keyboardFocus' | 'everyFocus' | 'system' | 'more' | 'reduced' | 'reset', string>>;
+}
+/** Controlled, optional UI. The application owns persistence and provider updates. */
+export declare function AccessibilityPreferences({ value, onValueChange, labels, disabled, className, ...props }: AccessibilityPreferencesProps): import("react").JSX.Element;
+//# sourceMappingURL=accessibility-preferences.d.ts.map

package/dist/patterns/accessibility-preferences.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accessibility-preferences.d.ts","sourceRoot":"","sources":["../../../packages/patterns/src/accessibility-preferences.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,KAAK,sBAAsB,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAA8C,KAAK,wBAAwB,IAAI,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAKxJ,OAAO,iCAAiC,CAAC;AAEzC,MAAM,WAAW,6BAA8B,SAAQ,mBAAmB;IAAG,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,SAAS,CAAA;CAAE;AACpH,MAAM,WAAW,6BAA8B,SAAQ,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,UAAU,CAAC;IAChH,KAAK,EAAE,6BAA6B,CAAC;IACrC,aAAa,EAAE,CAAC,KAAK,EAAE,6BAA6B,KAAK,IAAI,CAAC;IAC9D,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,WAAW,GAAG,eAAe,GAAG,YAAY,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;CAClL;AAGD,sFAAsF;AACtF,wBAAgB,wBAAwB,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,6BAA6B,+BAgBtI"}

package/dist/patterns/accessibility-preferences.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId } from 'react';
+import { defaultAccessibility, resolveAccessibility } from '@fayegram-ai/faye-ui/contracts/accessibility';
+import { useEnvironment } from '@fayegram-ai/faye-ui/provider/provider';
+import { NativeSelect } from '@fayegram-ai/faye-ui/controls/native-select';
+import { Button } from '@fayegram-ai/faye-ui/controls/button';
+import './accessibility-preferences.css';
+const messageKeys = { title: 'accessibilityPreferences', focus: 'focusIndicators', hints: 'interactionHints', contrast: 'contrast', motion: 'motion', automatic: 'automatic', keyboardFocus: 'keyboardFocus', everyFocus: 'everyFocus', system: 'systemPreference', more: 'higherContrast', reduced: 'reducedMotion', reset: 'resetAccessibility' };
+/** Controlled, optional UI. The application owns persistence and provider updates. */
+export function AccessibilityPreferences({ value, onValueChange, labels, disabled, className, ...props }) {
+    const id = useId(), { message } = useEnvironment();
+    const label = (key) => labels?.[key] ?? message(messageKeys[key]);
+    const configured = resolveAccessibility(value && { focus: value.focus, hints: value.hints, contrast: value.contrast });
+    if (!value || !['system', 'reduced'].includes(value.motion))
+        throw new TypeError('Invalid accessibility motion preference');
+    const update = (key, next) => onValueChange({ ...configured, motion: value.motion, [key]: next });
+    return _jsxs("fieldset", { ...props, disabled: disabled, className: ['faye-ui-accessibility-preferences', className].filter(Boolean).join(' '), children: [_jsx("legend", { children: label('title') }), _jsxs("div", { className: "faye-ui-accessibility-preferences-grid", children: [_jsxs("div", { className: "faye-ui-accessibility-preference", children: [_jsx("label", { htmlFor: `${id}-focus`, children: label('focus') }), _jsxs(NativeSelect, { id: `${id}-focus`, value: configured.focus, onChange: event => update('focus', event.target.value), children: [_jsx("option", { value: "auto", children: label('automatic') }), _jsx("option", { value: "always", children: label('everyFocus') })] })] }), _jsxs("div", { className: "faye-ui-accessibility-preference", children: [_jsx("label", { htmlFor: `${id}-hints`, children: label('hints') }), _jsxs(NativeSelect, { id: `${id}-hints`, value: configured.hints, onChange: event => update('hints', event.target.value), children: [_jsx("option", { value: "auto", children: label('keyboardFocus') }), _jsx("option", { value: "always", children: label('everyFocus') })] })] }), _jsxs("div", { className: "faye-ui-accessibility-preference", children: [_jsx("label", { htmlFor: `${id}-contrast`, children: label('contrast') }), _jsxs(NativeSelect, { id: `${id}-contrast`, value: configured.contrast, onChange: event => update('contrast', event.target.value), children: [_jsx("option", { value: "system", children: label('system') }), _jsx("option", { value: "more", children: label('more') })] })] }), _jsxs("div", { className: "faye-ui-accessibility-preference", children: [_jsx("label", { htmlFor: `${id}-motion`, children: label('motion') }), _jsxs(NativeSelect, { id: `${id}-motion`, value: value.motion, onChange: event => update('motion', event.target.value), children: [_jsx("option", { value: "system", children: label('system') }), _jsx("option", { value: "reduced", children: label('reduced') })] })] })] }), _jsx(Button, { size: "sm", variant: "ghost", disabled: disabled, onClick: () => onValueChange({ ...defaultAccessibility, motion: 'system' }), children: label('reset') })] });
+}
+//# sourceMappingURL=accessibility-preferences.js.map

package/dist/patterns/accessibility-preferences.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accessibility-preferences.js","sourceRoot":"","sources":["accessibility-preferences.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\nimport { useId, type FieldsetHTMLAttributes } from 'react';\nimport { defaultAccessibility, resolveAccessibility, type AccessibilityPreferences as AccessibilityValues } from '@fayegram-ai/contracts/accessibility';\nimport { useEnvironment } from '@fayegram-ai/provider/provider';\nimport type { MessageKey } from '@fayegram-ai/provider/messages';\nimport { NativeSelect } from '@fayegram-ai/controls/native-select';\nimport { Button } from '@fayegram-ai/controls/button';\nimport './accessibility-preferences.css';\n\nexport interface AccessibilityPreferencesValue extends AccessibilityValues { readonly motion: 'system' | 'reduced' }\nexport interface AccessibilityPreferencesProps extends Omit<FieldsetHTMLAttributes<HTMLFieldSetElement>, 'onChange'> {\n    value: AccessibilityPreferencesValue;\n    onValueChange: (value: AccessibilityPreferencesValue) => void;\n    labels?: Partial<Record<'title' | 'focus' | 'hints' | 'contrast' | 'motion' | 'automatic' | 'keyboardFocus' | 'everyFocus' | 'system' | 'more' | 'reduced' | 'reset', string>>;\n}\nconst messageKeys = { title: 'accessibilityPreferences', focus: 'focusIndicators', hints: 'interactionHints', contrast: 'contrast', motion: 'motion', automatic: 'automatic', keyboardFocus: 'keyboardFocus', everyFocus: 'everyFocus', system: 'systemPreference', more: 'higherContrast', reduced: 'reducedMotion', reset: 'resetAccessibility' } as const satisfies Record<string, MessageKey>;\n\n/** Controlled, optional UI. The application owns persistence and provider updates. */\nexport function AccessibilityPreferences({ value, onValueChange, labels, disabled, className, ...props }: AccessibilityPreferencesProps) {\n    const id = useId(), { message } = useEnvironment();\n    const label = (key: keyof typeof messageKeys) => labels?.[key] ?? message(messageKeys[key]);\n    const configured = resolveAccessibility(value && { focus: value.focus, hints: value.hints, contrast: value.contrast });\n    if (!value || !['system', 'reduced'].includes(value.motion)) throw new TypeError('Invalid accessibility motion preference');\n    const update = (key: keyof AccessibilityPreferencesValue, next: string) => onValueChange({ ...configured, motion: value.motion, [key]: next });\n    return <fieldset {...props} disabled={disabled} className={['faye-ui-accessibility-preferences', className].filter(Boolean).join(' ')}>\n        <legend>{label('title')}</legend>\n        <div className=\"faye-ui-accessibility-preferences-grid\">\n            <div className=\"faye-ui-accessibility-preference\"><label htmlFor={`${id}-focus`}>{label('focus')}</label><NativeSelect id={`${id}-focus`} value={configured.focus} onChange={event => update('focus', event.target.value)}><option value=\"auto\">{label('automatic')}</option><option value=\"always\">{label('everyFocus')}</option></NativeSelect></div>\n            <div className=\"faye-ui-accessibility-preference\"><label htmlFor={`${id}-hints`}>{label('hints')}</label><NativeSelect id={`${id}-hints`} value={configured.hints} onChange={event => update('hints', event.target.value)}><option value=\"auto\">{label('keyboardFocus')}</option><option value=\"always\">{label('everyFocus')}</option></NativeSelect></div>\n            <div className=\"faye-ui-accessibility-preference\"><label htmlFor={`${id}-contrast`}>{label('contrast')}</label><NativeSelect id={`${id}-contrast`} value={configured.contrast} onChange={event => update('contrast', event.target.value)}><option value=\"system\">{label('system')}</option><option value=\"more\">{label('more')}</option></NativeSelect></div>\n            <div className=\"faye-ui-accessibility-preference\"><label htmlFor={`${id}-motion`}>{label('motion')}</label><NativeSelect id={`${id}-motion`} value={value.motion} onChange={event => update('motion', event.target.value)}><option value=\"system\">{label('system')}</option><option value=\"reduced\">{label('reduced')}</option></NativeSelect></div>\n        </div>\n        <Button size=\"sm\" variant=\"ghost\" disabled={disabled} onClick={() => onValueChange({ ...defaultAccessibility, motion: 'system' })}>{label('reset')}</Button>\n    </fieldset>;\n}\n"]}

package/dist/patterns/application-navigation.css

@@ -0,0 +1,8 @@
+@layer faye-ui.reset,faye-ui.tokens,faye-ui.base,faye-ui.components,faye-ui.variants,faye-ui.brand,faye-ui.product,faye-ui.local;
+@layer faye-ui.components{.faye-ui-app-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--faye-ui-space-4);min-block-size:3.5rem;padding-inline:var(--faye-ui-layout-gutter);background:var(--faye-ui-color-surface);border-block-end:var(--faye-ui-border-width) solid var(--faye-ui-color-border)}.faye-ui-bottom-navigation{display:flex;justify-content:space-around;gap:var(--faye-ui-space-2);padding:var(--faye-ui-space-2);background:var(--faye-ui-color-surface);border-block-start:var(--faye-ui-border-width) solid var(--faye-ui-color-border)}.faye-ui-bottom-navigation a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--faye-ui-space-1);min-block-size:2.75rem;min-inline-size:2.75rem;padding-inline:var(--faye-ui-space-3);border-radius:var(--faye-ui-radius-control);font-size:var(--faye-ui-font-size-xs);color:var(--faye-ui-color-muted);text-decoration:none}.faye-ui-bottom-navigation a[aria-current]{background:var(--faye-ui-color-accent-soft);color:var(--faye-ui-color-accent-text)}.faye-ui-bottom-navigation a:hover{background:var(--faye-ui-color-hover)}}
+@layer faye-ui.components {
+ .faye-ui-app-bar{box-sizing:border-box;min-inline-size:0;padding-block:var(--faye-ui-space-2);flex-wrap:wrap;overflow-wrap:anywhere}
+ .faye-ui-scroll-app-bar{position:sticky;inset-block-start:0;z-index:var(--faye-ui-z-sticky);transition:transform var(--faye-ui-motion-normal) var(--faye-ui-motion-ease),box-shadow var(--faye-ui-motion-fast) var(--faye-ui-motion-ease)}
+ .faye-ui-scroll-app-bar[data-elevated]{box-shadow:var(--faye-ui-shadow-raised)}
+ .faye-ui-scroll-app-bar[data-scroll-hidden]:not(:focus-within){transform:translateY(-100%)}
+}

package/dist/patterns/application-navigation.d.ts

@@ -0,0 +1,21 @@
+import type { HTMLAttributes, ReactNode, AnchorHTMLAttributes } from 'react';
+import './application-navigation.css';
+export declare function AppBar({ children, className, ...props }: HTMLAttributes<HTMLElement>): import("react").JSX.Element;
+/** Compose with useScrollTrigger; focus within keeps the navigation visible and operable. */
+export declare function ScrollAppBar({ hidden, elevated, className, ...props }: HTMLAttributes<HTMLElement> & {
+    hidden?: boolean;
+    elevated?: boolean;
+}): import("react").JSX.Element;
+export interface NavigationItem {
+    key: string;
+    label: ReactNode;
+    icon?: ReactNode;
+    href: string;
+    linkProps?: Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'children'>;
+}
+export declare function BottomNavigation({ items, current, label, className, ...props }: HTMLAttributes<HTMLElement> & {
+    items: readonly NavigationItem[];
+    current?: string;
+    label?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=application-navigation.d.ts.map

package/dist/patterns/application-navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"application-navigation.d.ts","sourceRoot":"","sources":["../../../packages/patterns/src/application-navigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,8BAA8B,CAAC;AACtC,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,WAAW,CAAC,+BAAiG;AACtL,6FAA6F;AAC7F,wBAAgB,YAAY,CAAC,EAAE,MAAc,EAAE,QAAgB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,+BAE7J;AACD,MAAM,WAAW,cAAc;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC,CAAC;CAClF;AACD,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAA4B,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAClI,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,+BAA0U"}

package/dist/patterns/application-navigation.js

@@ -0,0 +1,13 @@
+import { createElement as _createElement } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cx } from '@fayegram-ai/faye-ui/core/utils';
+import './application-navigation.css';
+export function AppBar({ children, className, ...props }) { return _jsx("header", { ...props, className: cx('faye-ui-app-bar', className), children: children }); }
+/** Compose with useScrollTrigger; focus within keeps the navigation visible and operable. */
+export function ScrollAppBar({ hidden = false, elevated = false, className, ...props }) {
+    return _jsx(AppBar, { ...props, "data-scroll-hidden": hidden || undefined, "data-elevated": elevated || undefined, className: cx('faye-ui-scroll-app-bar', className) });
+}
+export function BottomNavigation({ items, current, label = 'Primary navigation', className, ...props }) { return _jsx("nav", { ...props, "aria-label": label, className: cx('faye-ui-bottom-navigation', className), children: items.map(item => _createElement("a", { ...item.linkProps, key: item.key, href: item.href, "aria-current": current === item.key ? 'page' : undefined },
+        item.icon && _jsx("span", { "aria-hidden": "true", children: item.icon }),
+        _jsx("span", { children: item.label }))) }); }
+//# sourceMappingURL=application-navigation.js.map

package/dist/patterns/application-navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"application-navigation.js","sourceRoot":"","sources":["application-navigation.tsx"],"names":[],"mappings":";;AACA,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAC7C,OAAO,8BAA8B,CAAC;AACtC,MAAM,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B,IAAI,OAAO,oBAAY,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,SAAS,CAAC,YAAG,QAAQ,GAAU,CAAC,CAAC,CAAC;AACtL,6FAA6F;AAC7F,MAAM,UAAU,YAAY,CAAC,EAAE,MAAM,GAAG,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAA0E;IAC1J,OAAO,KAAC,MAAM,OAAK,KAAK,wBAAsB,MAAM,IAAI,SAAS,mBAAiB,QAAQ,IAAI,SAAS,EAAE,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAC,SAAS,CAAC,GAAG,CAAC;AAClK,CAAC;AAQD,MAAM,UAAU,gBAAgB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,GAAG,oBAAoB,EAAE,SAAS,EAAE,GAAG,KAAK,EAInG,IAAI,OAAO,iBAAS,KAAK,gBAAc,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE,SAAS,CAAC,YAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,yBAAO,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,kBAAgB,OAAO,KAAK,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAAG,IAAI,CAAC,IAAI,IAAI,8BAAkB,MAAM,YAAE,IAAI,CAAC,IAAI,GAAQ;QAAC,yBAAO,IAAI,CAAC,KAAK,GAAQ,CAAI,CAAC,GAAO,CAAC,CAAC,CAAC","sourcesContent":["import type { HTMLAttributes, ReactNode, AnchorHTMLAttributes } from 'react';\nimport { cx } from '@fayegram-ai/core/utils';\nimport './application-navigation.css';\nexport function AppBar({ children, className, ...props }: HTMLAttributes<HTMLElement>) { return <header {...props} className={cx('faye-ui-app-bar', className)}>{children}</header>; }\n/** Compose with useScrollTrigger; focus within keeps the navigation visible and operable. */\nexport function ScrollAppBar({ hidden = false, elevated = false, className, ...props }: HTMLAttributes<HTMLElement> & { hidden?: boolean; elevated?: boolean }) {\n    return <AppBar {...props} data-scroll-hidden={hidden || undefined} data-elevated={elevated || undefined} className={cx('faye-ui-scroll-app-bar',className)}/>;\n}\nexport interface NavigationItem {\n    key: string;\n    label: ReactNode;\n    icon?: ReactNode;\n    href: string;\n    linkProps?: Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'children'>;\n}\nexport function BottomNavigation({ items, current, label = 'Primary navigation', className, ...props }: HTMLAttributes<HTMLElement> & {\n    items: readonly NavigationItem[];\n    current?: string;\n    label?: string;\n}) { return <nav {...props} aria-label={label} className={cx('faye-ui-bottom-navigation', className)}>{items.map(item => <a {...item.linkProps} key={item.key} href={item.href} aria-current={current === item.key ? 'page' : undefined}>{item.icon && <span aria-hidden=\"true\">{item.icon}</span>}<span>{item.label}</span></a>)}</nav>; }\n"]}

package/dist/patterns/collapsed-breadcrumbs.d.ts

@@ -0,0 +1,10 @@
+import { type BreadcrumbsProps } from '@fayegram-ai/faye-ui/navigation/breadcrumbs';
+export interface CollapsedBreadcrumbsProps extends BreadcrumbsProps {
+    maxItems?: number;
+    beforeCollapse?: number;
+    afterCollapse?: number;
+    expandLabel?: string;
+}
+/** Hidden ancestors remain navigable; Menu restores focus to the expansion control. */
+export declare function CollapsedBreadcrumbs({ items, maxItems, beforeCollapse, afterCollapse, expandLabel, ...props }: CollapsedBreadcrumbsProps): import("react").JSX.Element;
+//# sourceMappingURL=collapsed-breadcrumbs.d.ts.map

package/dist/patterns/collapsed-breadcrumbs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsed-breadcrumbs.d.ts","sourceRoot":"","sources":["../../../packages/patterns/src/collapsed-breadcrumbs.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,qCAAqC,CAAC;AAEzF,MAAM,WAAW,yBAA0B,SAAQ,gBAAgB;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB;AACD,uFAAuF;AACvF,wBAAgB,oBAAoB,CAAC,EAAE,KAAK,EAAE,QAAY,EAAE,cAAkB,EAAE,aAAiB,EAAE,WAAgC,EAAE,GAAG,KAAK,EAAE,EAAE,yBAAyB,+BAMzK"}

package/dist/patterns/collapsed-breadcrumbs.js

@@ -0,0 +1,18 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MoreHorizontal } from '@lucide/icons';
+import { Icon } from '@fayegram-ai/faye-ui/core/icon';
+import { IconButton } from '@fayegram-ai/faye-ui/controls/button';
+import { Breadcrumbs } from '@fayegram-ai/faye-ui/navigation/breadcrumbs';
+import { Menu } from '@fayegram-ai/faye-ui/overlays/menu';
+/** Hidden ancestors remain navigable; Menu restores focus to the expansion control. */
+export function CollapsedBreadcrumbs({ items, maxItems = 4, beforeCollapse = 1, afterCollapse = 1, expandLabel = 'Show hidden path', ...props }) {
+    if (![maxItems, beforeCollapse, afterCollapse].every(Number.isSafeInteger) || beforeCollapse < 1 || afterCollapse < 1 || maxItems < beforeCollapse + afterCollapse + 1)
+        throw new RangeError('Invalid breadcrumb collapse counts');
+    if (items.length <= maxItems)
+        return _jsx(Breadcrumbs, { ...props, items: items });
+    const hidden = items.slice(beforeCollapse, -afterCollapse);
+    const menu = _jsxs(Menu.Root, { children: [_jsx(Menu.Trigger, { render: _jsx(IconButton, { "aria-label": expandLabel, size: "sm", variant: "ghost", children: _jsx(Icon, { icon: MoreHorizontal }) }) }), _jsx(Menu.Portal, { children: _jsx(Menu.Positioner, { children: _jsx(Menu.Popup, { children: hidden.map((item, index) => item.href ? _jsx(Menu.LinkItem, { href: item.href, children: item.label }, index) : _jsx(Menu.Item, { disabled: true, children: item.label }, index)) }) }) })] });
+    return _jsx(Breadcrumbs, { ...props, items: [...items.slice(0, beforeCollapse), { label: menu }, ...items.slice(-afterCollapse)] });
+}
+//# sourceMappingURL=collapsed-breadcrumbs.js.map

package/dist/patterns/collapsed-breadcrumbs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsed-breadcrumbs.js","sourceRoot":"","sources":["collapsed-breadcrumbs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAyB,MAAM,qCAAqC,CAAC;AACzF,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAOlD,uFAAuF;AACvF,MAAM,UAAU,oBAAoB,CAAC,EAAE,KAAK,EAAE,QAAQ,GAAG,CAAC,EAAE,cAAc,GAAG,CAAC,EAAE,aAAa,GAAG,CAAC,EAAE,WAAW,GAAG,kBAAkB,EAAE,GAAG,KAAK,EAA6B;IACtK,IAAI,CAAC,CAAC,QAAQ,EAAC,cAAc,EAAC,aAAa,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC,IAAI,cAAc,GAAG,CAAC,IAAI,aAAa,GAAG,CAAC,IAAI,QAAQ,GAAG,cAAc,GAAG,aAAa,GAAG,CAAC;QAAE,MAAM,IAAI,UAAU,CAAC,oCAAoC,CAAC,CAAC;IACjO,IAAI,KAAK,CAAC,MAAM,IAAI,QAAQ;QAAE,OAAO,KAAC,WAAW,OAAK,KAAK,EAAE,KAAK,EAAE,KAAK,GAAG,CAAC;IAC7E,MAAM,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC,aAAa,CAAC,CAAC;IAC3D,MAAM,IAAI,GAAG,MAAC,IAAI,CAAC,IAAI,eAAC,KAAC,IAAI,CAAC,OAAO,IAAC,MAAM,EAAE,KAAC,UAAU,kBAAa,WAAW,EAAE,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,YAAC,KAAC,IAAI,IAAC,IAAI,EAAE,cAAc,GAAG,GAAa,GAAG,EAAA,KAAC,IAAI,CAAC,MAAM,cAAC,KAAC,IAAI,CAAC,UAAU,cAAC,KAAC,IAAI,CAAC,KAAK,cAAE,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,KAAC,IAAI,CAAC,QAAQ,IAAa,IAAI,EAAE,IAAI,CAAC,IAAI,YAAG,IAAI,CAAC,KAAK,IAAnC,KAAK,CAA+C,CAAC,CAAC,CAAC,KAAC,IAAI,CAAC,IAAI,IAAa,QAAQ,kBAAE,IAAI,CAAC,KAAK,IAA3B,KAAK,CAAmC,CAAC,GAAc,GAAkB,GAAc,IAAY,CAAC;IAC3a,OAAO,KAAC,WAAW,OAAK,KAAK,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,EAAC,cAAc,CAAC,EAAC,EAAC,KAAK,EAAC,IAAI,EAAC,EAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC;AAC5H,CAAC","sourcesContent":["'use client';\nimport { MoreHorizontal } from '@lucide/icons';\nimport { Icon } from '@fayegram-ai/core/icon';\nimport { IconButton } from '@fayegram-ai/controls/button';\nimport { Breadcrumbs, type BreadcrumbsProps } from '@fayegram-ai/navigation/breadcrumbs';\nimport { Menu } from '@fayegram-ai/overlays/menu';\nexport interface CollapsedBreadcrumbsProps extends BreadcrumbsProps {\n    maxItems?: number;\n    beforeCollapse?: number;\n    afterCollapse?: number;\n    expandLabel?: string;\n}\n/** Hidden ancestors remain navigable; Menu restores focus to the expansion control. */\nexport function CollapsedBreadcrumbs({ items, maxItems = 4, beforeCollapse = 1, afterCollapse = 1, expandLabel = 'Show hidden path', ...props }: CollapsedBreadcrumbsProps) {\n    if (![maxItems,beforeCollapse,afterCollapse].every(Number.isSafeInteger) || beforeCollapse < 1 || afterCollapse < 1 || maxItems < beforeCollapse + afterCollapse + 1) throw new RangeError('Invalid breadcrumb collapse counts');\n    if (items.length <= maxItems) return <Breadcrumbs {...props} items={items}/>;\n    const hidden = items.slice(beforeCollapse, -afterCollapse);\n    const menu = <Menu.Root><Menu.Trigger render={<IconButton aria-label={expandLabel} size=\"sm\" variant=\"ghost\"><Icon icon={MoreHorizontal}/></IconButton>}/><Menu.Portal><Menu.Positioner><Menu.Popup>{hidden.map((item,index) => item.href ? <Menu.LinkItem key={index} href={item.href}>{item.label}</Menu.LinkItem> : <Menu.Item key={index} disabled>{item.label}</Menu.Item>)}</Menu.Popup></Menu.Positioner></Menu.Portal></Menu.Root>;\n    return <Breadcrumbs {...props} items={[...items.slice(0,beforeCollapse),{label:menu},...items.slice(-afterCollapse)]}/>;\n}\n"]}

package/dist/patterns/command-palette.css

@@ -0,0 +1,12 @@
+@layer faye-ui.reset,faye-ui.tokens,faye-ui.base,faye-ui.components,faye-ui.variants,faye-ui.brand,faye-ui.product,faye-ui.local;
+@layer faye-ui.components{
+ .faye-ui-command-palette{padding:var(--faye-ui-space-4);gap:var(--faye-ui-space-3)}
+ .faye-ui-command-search{display:flex;flex-direction:column;min-block-size:0;gap:var(--faye-ui-space-2)}
+ .faye-ui-command-input{flex:none}
+ .faye-ui-command-list{min-block-size:0;max-block-size:min(22rem,50dvh);overflow:auto;overscroll-behavior:contain}
+ .faye-ui-command-list:empty{display:none}
+ .faye-ui-command-list small{display:block;color:var(--faye-ui-color-muted);margin-block-start:var(--faye-ui-space-1)}
+ .faye-ui-command-close{flex:none}
+ .faye-ui-command-palette .faye-ui-dialog-header{--_header-action-size:var(--faye-ui-control-sm)}
+ @media(pointer:coarse){.faye-ui-command-palette .faye-ui-dialog-header{--_header-action-size:44px}}
+}

package/dist/patterns/command-palette.d.ts

@@ -0,0 +1,24 @@
+import { type ReactNode } from 'react';
+import './command-palette.css';
+export interface Command {
+    readonly id: string;
+    readonly label: string;
+    readonly description?: string;
+    readonly keywords?: readonly string[];
+    readonly disabled?: boolean;
+}
+export interface CommandPaletteProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    commands: readonly Command[];
+    onSelect: (command: Command) => void;
+    title?: string;
+    placeholder?: string;
+    emptyMessage?: string;
+    closeLabel?: string;
+    /** Optional dismissal artwork; the built-in close icon is used by default. */
+    closeIcon?: ReactNode;
+}
+/** Supplied commands only. No remote search, global shortcut capture or business actions in core. */
+export declare function CommandPalette(input: CommandPaletteProps): import("react").JSX.Element;
+//# sourceMappingURL=command-palette.d.ts.map

package/dist/patterns/command-palette.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-palette.d.ts","sourceRoot":"","sources":["../../../packages/patterns/src/command-palette.tsx"],"names":[],"mappings":"AACA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAOpE,OAAO,uBAAuB,CAAC;AAC/B,MAAM,WAAW,OAAO;IACpB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACtC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC/B;AACD,MAAM,WAAW,mBAAmB;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,SAAS,OAAO,EAAE,CAAC;IAC7B,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,SAAS,CAAC;CACzB;AACD,qGAAqG;AACrG,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BAoBxD"}

package/dist/patterns/command-palette.js

@@ -0,0 +1,34 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { useConfiguredProps, useEnvironment } from '@fayegram-ai/faye-ui/provider/provider';
+import { Dialog } from '@fayegram-ai/faye-ui/overlays/dialog';
+import { X } from '@lucide/icons';
+import { Icon } from '@fayegram-ai/faye-ui/core/icon';
+import { IconButton } from '@fayegram-ai/faye-ui/controls/button';
+import { Combobox } from '@fayegram-ai/faye-ui/controls/combobox';
+import './command-palette.css';
+/** Supplied commands only. No remote search, global shortcut capture or business actions in core. */
+export function CommandPalette(input) {
+    const { locale, message } = useEnvironment();
+    const { open, onOpenChange, commands, onSelect, title = message('commands'), placeholder = message('searchCommands'), emptyMessage = message('noCommands'), closeLabel = message('close'), closeIcon } = useConfiguredProps('command-palette', 'root', input);
+    const [query, setQuery] = useState('');
+    const search = useRef(null);
+    // Controlled parents can close the palette without invoking onOpenChange.
+    useEffect(() => { if (!open)
+        setQuery(''); }, [open]);
+    const normalized = query.trim().toLocaleLowerCase(locale);
+    const filtered = commands.filter(c => [c.label, ...c.keywords ?? []].join(' ').toLocaleLowerCase(locale).includes(normalized));
+    return _jsx(Dialog.Root, { open: open, onOpenChange: (next) => {
+            onOpenChange(next);
+            if (!next)
+                setQuery('');
+        }, children: _jsxs(Dialog.Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsxs(Dialog.Popup, { className: "faye-ui-command-palette", initialFocus: search, children: [_jsxs(Dialog.Header, { children: [_jsx(Dialog.Title, { children: title }), _jsx(Dialog.Close, { className: "faye-ui-command-close", "aria-label": closeLabel, render: _jsx(IconButton, { size: "sm", variant: "ghost", "aria-label": closeLabel, children: closeIcon === undefined ? _jsx(Icon, { icon: X, size: "sm" }) : closeIcon }), children: closeIcon })] }), _jsx("div", { className: "faye-ui-command-search", children: _jsxs(Combobox.Root, { inline: true, open: true, filter: null, items: filtered, value: null, inputValue: query, onInputValueChange: setQuery, onValueChange: value => {
+                                    if (value) {
+                                        onSelect(value);
+                                        onOpenChange(false);
+                                        setQuery('');
+                                    }
+                                }, itemToStringLabel: item => item.label, children: [_jsx(Combobox.Input, { ref: search, "aria-label": title, placeholder: placeholder, className: "faye-ui-command-input" }), _jsx(Combobox.List, { className: "faye-ui-command-list", children: (command) => _jsx(Combobox.Item, { value: command, disabled: command.disabled, children: _jsxs("div", { children: [command.label, command.description && _jsx("small", { children: command.description })] }) }, command.id) }), _jsx(Combobox.Empty, { children: emptyMessage })] }) })] })] }) });
+}
+//# sourceMappingURL=command-palette.js.map

package/dist/patterns/command-palette.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-palette.js","sourceRoot":"","sources":["command-palette.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\nimport { useEffect, useRef, useState, type ReactNode } from 'react';\nimport { useConfiguredProps, useEnvironment } from '@fayegram-ai/provider/provider';\nimport { Dialog } from '@fayegram-ai/overlays/dialog';\nimport { X } from '@lucide/icons';\nimport { Icon } from '@fayegram-ai/core/icon';\nimport { IconButton } from '@fayegram-ai/controls/button';\nimport { Combobox } from '@fayegram-ai/controls/combobox';\nimport './command-palette.css';\nexport interface Command {\n    readonly id: string;\n    readonly label: string;\n    readonly description?: string;\n    readonly keywords?: readonly string[];\n    readonly disabled?: boolean;\n}\nexport interface CommandPaletteProps {\n    open: boolean;\n    onOpenChange: (open: boolean) => void;\n    commands: readonly Command[];\n    onSelect: (command: Command) => void;\n    title?: string;\n    placeholder?: string;\n    emptyMessage?: string;\n    closeLabel?: string;\n    /** Optional dismissal artwork; the built-in close icon is used by default. */\n    closeIcon?: ReactNode;\n}\n/** Supplied commands only. No remote search, global shortcut capture or business actions in core. */\nexport function CommandPalette(input: CommandPaletteProps) {\n    const { locale, message } = useEnvironment();\n    const { open, onOpenChange, commands, onSelect, title = message('commands'), placeholder = message('searchCommands'), emptyMessage = message('noCommands'), closeLabel = message('close'), closeIcon } = useConfiguredProps('command-palette', 'root', input);\n    const [query, setQuery] = useState('');\n    const search = useRef<HTMLInputElement>(null);\n    // Controlled parents can close the palette without invoking onOpenChange.\n    useEffect(() => { if (!open) setQuery(''); }, [open]);\n    const normalized = query.trim().toLocaleLowerCase(locale);\n    const filtered = commands.filter(c => [c.label, ...c.keywords ?? []].join(' ').toLocaleLowerCase(locale).includes(normalized));\n    return <Dialog.Root open={open} onOpenChange={(next) => {\n            onOpenChange(next);\n            if (!next)\n                setQuery('');\n        }}><Dialog.Portal><Dialog.Backdrop /><Dialog.Popup className=\"faye-ui-command-palette\" initialFocus={search}><Dialog.Header><Dialog.Title>{title}</Dialog.Title><Dialog.Close className=\"faye-ui-command-close\" aria-label={closeLabel} render={<IconButton size=\"sm\" variant=\"ghost\" aria-label={closeLabel}>{closeIcon === undefined ? <Icon icon={X} size=\"sm\"/> : closeIcon}</IconButton>}>{closeIcon}</Dialog.Close></Dialog.Header><div className=\"faye-ui-command-search\"><Combobox.Root<Command> inline open filter={null} items={filtered} value={null} inputValue={query} onInputValueChange={setQuery} onValueChange={value => {\n            if (value) {\n                onSelect(value);\n                onOpenChange(false);\n                setQuery('');\n            }\n        }} itemToStringLabel={item => item.label}><Combobox.Input ref={search} aria-label={title} placeholder={placeholder} className=\"faye-ui-command-input\"/><Combobox.List className=\"faye-ui-command-list\">{(command: Command) => <Combobox.Item key={command.id} value={command} disabled={command.disabled}><div>{command.label}{command.description && <small>{command.description}</small>}</div></Combobox.Item>}</Combobox.List><Combobox.Empty>{emptyMessage}</Combobox.Empty></Combobox.Root></div></Dialog.Popup></Dialog.Portal></Dialog.Root>;\n}\n"]}

package/dist/patterns/content.css

@@ -0,0 +1,2 @@
+@layer faye-ui.reset,faye-ui.tokens,faye-ui.base,faye-ui.components,faye-ui.variants,faye-ui.brand,faye-ui.product,faye-ui.local;
+@layer faye-ui.components{.faye-ui-page-header{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--faye-ui-space-5);flex-wrap:wrap;margin:0}.faye-ui-page-eyebrow{font-family:var(--faye-ui-font-body);line-height:var(--faye-ui-line-normal);font-size:var(--faye-ui-font-size-xs);font-weight:var(--faye-ui-font-weight-medium);letter-spacing:var(--faye-ui-font-tracking-wide);text-transform:uppercase;color:var(--faye-ui-color-muted);margin-block-end:var(--faye-ui-space-3)}.faye-ui-page-description{margin-block:var(--faye-ui-space-3) 0;max-inline-size:42rem}.faye-ui-page-actions{display:flex;align-items:center;gap:var(--faye-ui-space-2);flex-wrap:wrap}.faye-ui-empty-state{padding:var(--faye-ui-space-10) var(--faye-ui-space-6);text-align:center;display:grid;justify-items:center;gap:var(--faye-ui-space-3)}.faye-ui-empty-state p{max-inline-size:28rem;margin:0}.faye-ui-empty-icon{display:flex;align-items:center;justify-content:center;color:var(--faye-ui-color-muted)}.faye-ui-form-section{min-inline-size:0;border:0;padding:0;margin:0}.faye-ui-form-section legend{font-family:var(--faye-ui-font-body);line-height:var(--faye-ui-line-normal);font-size:var(--faye-ui-font-size-md);font-weight:var(--faye-ui-font-weight-medium);padding:0}.faye-ui-form-section p{margin-block:var(--faye-ui-space-2) var(--faye-ui-space-5)}.faye-ui-form-section-body{display:grid;gap:var(--faye-ui-space-4)}.faye-ui-filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--faye-ui-space-3)}}

package/dist/patterns/content.d.ts

@@ -0,0 +1,24 @@
+import { type ReactNode, type HTMLAttributes } from 'react';
+import { type HeadingProps } from '@fayegram-ai/faye-ui/core/text';
+import './content.css';
+export declare function PageHeader({ eyebrow, title, description, actions, headingLevel, titleSize, className, ...props }: Omit<HTMLAttributes<HTMLElement>, 'title'> & {
+    eyebrow?: ReactNode;
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Visual size is independent of the semantic heading level. */
+    titleSize?: HeadingProps['size'];
+    title: ReactNode;
+    description?: ReactNode;
+    actions?: ReactNode;
+}): import("react").JSX.Element;
+export declare function EmptyState({ title, description, icon, action, className, ...props }: Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {
+    title: ReactNode;
+    description?: ReactNode;
+    icon?: ReactNode;
+    action?: ReactNode;
+}): import("react").JSX.Element;
+export declare function FormSection({ title, description, children, ...props }: Omit<HTMLAttributes<HTMLFieldSetElement>, 'title'> & {
+    title: ReactNode;
+    description?: ReactNode;
+}): import("react").JSX.Element;
+export declare function FilterBar({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+//# sourceMappingURL=content.d.ts.map

package/dist/patterns/content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../../packages/patterns/src/content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAiB,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAE1E,OAAO,eAAe,CAAC;AACvB,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,YAAgB,EAAE,SAAgB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC,GAAG;IACvK,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC,gEAAgE;IAChE,SAAS,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACjC,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,CAAC;CACvB,+BAA8Y;AAC/Y,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,GAAG;IAClI,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,SAAS,CAAC;CACtB,+BAA8S;AAC/S,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,mBAAmB,CAAC,EAAE,OAAO,CAAC,GAAG;IACzH,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;CAC3B,+BAAkQ;AACnQ,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,cAAc,CAAC,+BAA8F"}

package/dist/patterns/content.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import {} from 'react';
+import { Text, Heading } from '@fayegram-ai/faye-ui/core/text';
+import { cx } from '@fayegram-ai/faye-ui/core/utils';
+import './content.css';
+export function PageHeader({ eyebrow, title, description, actions, headingLevel = 1, titleSize = 'lg', className, ...props }) { return _jsxs("header", { ...props, className: cx('faye-ui-page-header', className), children: [_jsxs("div", { children: [eyebrow && _jsx("div", { className: "faye-ui-page-eyebrow", children: eyebrow }), _jsx(Heading, { level: headingLevel, size: titleSize, children: title }), description && _jsx(Text, { as: "p", tone: "muted", className: "faye-ui-page-description", children: description })] }), actions && _jsx("div", { className: "faye-ui-page-actions", children: actions })] }); }
+export function EmptyState({ title, description, icon, action, className, ...props }) { return _jsxs("div", { ...props, className: cx('faye-ui-empty-state', className), children: [icon && _jsx("div", { className: "faye-ui-empty-icon", "aria-hidden": "true", children: icon }), _jsx(Heading, { level: 3, size: "sm", children: title }), description && _jsx(Text, { as: "p", tone: "muted", children: description }), action && _jsx("div", { children: action })] }); }
+export function FormSection({ title, description, children, ...props }) { return _jsxs("fieldset", { ...props, className: cx('faye-ui-form-section', props.className), children: [_jsx("legend", { children: title }), description && _jsx(Text, { as: "p", tone: "muted", size: "sm", children: description }), _jsx("div", { className: "faye-ui-form-section-body", children: children })] }); }
+export function FilterBar({ children, className, ...props }) { return _jsx("div", { ...props, className: cx('faye-ui-filter-bar', className), children: children }); }
+//# sourceMappingURL=content.js.map

package/dist/patterns/content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content.js","sourceRoot":"","sources":["content.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAuC,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,IAAI,EAAE,OAAO,EAAqB,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAC7C,OAAO,eAAe,CAAC;AACvB,MAAM,UAAU,UAAU,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,YAAY,GAAG,CAAC,EAAE,SAAS,GAAG,IAAI,EAAE,SAAS,EAAE,GAAG,KAAK,EAQzH,IAAI,OAAO,qBAAY,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,aAAE,0BAAM,OAAO,IAAI,cAAK,SAAS,EAAC,sBAAsB,YAAE,OAAO,GAAO,EAAC,KAAC,OAAO,IAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,YAAG,KAAK,GAAW,EAAC,WAAW,IAAI,KAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,0BAA0B,YAAE,WAAW,GAAQ,IAAO,EAAC,OAAO,IAAI,cAAK,SAAS,EAAC,sBAAsB,YAAE,OAAO,GAAO,IAAU,CAAC,CAAC,CAAC;AAC/Y,MAAM,UAAU,UAAU,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,EAKjF,IAAI,OAAO,kBAAS,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,aAAG,IAAI,IAAI,cAAK,SAAS,EAAC,oBAAoB,iBAAa,MAAM,YAAE,IAAI,GAAO,EAAC,KAAC,OAAO,IAAC,KAAK,EAAE,CAAC,EAAE,IAAI,EAAC,IAAI,YAAE,KAAK,GAAW,EAAC,WAAW,IAAI,KAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,OAAO,YAAE,WAAW,GAAQ,EAAE,MAAM,IAAI,wBAAM,MAAM,GAAO,IAAO,CAAC,CAAC,CAAC;AAC/S,MAAM,UAAU,WAAW,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,KAAK,EAGnE,IAAI,OAAO,uBAAc,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,KAAK,CAAC,SAAS,CAAC,aAAE,2BAAS,KAAK,GAAU,EAAC,WAAW,IAAI,KAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,IAAI,YAAE,WAAW,GAAQ,EAAC,cAAK,SAAS,EAAC,2BAA2B,YAAE,QAAQ,GAAO,IAAW,CAAC,CAAC,CAAC;AACnQ,MAAM,UAAU,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkC,IAAI,OAAO,iBAAS,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,YAAG,QAAQ,GAAO,CAAC,CAAC,CAAC","sourcesContent":["import { type ReactNode, type HTMLAttributes } from 'react';\nimport { Text, Heading, type HeadingProps } from '@fayegram-ai/core/text';\nimport { cx } from '@fayegram-ai/core/utils';\nimport './content.css';\nexport function PageHeader({ eyebrow, title, description, actions, headingLevel = 1, titleSize = 'lg', className, ...props }: Omit<HTMLAttributes<HTMLElement>, 'title'> & {\n    eyebrow?: ReactNode;\n    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n    /** Visual size is independent of the semantic heading level. */\n    titleSize?: HeadingProps['size'];\n    title: ReactNode;\n    description?: ReactNode;\n    actions?: ReactNode;\n}) { return <header {...props} className={cx('faye-ui-page-header', className)}><div>{eyebrow && <div className=\"faye-ui-page-eyebrow\">{eyebrow}</div>}<Heading level={headingLevel} size={titleSize}>{title}</Heading>{description && <Text as=\"p\" tone=\"muted\" className=\"faye-ui-page-description\">{description}</Text>}</div>{actions && <div className=\"faye-ui-page-actions\">{actions}</div>}</header>; }\nexport function EmptyState({ title, description, icon, action, className, ...props }: Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {\n    title: ReactNode;\n    description?: ReactNode;\n    icon?: ReactNode;\n    action?: ReactNode;\n}) { return <div {...props} className={cx('faye-ui-empty-state', className)}>{icon && <div className=\"faye-ui-empty-icon\" aria-hidden=\"true\">{icon}</div>}<Heading level={3} size=\"sm\">{title}</Heading>{description && <Text as=\"p\" tone=\"muted\">{description}</Text>}{action && <div>{action}</div>}</div>; }\nexport function FormSection({ title, description, children, ...props }: Omit<HTMLAttributes<HTMLFieldSetElement>, 'title'> & {\n    title: ReactNode;\n    description?: ReactNode;\n}) { return <fieldset {...props} className={cx('faye-ui-form-section', props.className)}><legend>{title}</legend>{description && <Text as=\"p\" tone=\"muted\" size=\"sm\">{description}</Text>}<div className=\"faye-ui-form-section-body\">{children}</div></fieldset>; }\nexport function FilterBar({ children, className, ...props }: HTMLAttributes<HTMLDivElement>) { return <div {...props} className={cx('faye-ui-filter-bar', className)}>{children}</div>; }\n"]}

package/dist/patterns/floating-actions.css

@@ -0,0 +1,11 @@
+@layer faye-ui.reset,faye-ui.tokens,faye-ui.base,faye-ui.components,faye-ui.variants,faye-ui.brand,faye-ui.product,faye-ui.local;
+@layer faye-ui.components{.faye-ui-floating-action{position:fixed;inset-inline-end:max(var(--faye-ui-space-6),env(safe-area-inset-right));inset-block-end:max(var(--faye-ui-space-6),env(safe-area-inset-bottom));z-index:var(--faye-ui-z-sticky)}.faye-ui-floating-action[data-edge=start]{inset-inline-start:max(var(--faye-ui-space-6),env(safe-area-inset-left));inset-inline-end:auto}}
+@layer faye-ui.components {
+ .faye-ui-floating-actions-popup:is([data-direction=start],[data-direction=end]){display:flex;flex-direction:row;gap:var(--faye-ui-space-1);overflow-x:auto;overscroll-behavior:contain}
+ .faye-ui-floating-actions-popup:is([data-direction=start],[data-direction=end]) .faye-ui-menu-item{flex:0 0 auto;max-inline-size:100%}
+ .faye-ui-floating-actions-popup .faye-ui-menu-item{display:flex;align-items:center;gap:var(--faye-ui-space-2)}
+ .faye-ui-floating-actions-popup .faye-ui-menu-item>span{min-inline-size:0}
+ .faye-ui-floating-actions-icon{display:inline-flex;flex-shrink:0}
+ .faye-ui-floating-actions-indicator{transition:transform var(--faye-ui-motion-fast) var(--faye-ui-motion-ease)}
+ .faye-ui-floating-action [data-popup-open] .faye-ui-floating-actions-indicator{transform:rotate(45deg)}
+}

package/dist/patterns/floating-actions.d.ts

@@ -0,0 +1,27 @@
+import type { ComponentProps, ReactNode } from 'react';
+import { type ButtonProps } from '@fayegram-ai/faye-ui/controls/button';
+import { Menu } from '@fayegram-ai/faye-ui/overlays/menu';
+import './floating-actions.css';
+export declare function FloatingAction({ edge, className, ...props }: ButtonProps & {
+    edge?: 'start' | 'end';
+}): import("react").JSX.Element;
+export interface FloatingActionItem {
+    id: string;
+    label: ReactNode;
+    icon?: ReactNode;
+    disabled?: boolean;
+    onSelect: () => void;
+}
+export interface FloatingActionsProps extends Omit<ComponentProps<typeof Menu.Root>, 'children' | 'orientation'> {
+    label: string;
+    items: readonly FloatingActionItem[];
+    edge?: 'start' | 'end';
+    direction?: 'up' | 'down' | 'start' | 'end';
+    openOnHover?: boolean;
+    triggerProps?: ComponentProps<typeof Menu.Trigger>;
+    positionerProps?: ComponentProps<typeof Menu.Positioner>;
+    popupProps?: ComponentProps<typeof Menu.Popup>;
+}
+/** Accessible directional action dock, with Menu owning focus, hover and dismissal. */
+export declare function FloatingActions({ label, items, edge, direction, openOnHover, triggerProps, positionerProps, popupProps, ...rootProps }: FloatingActionsProps): import("react").JSX.Element;
+//# sourceMappingURL=floating-actions.d.ts.map

package/dist/patterns/floating-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating-actions.d.ts","sourceRoot":"","sources":["../../../packages/patterns/src/floating-actions.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,8BAA8B,CAAC;AACpF,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAElD,OAAO,wBAAwB,CAAC;AAChC,wBAAgB,cAAc,CAAC,EAAE,IAAY,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,GAAG;IAChF,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CAC1B,+BAAyI;AAC1I,MAAM,WAAW,kBAAkB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AACD,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,UAAU,GAAG,aAAa,CAAC;IAC5G,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACrC,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IACvB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC;IACnD,eAAe,CAAC,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC;IACzD,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC;CAClD;AACD,uFAAuF;AACvF,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAY,EAAE,SAAgB,EAAE,WAAmB,EAAE,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,GAAG,SAAS,EAAE,EAAE,oBAAoB,+BAMnL"}

package/dist/patterns/floating-actions.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Plus } from '@lucide/icons';
+import { Icon } from '@fayegram-ai/faye-ui/core/icon';
+import { Button, IconButton } from '@fayegram-ai/faye-ui/controls/button';
+import { Menu } from '@fayegram-ai/faye-ui/overlays/menu';
+import { Portal } from '@fayegram-ai/faye-ui/overlays/portal';
+import './floating-actions.css';
+export function FloatingAction({ edge = 'end', className, ...props }) { return _jsx(Portal, { children: _jsx("div", { className: "faye-ui-floating-action", "data-edge": edge, children: _jsx(Button, { ...props, className: className }) }) }); }
+/** Accessible directional action dock, with Menu owning focus, hover and dismissal. */
+export function FloatingActions({ label, items, edge = 'end', direction = 'up', openOnHover = false, triggerProps, positionerProps, popupProps, ...rootProps }) {
+    const horizontal = direction === 'start' || direction === 'end';
+    const side = direction === 'up' ? 'top' : direction === 'down' ? 'bottom' : direction === 'start' ? 'inline-start' : 'inline-end';
+    const popupClassName = popupProps?.className;
+    const triggerChildren = triggerProps?.children === undefined ? _jsx(Icon, { icon: Plus, className: "faye-ui-floating-actions-indicator" }) : triggerProps.children;
+    return _jsxs(Menu.Root, { ...rootProps, orientation: horizontal ? 'horizontal' : 'vertical', children: [_jsx(Portal, { children: _jsx("div", { className: "faye-ui-floating-action", "data-edge": edge, children: _jsx(Menu.Trigger, { openOnHover: openOnHover, render: _jsx(IconButton, { "aria-label": label, variant: "solid", tone: "accent", size: "lg", children: triggerChildren }), ...triggerProps }) }) }), _jsx(Menu.Portal, { children: _jsx(Menu.Positioner, { side: side, align: "end", ...positionerProps, children: _jsx(Menu.Popup, { ...popupProps, className: typeof popupClassName === 'function' ? state => `faye-ui-floating-actions-popup ${popupClassName(state)}` : ['faye-ui-floating-actions-popup', popupClassName].filter(Boolean).join(' '), "data-direction": direction, children: items.map(item => _jsxs(Menu.Item, { disabled: item.disabled, onClick: item.onSelect, children: [item.icon && _jsx("span", { "aria-hidden": "true", className: "faye-ui-floating-actions-icon", children: item.icon }), _jsx("span", { children: item.label })] }, item.id)) }) }) })] });
+}
+//# sourceMappingURL=floating-actions.js.map

package/dist/patterns/floating-actions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating-actions.js","sourceRoot":"","sources":["floating-actions.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\nimport type { ComponentProps, ReactNode } from 'react';\nimport { Plus } from '@lucide/icons';\nimport { Icon } from '@fayegram-ai/core/icon';\nimport { Button, IconButton, type ButtonProps } from '@fayegram-ai/controls/button';\nimport { Menu } from '@fayegram-ai/overlays/menu';\nimport { Portal } from '@fayegram-ai/overlays/portal';\nimport './floating-actions.css';\nexport function FloatingAction({ edge = 'end', className, ...props }: ButtonProps & {\n    edge?: 'start' | 'end';\n}) { return <Portal><div className=\"faye-ui-floating-action\" data-edge={edge}><Button {...props} className={className}/></div></Portal>; }\nexport interface FloatingActionItem {\n    id: string;\n    label: ReactNode;\n    icon?: ReactNode;\n    disabled?: boolean;\n    onSelect: () => void;\n}\nexport interface FloatingActionsProps extends Omit<ComponentProps<typeof Menu.Root>, 'children' | 'orientation'> {\n    label: string;\n    items: readonly FloatingActionItem[];\n    edge?: 'start' | 'end';\n    direction?: 'up' | 'down' | 'start' | 'end';\n    openOnHover?: boolean;\n    triggerProps?: ComponentProps<typeof Menu.Trigger>;\n    positionerProps?: ComponentProps<typeof Menu.Positioner>;\n    popupProps?: ComponentProps<typeof Menu.Popup>;\n}\n/** Accessible directional action dock, with Menu owning focus, hover and dismissal. */\nexport function FloatingActions({ label, items, edge = 'end', direction = 'up', openOnHover = false, triggerProps, positionerProps, popupProps, ...rootProps }: FloatingActionsProps) {\n    const horizontal = direction === 'start' || direction === 'end';\n    const side = direction === 'up' ? 'top' : direction === 'down' ? 'bottom' : direction === 'start' ? 'inline-start' : 'inline-end';\n    const popupClassName = popupProps?.className;\n    const triggerChildren = triggerProps?.children === undefined ? <Icon icon={Plus} className=\"faye-ui-floating-actions-indicator\"/> : triggerProps.children;\n    return <Menu.Root {...rootProps} orientation={horizontal ? 'horizontal' : 'vertical'}><Portal><div className=\"faye-ui-floating-action\" data-edge={edge}><Menu.Trigger openOnHover={openOnHover} render={<IconButton aria-label={label} variant=\"solid\" tone=\"accent\" size=\"lg\">{triggerChildren}</IconButton>} {...triggerProps}/></div></Portal><Menu.Portal><Menu.Positioner side={side} align=\"end\" {...positionerProps}><Menu.Popup {...popupProps} className={typeof popupClassName === 'function' ? state => `faye-ui-floating-actions-popup ${popupClassName(state)}` : ['faye-ui-floating-actions-popup',popupClassName].filter(Boolean).join(' ')} data-direction={direction}>{items.map(item => <Menu.Item key={item.id} disabled={item.disabled} onClick={item.onSelect}>{item.icon && <span aria-hidden=\"true\" className=\"faye-ui-floating-actions-icon\">{item.icon}</span>}<span>{item.label}</span></Menu.Item>)}</Menu.Popup></Menu.Positioner></Menu.Portal></Menu.Root>;\n}\n"]}