@itcase/ui 1.9.65 → 1.9.66

package/dist/context/Notifications.js

@@ -1,186 +1,12 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from 'react';
-import { v4 as uuidv4 } from 'uuid';
-import { axiosInstanceITCase } from '@itcase/common';
-const STATUSES = {
-    error: 'error',
-    info: 'info',
-    success: 'success',
-    warning: 'warning',
-};
-const NotificationsContext = createContext([]);
-/* eslint-disable @typescript-eslint/no-unused-vars */
-const NotificationsAPIContext = createContext({
-    hideNotifications: (targetId) => { },
-    showNotification: (notification, onClose) => { },
-    notificationStatuses: STATUSES,
-});
-/* eslint-enable @typescript-eslint/no-unused-vars */
-function NotificationsProvider(props) {
-    const { initialNotificationsList = [], isLogRequestsErrors, children } = props;
-    const [notificationsList, setNotificationsList] = useState(() => {
-        // We need to set id to every notification item and original list also be have new id's
-        return (initialNotificationsList || []).map((notificationItem) => {
-            return createNotification(notificationItem, notificationItem.onClose);
-        });
-    });
-    const hideNotifications = useCallback((targetId) => {
-        // If not target, then nothing to hide
-        if (!targetId) {
-            return;
-        }
-        setNotificationsList((prevNotificationsList) => {
-            const newState = prevNotificationsList.filter((notificationItem) => {
-                // Check on need to hide, if current notification is target for hide
-                const isNeedToHide = String(notificationItem.id) === String(targetId);
-                // Callback for close if exists
-                if (isNeedToHide) {
-                    clearTimeout(notificationItem._closeTimeout);
-                    // @typescript-eslint/no-unused-expressions
-                    notificationItem.onClose && notificationItem.onClose();
-                }
-                // Save in state if no need to hide
-                return !isNeedToHide;
-            });
-            // Set new notifications list without target item to state
-            return newState;
-        });
-    }, []);
-    const showNotification = useCallback((notification, onClose) => {
-        const newNotificationItem = createNotification(notification, onClose);
-        setNotificationsList((prevNotificationsList) => {
-            const newState = prevNotificationsList.slice();
-            const existsNotificationIndex = newState.findIndex((notificationItem) => String(notificationItem.id) === String(newNotificationItem.id));
-            // Add new notification
-            if (existsNotificationIndex === -1) {
-                return [...newState, newNotificationItem];
-            }
-            // Or update exists notification
-            const updatedNotificationItem = newState[existsNotificationIndex];
-            // Clear timeout to avoid close event for updated notification
-            clearTimeout(updatedNotificationItem._closeTimeout);
-            updatedNotificationItem._closeTimeout = undefined;
-            // Replace exists notification by new one
-            newState[existsNotificationIndex] = newNotificationItem;
-            return newState;
-        });
-        if (newNotificationItem.closeByTime) {
-            newNotificationItem._closeTimeout = setTimeout(() => hideNotifications(newNotificationItem.id), newNotificationItem.closeByTime);
-        }
-        return newNotificationItem;
-    }, 
-    // "hideNotifications" is never changed
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    const notificationsAPI = useMemo(() => ({
-        hideNotifications: hideNotifications,
-        notificationStatuses: STATUSES,
-        showNotification: showNotification,
-    }), 
-    // Functions is never changes, no sense to set as dependencies
-    // eslint-disable-next-line
-    []);
-    useEffect(() => {
-        // Set timeout for initial notifications list one time on first render
-        notificationsList.forEach((notificationItem) => {
-            if (notificationItem.closeByTime) {
-                setTimeout(() => hideNotifications(notificationItem.id), notificationItem.closeByTime);
-            }
-        });
-        // Show notifications on all requests errors.
-        // Enable one time without disabling. Use "isLogging" on request config level
-        // to disable notifications logger.
-        if (isLogRequestsErrors) {
-            axiosInstanceITCase.responseErrorHandler.loggerManager = {
-                log: (responseError) => {
-                    if (responseError.message) {
-                        // prevent from showing many network errors
-                        const errorListToDedupe = ['network'];
-                        const id = errorListToDedupe.includes(responseError.key)
-                            ? responseError.key
-                            : undefined;
-                        showNotification({
-                            id: id,
-                            title: responseError.message,
-                            status: 'error',
-                            closeByTime: 4000,
-                        });
-                    }
-                },
-            };
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    return (_jsx(NotificationsAPIContext.Provider, { value: notificationsAPI, children: _jsx(NotificationsContext.Provider, { value: notificationsList, children: children }) }));
-}
-function useNotifications() {
-    return useContext(NotificationsContext);
-}
-function useNotificationsAPI() {
-    return useContext(NotificationsAPIContext);
-}
-const statusToAppearanceList = {
-    error: 'errorPrimary sizeS solid rounded',
-    info: 'infoPrimary sizeS solid rounded',
-    success: 'successPrimary sizeS solid rounded',
-    warning: 'warningPrimary sizeS solid rounded',
-};
-function createNotification(notification, onClose) {
-    // Default notification item properties
-    let id = uuidv4().split('-')[0];
-    let title = '';
-    let text = '';
-    let closeIcon = '';
-    let closeIconSrc = '';
-    let type = 'float';
-    let buttonLabel = '';
-    let status = STATUSES.warning;
-    let closeByTime = 4500;
-    let appearance = statusToAppearanceList[status];
-    let after = null;
-    let isLoading = false;
-    let closeIconAppearance = '';
-    let onClickButton = () => { };
-    if (typeof notification === 'string') {
-        text = notification;
-    }
-    else if (typeof notification === 'object') {
-        id = String(notification.id ?? id);
-        title = notification.title ?? title;
-        text = notification.text ?? text;
-        closeIconAppearance =
-            notification.closeIconAppearance ?? closeIconAppearance;
-        type = notification.type ?? type;
-        closeIcon = notification.closeIcon ?? closeIcon;
-        closeIconSrc = notification.closeIconSrc ?? closeIconSrc;
-        buttonLabel = notification.buttonLabel ?? buttonLabel;
-        onClickButton = notification.onClickButton ?? onClickButton;
-        status = notification.status ?? status;
-        closeByTime = notification.closeByTime ?? closeByTime;
-        isLoading = notification.isLoading ?? isLoading;
-        after = notification.after ?? after;
-        appearance =
-            notification.appearance ??
-                statusToAppearanceList[notification.status] ??
-                appearance;
-    }
-    return {
-        id: id,
-        appearance: appearance,
-        type: type,
-        title: title,
-        status: status,
-        text: text,
-        buttonLabel: buttonLabel,
-        after: after,
-        closeByTime: closeByTime,
-        closeIcon: closeIcon,
-        closeIconAppearance: closeIconAppearance,
-        closeIconSrc: closeIconSrc,
-        isLoading: isLoading,
-        onClickButton: onClickButton,
-        onClose: onClose,
-    };
-}
-export { NotificationsProvider, useNotifications, useNotificationsAPI };
+import 'react/jsx-runtime';
+import 'react';
+import 'uuid';
+import '@itcase/common';
+export { N as NotificationsProvider, j as useNotifications, k as useNotificationsAPI } from '../primitives_es_dSATude_.js';
+import 'clsx';
+import 'lodash/camelCase';
+import 'lodash/castArray';
+import 'lodash/upperFirst';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'react-inlinesvg';

package/dist/context/UIContext.js

@@ -1,70 +1,12 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, memo, useContext, useEffect, useMemo, } from 'react';
-import camelCase from 'lodash/camelCase';
-import { useMediaQueries } from '../hooks/useMediaQueries';
-import { setViewportProperty } from '../utils';
-const UserDeviceContext = createContext({
-    isMobile: false,
-    isTablet: false,
-    isDesktop: false,
-    deviceCurrentMainType: '',
-    deviceCurrentType: '',
-    deviceTypesList: [],
-});
-const UIProvider = memo(function UIProvider(props) {
-    const { userDeviceState = {}, children } = props;
-    /** NOTE:
-     * Remember that the "useMediaQueries" hook works by next scenario:
-     * when changing the device type(browser width), the hook will first "enable"
-     * the new type(set true), and then "disable" the previous one(set false),
-     * what provoke to double rendering, and in moment we have two different types as "true".
-     * We will need to look at how to change this behavior.
-     */
-    const allDevicesTypes = useMediaQueries(userDeviceState);
-    const { isMobile, isTablet, isDesktop, ...fullNamedDeviceTypes } = allDevicesTypes;
-    const deviceCurrentMainType = (isMobile && 'mobile') ||
-        (isTablet && 'tablet') ||
-        (isDesktop && 'desktop') ||
-        '';
-    const [deviceCurrentType, deviceTypesList] = useMemo(() => {
-        const deviceTypesList = Object.keys(allDevicesTypes).map((key) => camelCase(key.replace('is', '')));
-        // In same time "allDevicesTypes" can contain "isMobile" and "isMobileLarge" as true
-        let deviceCurrentType = Object.keys(fullNamedDeviceTypes).find(
-        // If "fullNamedDeviceTypes.isMobileLarge: true" - that our device
-        (key) => fullNamedDeviceTypes[key]);
-        // Or set main type (e.g. "isMobile")
-        if (!deviceCurrentType) {
-            deviceCurrentType = deviceCurrentMainType;
-        }
-        deviceCurrentType = camelCase(deviceCurrentType.replace('is', ''));
-        // On server side render we doesn't known user device and we need to set special word
-        return [deviceCurrentType || '_none_', deviceTypesList];
-    }, [allDevicesTypes, deviceCurrentMainType, fullNamedDeviceTypes]);
-    const deviceContextState = useMemo(() => {
-        return {
-            ...allDevicesTypes,
-            deviceCurrentMainType: deviceCurrentMainType,
-            deviceCurrentType: deviceCurrentType,
-            deviceTypesList: deviceTypesList,
-        };
-    }, [
-        allDevicesTypes,
-        deviceCurrentMainType,
-        deviceCurrentType,
-        deviceTypesList,
-    ]);
-    useEffect(() => {
-        setViewportProperty();
-        window.addEventListener('resize', setViewportProperty);
-    }, []);
-    return (_jsx(UserDeviceContext.Provider, { value: deviceContextState, children: children }));
-});
-function useUserDeviceContext() {
-    const context = useContext(UserDeviceContext);
-    if (!context) {
-        throw new Error('useUserDeviceContext is not defined');
-    }
-    return context;
-}
-export { UIProvider, useUserDeviceContext };
+import 'react/jsx-runtime';
+import 'react';
+import 'lodash/camelCase';
+export { U as UIProvider, e as useUserDeviceContext } from '../primitives_es_dSATude_.js';
+import 'clsx';
+import 'lodash/castArray';
+import 'lodash/upperFirst';
+import 'uuid';
+import '@itcase/common';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'react-inlinesvg';

package/dist/context/UrlAssetPrefix.js

@@ -1,12 +1,12 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useMemo } from 'react';
-const UrlAssetPrefixContext = createContext({
-    assetPrefix: undefined,
-    ignorePathsList: undefined,
-});
-function UrlAssetPrefixProvider(props) {
-    const { assetPrefix, ignorePathsList, children } = props;
-    const value = useMemo(() => ({ assetPrefix, ignorePathsList }), [assetPrefix, ignorePathsList]);
-    return (_jsx(UrlAssetPrefixContext.Provider, { value: value, children: children }));
-}
-export { UrlAssetPrefixContext, UrlAssetPrefixProvider };
+import 'react/jsx-runtime';
+import 'react';
+export { C as UrlAssetPrefixContext, E as UrlAssetPrefixProvider } from '../primitives_es_dSATude_.js';
+import 'clsx';
+import 'lodash/camelCase';
+import 'lodash/castArray';
+import 'lodash/upperFirst';
+import 'uuid';
+import '@itcase/common';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'react-inlinesvg';

package/dist/hoc/urlWithAssetPrefix.js

@@ -1,74 +1,12 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/* eslint-disable @typescript-eslint/no-unused-vars */
-import React, { useContext } from 'react';
-import { formatURL } from '@itcase/common';
-import { UrlAssetPrefixContext } from '../context/UrlAssetPrefix';
-const urlPropsList = ['src', 'imageSrc', 'svgSrc', 'placeholderUrl'];
-/**
- * HOC, который добавляет assetPrefix к URL-пропсам.
- *
- * @template P - Тип пропсов оборачиваемого компонента.
- * @template T - Тип ref (если используется forwardRef).
- * @template Check - Проверка на наличие хотя бы одного URL-пропа.
- *
- * @param WrappedComponent - Компонент, который оборачиваем.
- * @param _error - Проверка: если ни одного URL-пропа нет, будет ошибка компиляции.
- *
- * @example
- * const A = (props: { src?: string }) => <div />;
- * urlWithAssetPrefix(A); // ✅ OK
- *
- * const B = (props: { id: string }) => <div />;
- * urlWithAssetPrefix(B); // ❌ TS ошибка (нет url-пропов)
- */
-const urlWithAssetPrefix = (WrappedComponent, ..._error) => {
-    const HOC = React.forwardRef(function HOC(props, ref) {
-        const { assetPrefix, ignorePathsList } = useContext(UrlAssetPrefixContext);
-        const overrideProps = urlPropsList.reduce((resultProps, propKey) => {
-            let url = props[propKey];
-            if (url && typeof url === 'string') {
-                if (assetPrefix) {
-                    const isNeedAssetPrefix = checkIsNeedAssetPrefix(url, assetPrefix, ignorePathsList);
-                    if (isNeedAssetPrefix) {
-                        const prefixPath = formatURL(assetPrefix).slice(0, -1);
-                        url = `${prefixPath}${url}`;
-                    }
-                }
-                resultProps[propKey] = url;
-            }
-            return resultProps;
-        }, {});
-        return _jsx(WrappedComponent, { ...props, ...overrideProps, ref: ref });
-    });
-    return HOC;
-};
-const checkIsNeedAssetPrefix = (url, assetPrefix, ignorePathsList = []) => {
-    // Ignore prefix if:
-    const isPrefixIgnore = 
-    // Url is absolute
-    url.startsWith('http:') ||
-        url.startsWith('https:') ||
-        // Url is data string
-        url.startsWith('data:') ||
-        // Url already have prefix
-        url.startsWith(assetPrefix);
-    if (isPrefixIgnore) {
-        return false;
-    }
-    // And check special paths for ignore prefix
-    for (const urlPath of ignorePathsList) {
-        if (urlPath instanceof RegExp) {
-            if (urlPath.test(url)) {
-                return false;
-            }
-        }
-        else {
-            if (formatURL(url).startsWith(formatURL(urlPath))) {
-                return false;
-            }
-        }
-    }
-    // Need to add prefix to url
-    return true;
-};
-export { urlWithAssetPrefix };
+import 'react/jsx-runtime';
+import 'react';
+import '@itcase/common';
+export { c as urlWithAssetPrefix } from '../primitives_es_dSATude_.js';
+import 'clsx';
+import 'lodash/camelCase';
+import 'lodash/castArray';
+import 'lodash/upperFirst';
+import 'uuid';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'react-inlinesvg';

package/dist/hooks/useActiveClasses/useActiveClasses.helpers.js

@@ -85,4 +85,5 @@ const formatState = (key) => {
 const toKebabCase = (str) => {
     return str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
 };
+
 export { CLASS_RULES, formatState, toKebabCase };

package/dist/hooks/useActiveClasses/useActiveClasses.interface.js

@@ -59,4 +59,5 @@ const suffix = [
     'Video',
     'Warning',
 ];
+
 export { suffix };

package/dist/hooks/useActiveClasses/useActiveClasses.js

@@ -1,5 +1,6 @@
 import clsx from 'clsx';
-import { CLASS_RULES, formatState, toKebabCase, } from './useActiveClasses.helpers';
+import { CLASS_RULES, toKebabCase, formatState } from './useActiveClasses.helpers.js';
+
 const useActiveClasses = (params) => {
     const { propsGenerator, suffixes = [], isActive, isDisabled } = params;
     const rootClassesArray = [];
@@ -53,4 +54,5 @@ const useActiveClasses = (params) => {
         suffixClasses,
     };
 };
+
 export { useActiveClasses };

package/dist/hooks/useAppearanceConfig/useAppearanceConfig.js

@@ -1,25 +1,12 @@
-import { useMemo } from 'react';
-const useAppearanceConfig = (appearance, componentConfig, isDisabled) => {
-    const appearanceConfig = useMemo(() => {
-        if (appearance) {
-            const appearanceProps = appearance.split(' ').reduce((resultConfig, appearanceKey) => ({
-                ...resultConfig,
-                ...componentConfig.appearance?.[appearanceKey],
-            }), {});
-            if (isDisabled &&
-                (componentConfig?.appearance?.disabled ||
-                    componentConfig?.appearance?.disabledPrimary)) {
-                Object.assign(appearanceProps, componentConfig?.appearance?.disabled ||
-                    componentConfig?.appearance?.disabledPrimary);
-            }
-            return appearanceProps;
-        }
-        if (isDisabled) {
-            return (componentConfig?.appearance?.disabled ||
-                componentConfig?.appearance?.disabledPrimary);
-        }
-        return {};
-    }, [appearance, componentConfig?.appearance, isDisabled]);
-    return appearanceConfig;
-};
-export { useAppearanceConfig };
+import 'react';
+export { d as useAppearanceConfig } from '../../primitives_es_dSATude_.js';
+import 'react/jsx-runtime';
+import 'clsx';
+import 'lodash/camelCase';
+import 'lodash/castArray';
+import 'lodash/upperFirst';
+import 'uuid';
+import '@itcase/common';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'react-inlinesvg';

package/dist/hooks/useDevicePropsGenerator/useDevicePropsGenerator.interface.js

@@ -1 +1 @@
-export {};
+

package/dist/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js

@@ -1,121 +1,12 @@
-import { useMemo } from 'react';
-import camelCase from 'lodash/camelCase';
-import castArray from 'lodash/castArray';
-import upperFirst from 'lodash/upperFirst';
-import { useUserDeviceContext } from '../../context';
-import { getStyleAttributeKey } from '../index.helpers';
-import styleAttributes from '../useStyles/styleAttributes';
-function useDevicePropsGenerator(componentProps, appearanceConfig) {
-    /** Get or generate(classname) a prop depending on the user's device.
-     * Props:
-     *   - "componentProps" - original "props" from component
-     *   - "appearanceConfig" - special appearance dictionary with styles presets
-     *
-     * Usage for create class value:
-     *   const appearanceConfig = (
-     *     appearance && componentConfig.appearance && componentConfig.appearance[appearance]
-     *   )
-     *   const propsGenerator = useDevicePropsGenerator(props, appearanceConfig)
-     *   ---------
-     *   const fillClass = propsGenerator.getClassName('fill')
-     *   "fillClass" - is "surface-secondary"
-     *   ---------
-     *   const fillClass = propsGenerator.getClassName('fill', { prefix: 'fill_' })
-     *   "fillClass" - is "fill_surface-secondary"
-     *   ---------
-     *   const fillClass = propsGenerator.fillClass
-     *   "fillClass" - is "surface-secondary"
-     *   ---------
-     *   const { fillClass } = propsGenerator
-     *   "fillClass" - is "surface-secondary"
-     *
-     * Usage for props value for device:
-     *   const { titleTextSize } = propsGenerator / const titleTextSize = propsGenerator.titleTextSize
-     *
-     *   "titleTextSize" - contain some value from props:
-     *     - titleTextSize
-     *     - titleTextSizeMobile
-     *     - titleTextSizeTablet
-     *     - titleTextSizeDesktop
-     *   ---------
-     **/
-    const { deviceCurrentMainType } = useUserDeviceContext();
-    const devicePropsGenerator = useMemo(() => {
-        const propsGenerator = {
-            getProp(propKey) {
-                const propsForDeviceKey = `${propKey}${upperFirst(deviceCurrentMainType)}`;
-                const valueForDevice = componentProps[propsForDeviceKey];
-                const valueDefault = componentProps[propKey];
-                const appearanceForDevice = appearanceConfig?.[propsForDeviceKey];
-                const appearanceDefault = appearanceConfig?.[propKey];
-                // prettier-ignore
-                const targetPropsValue = (
-                // Value for device from props is first priority
-                valueForDevice ||
-                    // Value without device from props is second priority
-                    valueDefault ||
-                    // Value for device from appearance config is third priority
-                    appearanceForDevice ||
-                    // Value without device from appearance config is last priority
-                    appearanceDefault);
-                return targetPropsValue;
-            },
-            // eslint-disable-next-line perfectionist/sort-objects
-            getClassName(propKey, params) {
-                const { prefix = '', replace = [/([A-Z])/g, '-$1'] } = params || {};
-                const targetClassValue = this.getProp(String(propKey));
-                const styleAttributeKeys = styleAttributes.map((attr) => getStyleAttributeKey(attr));
-                if (styleAttributeKeys.includes(String(propKey)) &&
-                    (typeof targetClassValue === 'number' ||
-                        (typeof targetClassValue === 'string' &&
-                            !isNaN(parseFloat(targetClassValue))))) {
-                    return '';
-                }
-                if (targetClassValue) {
-                    let cleanClassValue = String(targetClassValue);
-                    if (!cleanClassValue.includes('.')) {
-                        cleanClassValue = camelCase(cleanClassValue);
-                    }
-                    if (replace) {
-                        const replaceList = castArray(replace);
-                        cleanClassValue = cleanClassValue.replace(replaceList[0], 
-                        // @ts-expect-error
-                        replaceList[1] || '');
-                    }
-                    // prettier-ignore
-                    return `${prefix}${cleanClassValue}`.toLowerCase();
-                }
-                // If target key not exists in props and appearance config - return empty class
-                return '';
-            },
-        };
-        const generatorProxyHandler = {
-            get(target, propKey, receiver, ...args) {
-                if (typeof propKey === 'string') {
-                    // If object does not have the property being retrieved
-                    if (!Reflect.has(target, propKey)) {
-                        // And property ended on "Class" keyword
-                        if (propKey.endsWith('Class')) {
-                            // prettier-ignore
-                            const shortProp = propKey.substring(0, propKey.lastIndexOf('Class'));
-                            // Return prop from props for device as formatted class name
-                            return target.getClassName(shortProp);
-                        }
-                        // Return prop from props for device
-                        return target.getProp(propKey);
-                    }
-                    // Return object property. Original "get".
-                    // @ts-expect-error
-                    return Reflect.get(target, propKey, receiver, ...args);
-                }
-                // In some cases, like in Chrome browser, sometime "prop" is not string.
-                // We return this object as is.
-                return propKey;
-            },
-        };
-        return new Proxy(propsGenerator, generatorProxyHandler);
-        // TODO: componentProps(react) and appearanceConfig(not memoized) is always new. maybe better check Object.values?
-    }, [componentProps, appearanceConfig, deviceCurrentMainType]);
-    return devicePropsGenerator;
-}
-export { useDevicePropsGenerator };
+import 'react';
+import 'lodash/camelCase';
+import 'lodash/castArray';
+import 'lodash/upperFirst';
+export { a as useDevicePropsGenerator } from '../../primitives_es_dSATude_.js';
+import 'react/jsx-runtime';
+import 'clsx';
+import 'uuid';
+import '@itcase/common';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'react-inlinesvg';