@a11ypros/a11y-ui-components 1.0.0

package/dist/tokens/theme.d.ts

@@ -0,0 +1,159 @@
+export declare const theme: {
+    readonly colors: {
+        readonly primary: {
+            readonly 50: "#f0f9ff";
+            readonly 100: "#e0f2fe";
+            readonly 200: "#bae6fd";
+            readonly 300: "#7dd3fc";
+            readonly 400: "#38bdf8";
+            readonly 500: "#0ea5e9";
+            readonly 600: "#0284c7";
+            readonly 700: "#0369a1";
+            readonly 800: "#075985";
+            readonly 900: "#0c4a6e";
+        };
+        readonly neutral: {
+            readonly 50: "#fafafa";
+            readonly 100: "#f5f5f5";
+            readonly 200: "#bbbbbb";
+            readonly 300: "#d4d4d4";
+            readonly 400: "#a3a3a3";
+            readonly 500: "#737373";
+            readonly 600: "#525252";
+            readonly 700: "#404040";
+            readonly 800: "#262626";
+            readonly 900: "#171717";
+        };
+        readonly success: {
+            readonly 50: "#f0fdf4";
+            readonly 100: "#dcfce7";
+            readonly 200: "#bbf7d0";
+            readonly 300: "#86efac";
+            readonly 400: "#4ade80";
+            readonly 500: "#22c55e";
+            readonly 600: "#16a34a";
+            readonly 700: "#15803d";
+        };
+        readonly warning: {
+            readonly 50: "#fffbeb";
+            readonly 100: "#fef3c7";
+            readonly 200: "#fde68a";
+            readonly 300: "#fcd34d";
+            readonly 400: "#fbbf24";
+            readonly 500: "#f59e0b";
+            readonly 600: "#d97706";
+            readonly 700: "#b45309";
+        };
+        readonly error: {
+            readonly 50: "#fef2f2";
+            readonly 100: "#fee2e2";
+            readonly 200: "#fecaca";
+            readonly 300: "#fca5a5";
+            readonly 400: "#f87171";
+            readonly 500: "#ef4444";
+            readonly 600: "#dc2626";
+            readonly 700: "#b91c1c";
+        };
+        readonly white: "#ffffff";
+        readonly black: "#000000";
+        readonly background: {
+            readonly default: "#ffffff";
+            readonly secondary: "#fafafa";
+            readonly tertiary: "#f5f5f5";
+        };
+        readonly text: {
+            readonly primary: "#171717";
+            readonly secondary: "#525252";
+            readonly tertiary: "#737373";
+            readonly inverse: "#ffffff";
+            readonly disabled: "#a3a3a3";
+        };
+        readonly border: {
+            readonly default: "#bbbbbb";
+            readonly focus: "#0ea5e9";
+            readonly error: "#ef4444";
+        };
+    };
+    readonly spacing: {
+        readonly 0: "0";
+        readonly 1: "0.25rem";
+        readonly 2: "0.5rem";
+        readonly 3: "0.75rem";
+        readonly 4: "1rem";
+        readonly 5: "1.25rem";
+        readonly 6: "1.5rem";
+        readonly 8: "2rem";
+        readonly 10: "2.5rem";
+        readonly 12: "3rem";
+        readonly 16: "4rem";
+        readonly 20: "5rem";
+        readonly 24: "6rem";
+        readonly 32: "8rem";
+    };
+    readonly typography: {
+        readonly fontFamily: {
+            readonly sans: string;
+            readonly mono: string;
+        };
+        readonly fontSize: {
+            readonly xs: "0.75rem";
+            readonly sm: "0.875rem";
+            readonly base: "1rem";
+            readonly lg: "1.125rem";
+            readonly xl: "1.25rem";
+            readonly '2xl': "1.5rem";
+            readonly '3xl': "1.875rem";
+            readonly '4xl': "2.25rem";
+            readonly '5xl': "3rem";
+        };
+        readonly lineHeight: {
+            readonly none: "1";
+            readonly tight: "1.25";
+            readonly snug: "1.375";
+            readonly normal: "1.5";
+            readonly relaxed: "1.625";
+            readonly loose: "2";
+        };
+        readonly fontWeight: {
+            readonly normal: "400";
+            readonly medium: "500";
+            readonly semibold: "600";
+            readonly bold: "700";
+        };
+        readonly letterSpacing: {
+            readonly tighter: "-0.05em";
+            readonly tight: "-0.025em";
+            readonly normal: "0";
+            readonly wide: "0.025em";
+            readonly wider: "0.05em";
+            readonly widest: "0.1em";
+        };
+    };
+    readonly motion: {
+        readonly duration: {
+            readonly fast: "150ms";
+            readonly normal: "200ms";
+            readonly slow: "300ms";
+            readonly slower: "400ms";
+        };
+        readonly easing: {
+            readonly easeIn: "cubic-bezier(0.4, 0, 1, 1)";
+            readonly easeOut: "cubic-bezier(0, 0, 0.2, 1)";
+            readonly easeInOut: "cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly linear: "linear";
+        };
+        readonly reduced: {
+            readonly duration: "0ms";
+            readonly easing: "linear";
+        };
+    };
+    readonly breakpoints: {
+        readonly sm: "640px";
+        readonly md: "768px";
+        readonly lg: "1024px";
+        readonly xl: "1280px";
+        readonly '2xl': "1536px";
+    };
+};
+export type Theme = typeof theme;
+//# sourceMappingURL=theme.d.ts.map

package/dist/tokens/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/tokens/theme.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAMR,CAAA;AAEV,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAA"}

package/dist/tokens/theme.js

@@ -0,0 +1,15 @@
+/**
+ * Central theme export combining all design tokens
+ */
+import { colors } from './colors';
+import { spacing } from './spacing';
+import { typography } from './typography';
+import { motion } from './motion';
+import { breakpoints } from './breakpoints';
+export const theme = {
+    colors,
+    spacing,
+    typography,
+    motion,
+    breakpoints,
+};

package/dist/tokens/typography.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Typography scale with accessible line heights and font sizes
+ * Line heights ensure readability (minimum 1.5 for body text)
+ */
+export declare const typography: {
+    readonly fontFamily: {
+        readonly sans: string;
+        readonly mono: string;
+    };
+    readonly fontSize: {
+        readonly xs: "0.75rem";
+        readonly sm: "0.875rem";
+        readonly base: "1rem";
+        readonly lg: "1.125rem";
+        readonly xl: "1.25rem";
+        readonly '2xl': "1.5rem";
+        readonly '3xl': "1.875rem";
+        readonly '4xl': "2.25rem";
+        readonly '5xl': "3rem";
+    };
+    readonly lineHeight: {
+        readonly none: "1";
+        readonly tight: "1.25";
+        readonly snug: "1.375";
+        readonly normal: "1.5";
+        readonly relaxed: "1.625";
+        readonly loose: "2";
+    };
+    readonly fontWeight: {
+        readonly normal: "400";
+        readonly medium: "500";
+        readonly semibold: "600";
+        readonly bold: "700";
+    };
+    readonly letterSpacing: {
+        readonly tighter: "-0.05em";
+        readonly tight: "-0.025em";
+        readonly normal: "0";
+        readonly wide: "0.025em";
+        readonly wider: "0.05em";
+        readonly widest: "0.1em";
+    };
+};
+export type TypographyToken = typeof typography;
+//# sourceMappingURL=typography.d.ts.map

package/dist/tokens/typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../src/tokens/typography.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuDb,CAAA;AAEV,MAAM,MAAM,eAAe,GAAG,OAAO,UAAU,CAAA"}

package/dist/tokens/typography.js

@@ -0,0 +1,56 @@
+/**
+ * Typography scale with accessible line heights and font sizes
+ * Line heights ensure readability (minimum 1.5 for body text)
+ */
+export const typography = {
+    fontFamily: {
+        sans: [
+            '-apple-system',
+            'BlinkMacSystemFont',
+            '"Segoe UI"',
+            'Roboto',
+            '"Helvetica Neue"',
+            'Arial',
+            'sans-serif',
+        ].join(', '),
+        mono: [
+            'Menlo',
+            'Monaco',
+            '"Courier New"',
+            'monospace',
+        ].join(', '),
+    },
+    fontSize: {
+        xs: '0.75rem', // 12px
+        sm: '0.875rem', // 14px
+        base: '1rem', // 16px
+        lg: '1.125rem', // 18px
+        xl: '1.25rem', // 20px
+        '2xl': '1.5rem', // 24px
+        '3xl': '1.875rem', // 30px
+        '4xl': '2.25rem', // 36px
+        '5xl': '3rem', // 48px
+    },
+    lineHeight: {
+        none: '1',
+        tight: '1.25',
+        snug: '1.375',
+        normal: '1.5', // Minimum for accessibility
+        relaxed: '1.625',
+        loose: '2',
+    },
+    fontWeight: {
+        normal: '400',
+        medium: '500',
+        semibold: '600',
+        bold: '700',
+    },
+    letterSpacing: {
+        tighter: '-0.05em',
+        tight: '-0.025em',
+        normal: '0',
+        wide: '0.025em',
+        wider: '0.05em',
+        widest: '0.1em',
+    },
+};

package/dist/utils/aria.d.ts

@@ -0,0 +1,60 @@
+/**
+ * ARIA utility functions
+ * Helpers for managing ARIA attributes and roles
+ */
+export declare function generateId(prefix?: string): string;
+/**
+ * Get ARIA label from props, preferring aria-label over aria-labelledby
+ */
+export declare function getAriaLabel(ariaLabel?: string, ariaLabelledBy?: string): {
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+};
+/**
+ * Get ARIA describedby attributes
+ */
+export declare function getAriaDescribedBy(describedBy?: string): {
+    'aria-describedby'?: string;
+};
+/**
+ * Combine multiple ARIA describedby IDs
+ */
+export declare function combineAriaDescribedBy(...ids: (string | undefined)[]): string | undefined;
+/**
+ * Get live region attributes
+ */
+export declare function getLiveRegionAttributes(live?: 'polite' | 'assertive' | 'off'): {
+    'aria-live': 'polite' | 'assertive' | 'off';
+    'aria-atomic'?: boolean;
+};
+/**
+ * Get busy state attributes
+ */
+export declare function getBusyAttributes(busy: boolean): {
+    'aria-busy': boolean;
+};
+/**
+ * Get expanded state attributes
+ */
+export declare function getExpandedAttributes(expanded: boolean | undefined): {
+    'aria-expanded'?: boolean;
+};
+/**
+ * Get pressed state attributes (for toggle buttons)
+ */
+export declare function getPressedAttributes(pressed: boolean | undefined): {
+    'aria-pressed'?: boolean;
+};
+/**
+ * Get selected state attributes
+ */
+export declare function getSelectedAttributes(selected: boolean | undefined): {
+    'aria-selected'?: boolean;
+};
+/**
+ * Get current state attributes (for navigation)
+ */
+export declare function getCurrentAttributes(current: boolean | 'page' | 'step' | 'location' | 'date' | 'time' | undefined): {
+    'aria-current'?: boolean | 'page' | 'step' | 'location' | 'date' | 'time';
+};
+//# sourceMappingURL=aria.d.ts.map

package/dist/utils/aria.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"aria.d.ts","sourceRoot":"","sources":["../../src/utils/aria.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAMH,wBAAgB,UAAU,CAAC,MAAM,SAAO,GAAG,MAAM,CAEhD;AAED;;GAEG;AACH,wBAAgB,YAAY,CAC1B,SAAS,CAAC,EAAE,MAAM,EAClB,cAAc,CAAC,EAAE,MAAM,GACtB;IAAE,YAAY,CAAC,EAAE,MAAM,CAAC;IAAC,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAAE,CAQvD;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAChC,WAAW,CAAC,EAAE,MAAM,GACnB;IAAE,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAAE,CAKjC;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,GAAG,GAAG,EAAE,CAAC,MAAM,GAAG,SAAS,CAAC,EAAE,GAAG,MAAM,GAAG,SAAS,CAGzF;AAED;;GAEG;AACH,wBAAgB,uBAAuB,CACrC,IAAI,GAAE,QAAQ,GAAG,WAAW,GAAG,KAAgB,GAC9C;IAAE,WAAW,EAAE,QAAQ,GAAG,WAAW,GAAG,KAAK,CAAC;IAAC,aAAa,CAAC,EAAE,OAAO,CAAA;CAAE,CAK1E;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,OAAO,GAAG;IAAE,WAAW,EAAE,OAAO,CAAA;CAAE,CAEzE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,OAAO,GAAG,SAAS,GAC5B;IAAE,eAAe,CAAC,EAAE,OAAO,CAAA;CAAE,CAG/B;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,OAAO,GAAG,SAAS,GAC3B;IAAE,cAAc,CAAC,EAAE,OAAO,CAAA;CAAE,CAG9B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,OAAO,GAAG,SAAS,GAC5B;IAAE,eAAe,CAAC,EAAE,OAAO,CAAA;CAAE,CAG/B;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAC5E;IAAE,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;CAAE,CAG/E"}

package/dist/utils/aria.js

@@ -0,0 +1,86 @@
+/**
+ * ARIA utility functions
+ * Helpers for managing ARIA attributes and roles
+ */
+/**
+ * Generate a unique ID for ARIA attributes
+ */
+let idCounter = 0;
+export function generateId(prefix = 'id') {
+    return `${prefix}-${++idCounter}`;
+}
+/**
+ * Get ARIA label from props, preferring aria-label over aria-labelledby
+ */
+export function getAriaLabel(ariaLabel, ariaLabelledBy) {
+    if (ariaLabel) {
+        return { 'aria-label': ariaLabel };
+    }
+    if (ariaLabelledBy) {
+        return { 'aria-labelledby': ariaLabelledBy };
+    }
+    return {};
+}
+/**
+ * Get ARIA describedby attributes
+ */
+export function getAriaDescribedBy(describedBy) {
+    if (describedBy) {
+        return { 'aria-describedby': describedBy };
+    }
+    return {};
+}
+/**
+ * Combine multiple ARIA describedby IDs
+ */
+export function combineAriaDescribedBy(...ids) {
+    const validIds = ids.filter((id) => Boolean(id));
+    return validIds.length > 0 ? validIds.join(' ') : undefined;
+}
+/**
+ * Get live region attributes
+ */
+export function getLiveRegionAttributes(live = 'polite') {
+    return {
+        'aria-live': live,
+        'aria-atomic': live !== 'off',
+    };
+}
+/**
+ * Get busy state attributes
+ */
+export function getBusyAttributes(busy) {
+    return { 'aria-busy': busy };
+}
+/**
+ * Get expanded state attributes
+ */
+export function getExpandedAttributes(expanded) {
+    if (expanded === undefined)
+        return {};
+    return { 'aria-expanded': expanded };
+}
+/**
+ * Get pressed state attributes (for toggle buttons)
+ */
+export function getPressedAttributes(pressed) {
+    if (pressed === undefined)
+        return {};
+    return { 'aria-pressed': pressed };
+}
+/**
+ * Get selected state attributes
+ */
+export function getSelectedAttributes(selected) {
+    if (selected === undefined)
+        return {};
+    return { 'aria-selected': selected };
+}
+/**
+ * Get current state attributes (for navigation)
+ */
+export function getCurrentAttributes(current) {
+    if (current === undefined)
+        return {};
+    return { 'aria-current': current };
+}

package/dist/utils/focus.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Focus management utilities
+ * Helpers for programmatic focus control
+ */
+/**
+ * Get all focusable elements within a container
+ */
+export declare function getFocusableElements(container: HTMLElement): HTMLElement[];
+/**
+ * Get the first focusable element in a container
+ */
+export declare function getFirstFocusable(container: HTMLElement): HTMLElement | null;
+/**
+ * Get the last focusable element in a container
+ */
+export declare function getLastFocusable(container: HTMLElement): HTMLElement | null;
+/**
+ * Check if an element is focusable
+ */
+export declare function isFocusable(element: HTMLElement): boolean;
+export declare function saveFocus(): void;
+/**
+ * Restore focus to the previously saved element
+ */
+export declare function restoreFocus(): void;
+/**
+ * Focus an element safely (with error handling)
+ */
+export declare function safeFocus(element: HTMLElement | null): void;
+//# sourceMappingURL=focus.d.ts.map

package/dist/utils/focus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.d.ts","sourceRoot":"","sources":["../../src/utils/focus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,SAAS,EAAE,WAAW,GACrB,WAAW,EAAE,CAWf;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,SAAS,EAAE,WAAW,GAAG,WAAW,GAAG,IAAI,CAG5E;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,WAAW,GAAG,WAAW,GAAG,IAAI,CAG3E;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAQzD;AAOD,wBAAgB,SAAS,IAAI,IAAI,CAIhC;AAED;;GAEG;AACH,wBAAgB,YAAY,IAAI,IAAI,CAKnC;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI,CAS3D"}

package/dist/utils/focus.js

@@ -0,0 +1,80 @@
+/**
+ * Focus management utilities
+ * Helpers for programmatic focus control
+ */
+/**
+ * Get all focusable elements within a container
+ */
+export function getFocusableElements(container) {
+    const focusableSelectors = [
+        'a[href]',
+        'button:not([disabled])',
+        'textarea:not([disabled])',
+        'input:not([disabled])',
+        'select:not([disabled])',
+        '[tabindex]:not([tabindex="-1"])',
+    ].join(', ');
+    return Array.from(container.querySelectorAll(focusableSelectors));
+}
+/**
+ * Get the first focusable element in a container
+ */
+export function getFirstFocusable(container) {
+    const focusable = getFocusableElements(container);
+    return focusable[0] || null;
+}
+/**
+ * Get the last focusable element in a container
+ */
+export function getLastFocusable(container) {
+    const focusable = getFocusableElements(container);
+    return focusable[focusable.length - 1] || null;
+}
+/**
+ * Check if an element is focusable
+ */
+export function isFocusable(element) {
+    if (element.tabIndex < 0)
+        return false;
+    if (element.hasAttribute('disabled'))
+        return false;
+    if (element.hasAttribute('hidden'))
+        return false;
+    if (element.style.display === 'none')
+        return false;
+    if (element.style.visibility === 'hidden')
+        return false;
+    return true;
+}
+/**
+ * Save the currently focused element
+ */
+let savedFocusElement = null;
+export function saveFocus() {
+    if (document.activeElement instanceof HTMLElement) {
+        savedFocusElement = document.activeElement;
+    }
+}
+/**
+ * Restore focus to the previously saved element
+ */
+export function restoreFocus() {
+    if (savedFocusElement) {
+        savedFocusElement.focus();
+        savedFocusElement = null;
+    }
+}
+/**
+ * Focus an element safely (with error handling)
+ */
+export function safeFocus(element) {
+    if (element && typeof element.focus === 'function') {
+        try {
+            element.focus();
+        }
+        catch (error) {
+            // Silently fail if focus fails
+            console.warn('Failed to focus element:', error);
+        }
+    }
+}

package/dist/utils/index.d.ts

@@ -0,0 +1,4 @@
+export * from './aria';
+export * from './keyboard';
+export * from './focus';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA"}

package/dist/utils/index.js

@@ -0,0 +1,3 @@
+export * from './aria';
+export * from './keyboard';
+export * from './focus';

package/dist/utils/keyboard.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Keyboard event utilities
+ * Helpers for handling keyboard interactions
+ */
+export type KeyboardHandler = (event: React.KeyboardEvent) => void;
+/**
+ * Check if a key is an activation key (Enter or Space)
+ */
+export declare function isActivationKey(key: string): boolean;
+/**
+ * Check if a key is an arrow key
+ */
+export declare function isArrowKey(key: string): boolean;
+/**
+ * Check if a key is a navigation key (Home, End, PageUp, PageDown)
+ */
+export declare function isNavigationKey(key: string): boolean;
+/**
+ * Check if a key is an escape key
+ */
+export declare function isEscapeKey(key: string): boolean;
+/**
+ * Check if modifier keys are pressed
+ */
+export declare function hasModifierKey(event: React.KeyboardEvent): boolean;
+/**
+ * Create a keyboard handler that only fires on specific keys
+ */
+export declare function createKeyHandler(keys: string[], handler: KeyboardHandler): KeyboardHandler;
+/**
+ * Create a keyboard handler for activation keys (Enter/Space)
+ */
+export declare function createActivationHandler(handler: KeyboardHandler): KeyboardHandler;
+/**
+ * Create a keyboard handler for arrow keys
+ */
+export declare function createArrowKeyHandler(handler: KeyboardHandler): KeyboardHandler;
+//# sourceMappingURL=keyboard.d.ts.map

package/dist/utils/keyboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard.d.ts","sourceRoot":"","sources":["../../src/utils/keyboard.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,MAAM,eAAe,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAA;AAElE;;GAEG;AACH,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAEpD;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAE/C;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAEpD;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAEhD;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,GAAG,OAAO,CAElE;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,MAAM,EAAE,EACd,OAAO,EAAE,eAAe,GACvB,eAAe,CAMjB;AAED;;GAEG;AACH,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,eAAe,GACvB,eAAe,CAKjB;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,eAAe,GACvB,eAAe,CAEjB"}

package/dist/utils/keyboard.js

@@ -0,0 +1,59 @@
+/**
+ * Keyboard event utilities
+ * Helpers for handling keyboard interactions
+ */
+/**
+ * Check if a key is an activation key (Enter or Space)
+ */
+export function isActivationKey(key) {
+    return key === 'Enter' || key === ' ';
+}
+/**
+ * Check if a key is an arrow key
+ */
+export function isArrowKey(key) {
+    return ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(key);
+}
+/**
+ * Check if a key is a navigation key (Home, End, PageUp, PageDown)
+ */
+export function isNavigationKey(key) {
+    return ['Home', 'End', 'PageUp', 'PageDown'].includes(key);
+}
+/**
+ * Check if a key is an escape key
+ */
+export function isEscapeKey(key) {
+    return key === 'Escape';
+}
+/**
+ * Check if modifier keys are pressed
+ */
+export function hasModifierKey(event) {
+    return event.ctrlKey || event.metaKey || event.altKey || event.shiftKey;
+}
+/**
+ * Create a keyboard handler that only fires on specific keys
+ */
+export function createKeyHandler(keys, handler) {
+    return (event) => {
+        if (keys.includes(event.key)) {
+            handler(event);
+        }
+    };
+}
+/**
+ * Create a keyboard handler for activation keys (Enter/Space)
+ */
+export function createActivationHandler(handler) {
+    return createKeyHandler(['Enter', ' '], (event) => {
+        event.preventDefault();
+        handler(event);
+    });
+}
+/**
+ * Create a keyboard handler for arrow keys
+ */
+export function createArrowKeyHandler(handler) {
+    return createKeyHandler(['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'], handler);
+}