@cube-dev/ui-kit 0.114.0 → 0.115.0

package/es/utils/react/useEventBus.js

@@ -1,137 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import React, { createContext, useCallback, useContext, useEffect, useRef, } from 'react';
-const EventBusContext = createContext(null);
-/**
- * EventBusProvider provides a global event system for the application.
- *
- * @example
- * ```tsx
- * function App() {
- *   return (
- *     <EventBusProvider>
- *       <YourComponents />
- *     </EventBusProvider>
- *   );
- * }
- * ```
- */
-export function EventBusProvider({ children }) {
-    const listeners = useRef({});
-    const off = useCallback((event, listener) => {
-        const eventListeners = listeners.current[event];
-        if (eventListeners) {
-            listeners.current[event] = eventListeners.filter((l) => l !== listener);
-            // Clean up empty event arrays
-            if (listeners.current[event].length === 0) {
-                delete listeners.current[event];
-            }
-        }
-    }, []);
-    const emitSync = useCallback((event, data) => {
-        const eventListeners = listeners.current[event];
-        if (eventListeners) {
-            eventListeners.forEach((listener) => listener(data));
-        }
-    }, []);
-    const emit = useCallback((event, data) => {
-        // Use setTimeout to ensure async emission after current render cycle
-        setTimeout(() => {
-            emitSync(event, data);
-        }, 0);
-    }, []);
-    const on = useCallback((event, listener) => {
-        if (!listeners.current[event]) {
-            listeners.current[event] = [];
-        }
-        listeners.current[event].push(listener);
-        // Return cleanup function
-        return () => {
-            off(event, listener);
-        };
-    }, [off]);
-    const contextValue = {
-        emit,
-        emitSync,
-        on,
-        off,
-    };
-    return React.createElement(EventBusContext.Provider, { value: contextValue }, children);
-}
-/**
- * Hook to access the event bus functionality.
- * Must be used within an EventBusProvider.
- *
- * @example
- * ```tsx
- * function Component() {
- *   const { emit, emitSync, on } = useEventBus();
- *
- *   const handleClick = () => {
- *     emit('user-action', { type: 'click', target: 'button' });
- *   };
- *
- *   const handleSyncAction = () => {
- *     emitSync('sync-action', { immediate: true });
- *   };
- *
- *   useEffect(() => {
- *     const unsubscribe = on('data-updated', (data) => {
- *       console.log('Data updated:', data);
- *     });
- *
- *     return unsubscribe;
- *   }, [on]);
- *
- *   return (
- *     <div>
- *       <button onClick={handleClick}>Async Event</button>
- *       <button onClick={handleSyncAction}>Sync Event</button>
- *     </div>
- *   );
- * }
- * ```
- */
-export function useEventBus() {
-    const context = useContext(EventBusContext);
-    if (!context) {
-        throw new Error('useEventBus must be used within an EventBusProvider');
-    }
-    return context;
-}
-/**
- * Convenience hook for subscribing to events with automatic cleanup.
- * The listener will be automatically unsubscribed when the component unmounts
- * or when the dependencies change.
- *
- * @param event - The event name to listen for
- * @param listener - The callback function to execute when the event is emitted
- * @param deps - Dependency array for the effect (similar to useEffect)
- *
- * @example
- * ```tsx
- * function NotificationComponent() {
- *   const [message, setMessage] = useState('');
- *
- *   useEventListener('notification', (data) => {
- *     setMessage(data.message);
- *   }, []);
- *
- *   return <div>{message}</div>;
- * }
- * ```
- */
-export function useEventListener(event, listener, deps = []) {
-    const { on } = useEventBus();
-    useEffect(() => {
-        const unsubscribe = on(event, listener);
-        return unsubscribe;
-    }, [event, on, ...deps]);
-}
-
-        

package/es/utils/react/useId.js

@@ -1,81 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { useSSRSafeId } from '@react-aria/ssr';
-import { useEffect, useRef, useState } from 'react';
-import { useLayoutEffect } from './useLayoutEffect.js';
-let idsUpdaterMap = new Map();
-/**
- * If a default is not provided, generate an id.
- * @param defaultId - Default component id.
- */
-export function useId(defaultId) {
-    let isRendering = useRef(true);
-    isRendering.current = true;
-    let [value, setValue] = useState(defaultId);
-    let nextId = useRef(null);
-    // don't memo this, we want it new each render so that the Effects always run
-    let updateValue = (val) => {
-        if (!isRendering.current) {
-            setValue(val);
-        }
-        else {
-            nextId.current = val;
-        }
-    };
-    useLayoutEffect(() => {
-        isRendering.current = false;
-    });
-    useEffect(() => {
-        let newId = nextId.current;
-        if (newId) {
-            setValue(newId);
-            nextId.current = null;
-        }
-    }, [setValue, updateValue]);
-    let res = useSSRSafeId(value);
-    idsUpdaterMap.set(res, updateValue);
-    return res;
-}
-/**
- * Merges two ids.
- * Different ids will trigger a side-effect and re-render components hooked up with `useId`.
- */
-export function mergeIds(idA, idB) {
-    if (idA === idB) {
-        return idA;
-    }
-    let setIdA = idsUpdaterMap.get(idA);
-    if (setIdA) {
-        setIdA(idB);
-        return idB;
-    }
-    let setIdB = idsUpdaterMap.get(idB);
-    if (setIdB) {
-        setIdB(idA);
-        return idA;
-    }
-    return idB;
-}
-/**
- * Used to generate an id, and after render, check if that id is rendered so we know
- * if we can use it in places such as labelledby.
- */
-export function useSlotId() {
-    let [id, setId] = useState(useId());
-    useLayoutEffect(() => {
-        if (id) {
-            let setCurr = idsUpdaterMap.get(id);
-            if (setCurr && !document.getElementById(id)) {
-                setId(null);
-            }
-        }
-    }, [id]);
-    return id;
-}
-
-        

package/es/utils/react/useIsDarwin.js

@@ -1,42 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { useEffect, useState } from 'react';
-/**
- * useIsDarwin
- * ----------
- * @returns true  – if the browser is running on macOS / iOS
- *          false – otherwise (Windows, Linux, Android…)
- *
- * • Safe to call during server-side rendering: it defaults to `true`
- *   until it can really inspect the client.
- * • Uses the modern UA-Client-Hints platform field where available,
- *   then falls back to navigator.platform, then navigator.userAgent.
- */
-export function useIsDarwin(defaultValue = true) {
-    const [isDarwin, setIsDarwin] = useState(defaultValue);
-    useEffect(() => {
-        if (typeof navigator === 'undefined')
-            return; // ← running on the server
-        // 1 — Prefer UA-CH (Chromium 89+, Edge 94+, Arc, Opera, Android Chrome)
-        const chPlatform = navigator.userAgentData?.platform;
-        if (chPlatform) {
-            setIsDarwin(/mac|iphone|ipad|ipod/i.test(chPlatform));
-            return;
-        }
-        // 2 — Safari & Firefox: navigator.platform is still reliable
-        if (navigator.platform) {
-            setIsDarwin(/mac|iphone|ipad|ipod/i.test(navigator.platform));
-            return;
-        }
-        // 3 — Last-ditch for very old browsers
-        setIsDarwin(/mac|iphone|ipad|ipod/i.test(navigator.userAgent));
-    }, []);
-    return isDarwin;
-}
-
-        

package/es/utils/react/useKeySymbols.js

@@ -1,81 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { useMemo } from 'react';
-import { useIsDarwin } from './useIsDarwin.js';
-/* symbols that are identical on every OS */
-const COMMON = {
-    esc: 'Esc',
-    escape: 'Esc',
-    enter: '⏎',
-    return: '⏎',
-    space: '␣',
-    backspace: '⌫',
-    delete: '⌦',
-    up: '↑',
-    arrowup: '↑',
-    down: '↓',
-    arrowdown: '↓',
-    left: '←',
-    arrowleft: '←',
-    right: '→',
-    arrowright: '→',
-};
-/* modifiers for macOS / iOS */
-const MAC = {
-    mod: '⌘',
-    meta: '⌘',
-    cmd: '⌘',
-    command: '⌘',
-    ctrl: '⌃',
-    control: '⌃',
-    alt: '⌥',
-    option: '⌥',
-    shift: '⇧',
-};
-/* modifiers for Windows / Linux */
-const PC = {
-    mod: 'Ctrl',
-    ctrl: 'Ctrl',
-    control: 'Ctrl',
-    meta: 'Win',
-    win: 'Win',
-    windows: 'Win',
-    cmd: 'Win',
-    command: 'Win',
-    alt: '⎇',
-    option: '⎇',
-    shift: '⇧',
-};
-/**
- * useKeySymbols
- * -------------
- * Turns an author string such as
- *   "mod+k, ctrl+k"
- * into
- *   [["⌘", "K"], ["Ctrl", "K"]]
- */
-export function useKeySymbols(combo) {
-    const isDarwin = useIsDarwin(); // ⌘ by default during SSR
-    const modifiers = isDarwin ? MAC : PC;
-    return useMemo(() => {
-        /** split on commas, trim each alternative */
-        return combo
-            .split(',')
-            .map((raw) => raw.trim().toLowerCase())
-            .filter(Boolean) // drop empty fragments
-            .map((alternative) => alternative.split('+').map((part) => {
-            const key = part.trim();
-            return (modifiers[key] ?? // platform-specific modifier
-                COMMON[key] ?? // shared glyphs
-                part.toUpperCase() // plain key
-            );
-        }));
-    }, [combo, modifiers]);
-}
-
-        

package/es/utils/react/useLayoutEffect.js

@@ -1,14 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import * as React from 'react';
-// During SSR, React emits a warning when calling useLayoutEffect.
-// Since neither useLayoutEffect nor useEffect run on the server,
-// we can suppress this by replacing it with a noop on the server.
-export const useLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
-
-        

package/es/utils/react/useLocalStorage.js

@@ -1,130 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { useCallback, useSyncExternalStore } from 'react';
-import { useEvent } from '../../_internal/hooks/use-event.js';
-/** Global registry of listeners per key for same-tab cross-instance sync */
-const listeners = new Map();
-/** Notify all listeners for a given key */
-function notifyListeners(key) {
-    listeners.get(key)?.forEach((listener) => listener());
-}
-/** Check if localStorage is available */
-function isLocalStorageAvailable() {
-    try {
-        const testKey = '__localStorage_test__';
-        window.localStorage.setItem(testKey, testKey);
-        window.localStorage.removeItem(testKey);
-        return true;
-    }
-    catch {
-        return false;
-    }
-}
-/** Safely parse JSON with fallback */
-function parseJSON(value, fallback) {
-    if (value === null) {
-        return fallback;
-    }
-    try {
-        return JSON.parse(value);
-    }
-    catch {
-        return fallback;
-    }
-}
-/** Get initial value, supporting lazy initializer */
-function getInitialValue(initialValue) {
-    return typeof initialValue === 'function'
-        ? initialValue()
-        : initialValue;
-}
-/**
- * A hook to persist state in localStorage with cross-instance synchronization.
- *
- * Features:
- * - JSON serialization/deserialization
- * - Syncs between hook instances with the same key (same tab)
- * - Syncs across browser tabs via storage event
- * - SSR-safe (gracefully handles missing localStorage)
- * - Supports lazy initial value
- *
- * @param key - The localStorage key. Pass `null` or `undefined` to disable the hook.
- * @param initialValue - Initial value or lazy initializer function
- * @returns Tuple of [value, setValue] similar to useState
- *
- * @example
- * ```tsx
- * // Basic usage
- * const [theme, setTheme] = useLocalStorage('theme', 'light');
- *
- * // With lazy initializer
- * const [settings, setSettings] = useLocalStorage('settings', () => getDefaultSettings());
- *
- * // Disabled (returns initialValue, setValue is no-op)
- * const [value, setValue] = useLocalStorage(null, 'default');
- *
- * // Conditionally enabled
- * const [data, setData] = useLocalStorage(isEnabled ? 'my-key' : null, {});
- * ```
- */
-export function useLocalStorage(key, initialValue) {
-    const resolvedInitial = getInitialValue(initialValue);
-    const subscribe = useCallback((onStoreChange) => {
-        if (!key) {
-            return () => { };
-        }
-        // Add to same-tab listeners
-        if (!listeners.has(key)) {
-            listeners.set(key, new Set());
-        }
-        listeners.get(key).add(onStoreChange);
-        // Listen for cross-tab changes
-        const handleStorageEvent = (event) => {
-            if (event.key === key) {
-                onStoreChange();
-            }
-        };
-        window.addEventListener('storage', handleStorageEvent);
-        return () => {
-            listeners.get(key)?.delete(onStoreChange);
-            if (listeners.get(key)?.size === 0) {
-                listeners.delete(key);
-            }
-            window.removeEventListener('storage', handleStorageEvent);
-        };
-    }, [key]);
-    const getSnapshot = useCallback(() => {
-        if (!key || !isLocalStorageAvailable()) {
-            return resolvedInitial;
-        }
-        return parseJSON(localStorage.getItem(key), resolvedInitial);
-    }, [key, resolvedInitial]);
-    const getServerSnapshot = useCallback(() => {
-        return resolvedInitial;
-    }, [resolvedInitial]);
-    const storedValue = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
-    const setValue = useEvent((update) => {
-        if (!key || !isLocalStorageAvailable()) {
-            return;
-        }
-        const currentValue = parseJSON(localStorage.getItem(key), resolvedInitial);
-        const newValue = typeof update === 'function'
-            ? update(currentValue)
-            : update;
-        try {
-            localStorage.setItem(key, JSON.stringify(newValue));
-            notifyListeners(key);
-        }
-        catch (error) {
-            console.error(`[useLocalStorage] Failed to save "${key}":`, error);
-        }
-    });
-    return [storedValue, setValue];
-}
-
-        

package/es/utils/react/useMergeStyles.js

@@ -1,49 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { useMemo } from 'react';
-import { mergeStyles } from '../../tasty/index.js';
-/**
- * Hook to merge base styles with sub-element style props.
- *
- * This simplifies the common pattern of accepting props like `tabListStyles`,
- * `prefixStyles`, etc. that should merge into `styles.TabList`, `styles.Prefix`, etc.
- *
- * @param styles - Base styles object
- * @param subStylesMap - Mapping of sub-element names to their additional styles
- * @returns Merged styles object
- *
- * @example
- * ```tsx
- * const { styles, tabListStyles, prefixStyles, suffixStyles, ...rest } = props;
- *
- * const mergedStyles = useMergeStyles(styles, {
- *   TabList: tabListStyles,
- *   Prefix: prefixStyles,
- *   Suffix: suffixStyles,
- * });
- *
- * return <TabsElement styles={mergedStyles} {...rest} />;
- * ```
- */
-export function useMergeStyles(styles, subStylesMap) {
-    // Extract values for dependency array - must be stable
-    const subStylesValues = Object.values(subStylesMap);
-    return useMemo(() => {
-        // Build sub-element styles object from the map
-        const subStyles = {};
-        for (const [element, elementStyles] of Object.entries(subStylesMap)) {
-            if (elementStyles != null) {
-                subStyles[element] = elementStyles;
-            }
-        }
-        // Merge base styles with sub-element styles
-        return mergeStyles(styles, subStyles);
-    }, [styles, ...subStylesValues]);
-}
-
-        

package/es/utils/react/useQaProps.js

@@ -1,44 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-/**
- * Processes QA props.
- * If `qa` or `qaVal` props are present, they are not modified and have higher priority.
- * Otherwise, maps `data-qa` to `qa` and `data-qa-val` to `qaVal`.
- * Data attributes are always removed.
- * Modifies the original props object without copying it.
- * Accepts only non-falsy values, otherwise deletes both props.
- *
- * @param props - The object to process
- * @returns The modified object
- */
-export function useQaProps(props) {
-    // Helper function to process qa attributes
-    const processQaAttribute = (propName, dataAttrName) => {
-        if (props[propName] !== undefined || props[dataAttrName] !== undefined) {
-            const propValue = props[propName];
-            const dataAttrValue = props[dataAttrName];
-            if (!propValue) {
-                if (dataAttrValue) {
-                    // If prop is empty but data-attr is truthy, map data-attr to prop
-                    props[propName] = dataAttrValue;
-                }
-                else {
-                    // Both values are falsy, delete both
-                    delete props[propName];
-                }
-            }
-            delete props[dataAttrName];
-        }
-    };
-    // Process qa attributes
-    processQaAttribute('qa', 'data-qa');
-    processQaAttribute('qaVal', 'data-qa-val');
-    return props;
-}
-
-        

package/es/utils/react/useViewportSize.js

@@ -1,53 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { useEffect, useState } from 'react';
-let visualViewport = typeof window !== 'undefined' && window.visualViewport;
-export function useViewportSize(params = {}) {
-    const { isDisabled } = params;
-    let [size, setSize] = useState(() => getViewportSize());
-    useEffect(() => {
-        if (isDisabled) {
-            return;
-        }
-        // Use visualViewport api to track available height even on iOS virtual keyboard opening
-        let onResize = () => {
-            setSize((size) => {
-                let newSize = getViewportSize();
-                if (newSize.width === size.width && newSize.height === size.height) {
-                    return size;
-                }
-                return newSize;
-            });
-        };
-        if (!visualViewport) {
-            window.addEventListener('resize', onResize);
-        }
-        else {
-            visualViewport.addEventListener('resize', onResize);
-        }
-        return () => {
-            if (!visualViewport) {
-                window.removeEventListener('resize', onResize);
-            }
-            else {
-                visualViewport.removeEventListener('resize', onResize);
-            }
-        };
-    }, [isDisabled]);
-    return size;
-}
-function getViewportSize() {
-    return {
-        width: (visualViewport && visualViewport.width) ||
-            (typeof window !== 'undefined' ? window.innerWidth : 0),
-        height: (visualViewport && visualViewport.height) ||
-            (typeof window !== 'undefined' ? window.innerHeight : 0),
-    };
-}
-
-        

package/es/utils/react/wrapNodeIfPlain.js

@@ -1,18 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { isValidElement } from 'react';
-import { isFragment } from 'react-is';
-export function wrapNodeIfPlain(children, render) {
-    const childrenIsFragment = children && (Array.isArray(children) || isFragment(children));
-    if (!children || (!childrenIsFragment && isValidElement(children))) {
-        return children;
-    }
-    return render();
-}
-
-        

package/es/utils/tree.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-export function toFlatTree(tree, includingFolders) {
-    return tree.reduce((result, node) => {
-        if (!node.isLeaf) {
-            result = [
-                ...result,
-                ...(includingFolders ? [node] : []),
-                ...toFlatTree(node.children || [], includingFolders),
-            ];
-        }
-        else {
-            result.push(node);
-        }
-        return result;
-    }, []);
-}
-
-