@itcase/ui 1.2.29 → 1.2.31

package/dist/DropdownItem-CFkRx8LX.js

@@ -1,156 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import React, { useRef, useState, useCallback, useEffect } from 'react';
-import clsx from 'clsx';
-import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
-import { useStyles } from './hooks/useStyles.js';
-import { D as Divider } from './Divider-U5UdY-ef.js';
-import { L as Link } from './Link-CzC1kU5C.js';
-import { T as Text } from './Text-kxGZButz.js';
-
-function Dropdown(props) {
-    var after = props.after, before = props.before, animationClose = props.animationClose, animationOpen = props.animationOpen, children = props.children, className = props.className, set = props.set, isOpen = props.isOpen, setIsOpen = props.setIsOpen;
-    var dropdownRef = useRef(null);
-    // const [isOpen, setIsOpen] = useState(false)
-    var _a = useState({
-        className: '',
-    }), animationState = _a[0], setAnimationState = _a[1];
-    var onAnimationEnd = useCallback(function () {
-        // When component is change his visibility(display) in DOM,
-        // animation of close can run unnecessary on showing element.
-        // const dropdownElement = dropdownRef.current
-        setAnimationState(function (prevState) { return ({
-            className: isOpen ? prevState.className : '',
-        }); });
-    }, [isOpen]);
-    useEffect(function () {
-        if (animationOpen && animationClose) {
-            setAnimationState(function () { return ({
-                className: isOpen ? animationOpen : animationClose,
-            }); });
-        }
-    }, [isOpen]);
-    // Close dropdown by click outside
-    useEffect(function () {
-        // Add a handler to keep track of the click target.
-        function onClickWindow(event) {
-            var dropdownElement = dropdownRef.current;
-            if (dropdownElement && animationOpen) {
-                // Is event target inside of dropdown element
-                var isContainsTarget = dropdownElement.contains(event.target);
-                // Is dropdown element has "open" class
-                var hasOpenClass = dropdownElement.classList.contains(animationOpen);
-                if (!isContainsTarget && hasOpenClass) {
-                    // Trigger close event with animation
-                    // dropdownElement.click() - trigger "onClickWindow" again
-                    setIsOpen(false);
-                }
-            }
-        }
-        // Add event listener for current dropdown on first render
-        window.addEventListener('click', onClickWindow);
-        return function () {
-            // Remove event listener for current dropdown on unmount
-            window.removeEventListener('click', onClickWindow);
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    var fillClass = useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'fill',
-    });
-    var fillHoverClass = useDeviceTargetClass(props, {
-        prefix: 'fill_hover_',
-        propsKey: 'fillHover',
-    });
-    var shapeClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown_shape_',
-        propsKey: 'shape',
-    });
-    var elevationClass = useDeviceTargetClass(props, {
-        prefix: 'elevation_',
-        propsKey: 'elevation',
-    });
-    var alignmentClass = useDeviceTargetClass(props, {
-        prefix: 'alignment_',
-        propsKey: 'alignment',
-    });
-    // @ts-expect-error
-    var styles = useStyles(props).styles;
-    return (jsxs("div", { className: clsx(className, 'dropdown', alignmentClass, set && "dropdown_set_".concat(set), shapeClass, elevationClass, isOpen ? 'dropdown_state_open' : 'dropdown_state_close', animationState.className), ref: dropdownRef, style: styles, children: [before, children && (jsx("div", { className: clsx('dropdown__wrapper', fillClass, fillHoverClass), 
-                // Add "onAnimationEnd" only for wrapper for ignore dropdown button
-                onAnimationEnd: onAnimationEnd, children: children })), after] }));
-}
-Dropdown.defaultProps = {
-    animationOpen: 'dropdown_animation_open',
-    animationClose: 'dropdown_animation_close',
-    set: 'normal',
-};
-
-function DropdownItem(props) {
-    var after = props.after, before = props.before, children = props.children, className = props.className, desc = props.desc, descTextColor = props.descTextColor, descTextColorHover = props.descTextColorHover, descTextGradient = props.descTextGradient, descTextSize = props.descTextSize, descTextStyle = props.descTextStyle, descTextWeight = props.descTextWeight, descTextWrap = props.descTextWrap, dividerDirection = props.dividerDirection, dividerFill = props.dividerFill, dividerSize = props.dividerSize, href = props.href, label = props.label, labelTextAlign = props.labelTextAlign, labelTextColor = props.labelTextColor, labelTextColorActive = props.labelTextColorActive, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, set = props.set, showDivider = props.showDivider, target = props.target, underline = props.underline, isActive = props.isActive, isHover = props.isHover, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
-    var alignDirectionClass = useDeviceTargetClass(props, {
-        prefix: 'align_',
-        propsKey: 'alignDirection',
-    });
-    var alignClass = useDeviceTargetClass(props, {
-        prefix: 'align_',
-        propsKey: 'align',
-    });
-    var directionClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown__item_direction_',
-        propsKey: 'direction',
-    });
-    var fillClass = useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'fill',
-    });
-    var fillHoverClass = useDeviceTargetClass(props, {
-        prefix: 'fill_hover_',
-        propsKey: 'fillHover',
-    });
-    var fillActiveClass = useDeviceTargetClass(props, {
-        prefix: 'fill_active_',
-        propsKey: 'fillActive',
-    });
-    var fillActiveHoverClass = useDeviceTargetClass(props, {
-        prefix: 'fill_active_hover_',
-        propsKey: 'fillActiveHover',
-    });
-    var fillDisabledClass = useDeviceTargetClass(props, {
-        prefix: 'fill_disabled_',
-        propsKey: 'fillDisabled',
-    });
-    useDeviceTargetClass(props, {
-        propsKey: 'linkFill',
-    });
-    var sizeClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown__item_size_',
-        propsKey: 'size',
-    });
-    var shapeClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown__item_shape_',
-        propsKey: 'shape',
-    });
-    var justifyContentClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown__item_justify-content_',
-        propsKey: 'justifyContent',
-    });
-    var typeClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown__item_type_',
-        propsKey: 'type',
-    });
-    var widthClass = useDeviceTargetClass(props, {
-        prefix: 'dropdown__item_width_',
-        propsKey: 'width',
-    });
-    // @ts-expect-error
-    var dropdownItem = useStyles(props).styles;
-    return (jsxs("div", { className: clsx('dropdown__item', isActive && 'dropdown__item_state_active', isHover && 'dropdown__item_state_hover', directionClass, className, fillClass, fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, sizeClass, shapeClass, typeClass, widthClass, onClick && 'cursor_type_pointer', set && "dropdown__item_set_".concat(set), justifyContentClass), style: dropdownItem, onClick: onClick, onMouseEnter: onMouseEnter, children: [jsx("div", { className: "dropdown__item-wrapper", children: jsx(Link, { href: link || href, className: clsx('dropdown__item-link', alignDirectionClass, alignClass), underline: underline, fill: linkFill, target: target, rel: rel, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [label && (jsx(Text, { className: "dropdown__item-label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: isActive ? labelTextColorActive : undefined, textColorHover: labelTextColorHover, textColorGradient: labelTextGradient, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), desc && (jsx(Text, { className: "dropdown__item-desc", size: descTextSize, textColor: descTextColor, textColorHover: descTextColorHover, textColorGradient: descTextGradient, textStyle: descTextStyle, textWeight: descTextWeight, textWrap: descTextWrap, children: desc }))] })), after] }) }) }), showDivider && (jsx(Divider, { direction: dividerDirection, fill: dividerFill || 'surfaceTertiary', size: dividerSize, width: "fill" }))] }));
-}
-DropdownItem.defaultProps = {
-    size: 'l',
-    LinkComponent: 'a',
-    width: 'fixed',
-};
-
-export { Dropdown as D, DropdownItem as a };

package/dist/Loader-CU_5Ydmy.js

@@ -1,53 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import clsx from 'clsx';
-import { loaderAppearance } from './appearance/Loader.js';
-import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
-import { useStyles } from './hooks/useStyles.js';
-import { T as Text } from './Text-kxGZButz.js';
-
-// TODO: is better to use context?
-var loaderConfig = {
-    appearance: loaderAppearance,
-    setAppearance: function (newComponent) {
-        loaderConfig.appearance = newComponent;
-    },
-};
-function Loader(props) {
-    var _a;
-    var children = props.children, appearance = props.appearance, className = props.className, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize;
-    var itemFillClass = useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'itemFill',
-    });
-    var fillClass = useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'fill',
-    });
-    var widthClass = useDeviceTargetClass(props, {
-        prefix: 'width_',
-        propsKey: 'width',
-    });
-    var heightClass = useDeviceTargetClass(props, {
-        prefix: 'height_',
-        propsKey: 'height',
-    });
-    var positionClass = useDeviceTargetClass(props, {
-        prefix: 'position_',
-        propsKey: 'position',
-    });
-    // @ts-expect-error
-    var loader = useStyles(props).styles;
-    var appearanceConfig = appearance && loaderConfig.appearance && loaderConfig.appearance[appearance];
-    /*
-     * TODO: set temporary variables by other way
-     */
-    var temporaryFillClass = fillClass ||
-        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
-            "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase());
-    var temporaryItemFillClass = itemFillClass ||
-        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.itemFill) &&
-            "fill_".concat((_a = appearanceConfig.itemFill) === null || _a === void 0 ? void 0 : _a.replace(/([A-Z])/g, '-$1')).toLowerCase());
-    return (jsxs("div", { className: clsx('loader', positionClass, widthClass, heightClass, temporaryFillClass, className, set && "loader_set_".concat(set)), style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', temporaryItemFillClass) }), jsx("span", { className: clsx('loader__item', temporaryItemFillClass) }), jsx("span", { className: clsx('loader__item', temporaryItemFillClass) })] })), text && (jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
-}
-
-export { Loader as L, loaderConfig as l };

package/dist/Loader-Ck59IXGG.js

@@ -1,56 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var index = require('./cjs/appearance/Loader.js');
-var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
-var useStyles = require('./cjs/hooks/useStyles.js');
-var Text = require('./Text-CC0xnhmx.js');
-
-// TODO: is better to use context?
-var loaderConfig = {
-    appearance: index.loaderAppearance,
-    setAppearance: function (newComponent) {
-        loaderConfig.appearance = newComponent;
-    },
-};
-function Loader(props) {
-    var _a;
-    var children = props.children, appearance = props.appearance, className = props.className, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize;
-    var itemFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'itemFill',
-    });
-    var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'fill',
-    });
-    var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'width_',
-        propsKey: 'width',
-    });
-    var heightClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'height_',
-        propsKey: 'height',
-    });
-    var positionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'position_',
-        propsKey: 'position',
-    });
-    // @ts-expect-error
-    var loader = useStyles.useStyles(props).styles;
-    var appearanceConfig = appearance && loaderConfig.appearance && loaderConfig.appearance[appearance];
-    /*
-     * TODO: set temporary variables by other way
-     */
-    var temporaryFillClass = fillClass ||
-        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
-            "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase());
-    var temporaryItemFillClass = itemFillClass ||
-        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.itemFill) &&
-            "fill_".concat((_a = appearanceConfig.itemFill) === null || _a === void 0 ? void 0 : _a.replace(/([A-Z])/g, '-$1')).toLowerCase());
-    return (jsxRuntime.jsxs("div", { className: clsx('loader', positionClass, widthClass, heightClass, temporaryFillClass, className, set && "loader_set_".concat(set)), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', temporaryItemFillClass) }), jsxRuntime.jsx("span", { className: clsx('loader__item', temporaryItemFillClass) }), jsxRuntime.jsx("span", { className: clsx('loader__item', temporaryItemFillClass) })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
-}
-
-exports.Loader = Loader;
-exports.loaderConfig = loaderConfig;

package/dist/types/constants/componentProps/align.d.ts

@@ -1,2 +0,0 @@
-export default alignProps;
-declare const alignProps: (string | null)[];

package/dist/types/constants/componentProps/alignDirection.d.ts

@@ -1,2 +0,0 @@
-export default alignDirectionProps;
-declare const alignDirectionProps: (string | null)[];

package/dist/types/constants/componentProps/fill.d.ts

@@ -1,2 +0,0 @@
-export default fillProps;
-declare const fillProps: (string | null)[];

package/dist/types/constants/componentProps/horizontalResizeMode.d.ts

@@ -1,2 +0,0 @@
-export default horizontalResizeModeProps;
-declare const horizontalResizeModeProps: (string | null)[];

package/dist/types/constants/componentProps/position.d.ts

@@ -1,2 +0,0 @@
-export default positionProps;
-declare const positionProps: (string | null)[];

package/dist/types/constants/componentProps/verticalResizeMode.d.ts

@@ -1,2 +0,0 @@
-export default verticalResizeModeProps;
-declare const verticalResizeModeProps: (string | null)[];